SlideShare une entreprise Scribd logo
1  sur  16
JavaScript Libraries




 JavaScript Makes Things Sexy
Overview
Objective

Learn the basics of adding JavaScript and CSS in
ProdigyView.

Requirements

 Understanding of the DEFINES
Estimated Time

10 Minutes
Follow Along With Code
               Example
1. Download a copy of the example code at
  www.prodigyview.com/source.
2. Install the system in an environment you feel comfortable testing
  in.
3. Proceed to examples/system/Libraries_Javascript.php
Separation of Libraries
ProdigyView natively support 5 different file types that can be added
to PVLibraries. 1 of them is CSS, and the others are variations of
JavaScript and JavaScript Frameworks.



                              Prototype

                 JQuery                         CSS




         Javascript            PVLibraries          Mootools
Queuing Libraries

Add JavaScript files


Add JQuery Files


Add Prototype Files


Add Mootools Files


Add CSS Files
Queued Scripts
Queuing a script does not actually add the script into the
code, but creates a reference to that script.

It is up to the developer to tell where that script exist. An
easy way of placing the scripts is using the defines
discussed in an earlier tutorial.
Adding Open Script
 Unlike the other files that pertain to a certain type, open
 script is any type of content(JavaScript, meta
 tags, properties, etc). How you add your content to open
 script is exactly how it will be outputted later.


1. Explicitly write the full script




                                      2. Add the script to the open script queue
Javascript Libraries
The first library we are going to pull is the regular
JavaScript files added. Technically any kind of JavaScript
file can be queued and pulled, but any files queued to the
JavaScript queue should be stored in the same location
as the PV_JAVASCRIPT define.

1. Pull the queue and return an array




                  2. Use the PV_JAVASCRIPT to set the location of your script
JQuery Libraries
Similar to how we retrieved the JavaScript libraries, we
can also get the queued JQuery files. The JQuery
define, PV_JQUERY, should be used in this instance as
the location where the file exist.
Prototype Libraries
Our next files to retrieve are the libraries specific to
prototype. Prototype libraries used the PV_PROTOTYPE
define for the location where the script exist.
Mootools Libraries
Our last natively supported JavaScript library files is
mootools. The mootools files should correspond with the
PV_MOOTOOLS define.
CSS Files
The css files that were originally added to PVLibraries can
be retrieved at anytime as well. The PV_CSS defines sets
their location.
Retrieving Open Script
Open scripting, being that it is any information that you want to
pass the header, does not have a set location nor needs to be
iterated through. It simply comes back as a string of text that
needs to be printed out.
Output
If you ran the example as a script, your output should look
like below.
Heads Up!
The real importance of learning how to queue libraries is
because these libraries are tightly integrated with the
template manager in ProdigyView.

In the tutorials on the templating system, you will learn
how to pull these libraries directly into your html and have
them be formatted.
API Reference
For a better understanding of the libraries, visit the api by
clicking on the link below.

PVLibraries




                 More Tutorials
For more tutorials, please visit:

http://www.prodigyview.com/tutorials


                       www.prodigyview.com

Contenu connexe

Tendances

Comparative Development Methodologies
Comparative Development MethodologiesComparative Development Methodologies
Comparative Development Methodologies
elliando dias
 
Java Consulting tips for Beginners
Java Consulting tips for BeginnersJava Consulting tips for Beginners
Java Consulting tips for Beginners
Sathish Chittibabu
 
Robot framework
Robot frameworkRobot framework
Robot framework
boriau
 

Tendances (20)

Robot Framework Dos And Don'ts
Robot Framework Dos And Don'tsRobot Framework Dos And Don'ts
Robot Framework Dos And Don'ts
 
PHPCS (PHP Code Sniffer)
PHPCS (PHP Code Sniffer)PHPCS (PHP Code Sniffer)
PHPCS (PHP Code Sniffer)
 
Robot framework
Robot frameworkRobot framework
Robot framework
 
Comparative Development Methodologies
Comparative Development MethodologiesComparative Development Methodologies
Comparative Development Methodologies
 
XPDays-2018
XPDays-2018XPDays-2018
XPDays-2018
 
Automated Infrastructure Testing
Automated Infrastructure TestingAutomated Infrastructure Testing
Automated Infrastructure Testing
 
Robot framework Gowthami Goli
Robot framework Gowthami GoliRobot framework Gowthami Goli
Robot framework Gowthami Goli
 
Shell programming assignment 2
Shell programming assignment 2Shell programming assignment 2
Shell programming assignment 2
 
Robot framework
Robot frameworkRobot framework
Robot framework
 
A walkthrough of JavaScript ES6 features
A walkthrough of JavaScript ES6 featuresA walkthrough of JavaScript ES6 features
A walkthrough of JavaScript ES6 features
 
TDD on OSGi, in practice.
TDD on OSGi, in practice.TDD on OSGi, in practice.
TDD on OSGi, in practice.
 
Java Consulting tips for Beginners
Java Consulting tips for BeginnersJava Consulting tips for Beginners
Java Consulting tips for Beginners
 
Acceptance Test Driven Development and Robot Framework
Acceptance Test Driven Development and Robot FrameworkAcceptance Test Driven Development and Robot Framework
Acceptance Test Driven Development and Robot Framework
 
Performance testing locust
Performance testing   locustPerformance testing   locust
Performance testing locust
 
Sphinx + robot framework = documentation as result of functional testing
Sphinx + robot framework = documentation as result of functional testingSphinx + robot framework = documentation as result of functional testing
Sphinx + robot framework = documentation as result of functional testing
 
Introduction to Robot Framework (external)
Introduction to Robot Framework (external)Introduction to Robot Framework (external)
Introduction to Robot Framework (external)
 
Robot framework
Robot frameworkRobot framework
Robot framework
 
Telosys tutorial - Code generation for a Python web application based on Bott...
Telosys tutorial - Code generation for a Python web application based on Bott...Telosys tutorial - Code generation for a Python web application based on Bott...
Telosys tutorial - Code generation for a Python web application based on Bott...
 
Module 2: C# 3.0 Language Enhancements (Slides)
Module 2: C# 3.0 Language Enhancements (Slides)Module 2: C# 3.0 Language Enhancements (Slides)
Module 2: C# 3.0 Language Enhancements (Slides)
 
Testing and symfony2
Testing and symfony2Testing and symfony2
Testing and symfony2
 

Similaire à Javascript And CSS Libraries

Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)
Ivy Rueb
 
Chapter15-Presentation.pptx
Chapter15-Presentation.pptxChapter15-Presentation.pptx
Chapter15-Presentation.pptx
GFRomano
 

Similaire à Javascript And CSS Libraries (20)

Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)
 
Java interview questions and answers
Java interview questions and answersJava interview questions and answers
Java interview questions and answers
 
Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)
 
How to Create a Custom WordPress Plugin
How to Create a Custom WordPress PluginHow to Create a Custom WordPress Plugin
How to Create a Custom WordPress Plugin
 
Java J2EE Interview Question Part 2
Java J2EE Interview Question Part 2Java J2EE Interview Question Part 2
Java J2EE Interview Question Part 2
 
Java J2EE Interview Questions Part 2
Java J2EE Interview Questions Part 2Java J2EE Interview Questions Part 2
Java J2EE Interview Questions Part 2
 
Composer namespacing
Composer namespacingComposer namespacing
Composer namespacing
 
Lecture11_LaravelGetStarted_SPring2023.pdf
Lecture11_LaravelGetStarted_SPring2023.pdfLecture11_LaravelGetStarted_SPring2023.pdf
Lecture11_LaravelGetStarted_SPring2023.pdf
 
Codeigniter
CodeigniterCodeigniter
Codeigniter
 
Lightning web components
Lightning web components Lightning web components
Lightning web components
 
Code Generation idioms with Xtend
Code Generation idioms with XtendCode Generation idioms with Xtend
Code Generation idioms with Xtend
 
Maven Introduction
Maven IntroductionMaven Introduction
Maven Introduction
 
Chapter15-Presentation.pptx
Chapter15-Presentation.pptxChapter15-Presentation.pptx
Chapter15-Presentation.pptx
 
Advanced JavaScript
Advanced JavaScriptAdvanced JavaScript
Advanced JavaScript
 
PHP Libraries
PHP LibrariesPHP Libraries
PHP Libraries
 
Third party libraries and OSGi - a complicated relationship
Third party libraries and OSGi - a complicated relationshipThird party libraries and OSGi - a complicated relationship
Third party libraries and OSGi - a complicated relationship
 
Learn react by Etietop Demas
Learn react by Etietop DemasLearn react by Etietop Demas
Learn react by Etietop Demas
 
Developing Java Web Applications
Developing Java Web ApplicationsDeveloping Java Web Applications
Developing Java Web Applications
 
Implementing auto complete using JQuery
Implementing auto complete using JQueryImplementing auto complete using JQuery
Implementing auto complete using JQuery
 
Flask
FlaskFlask
Flask
 

Plus de ProdigyView

Plus de ProdigyView (20)

Installing Plug-ins
Installing Plug-insInstalling Plug-ins
Installing Plug-ins
 
Building An Application
Building An ApplicationBuilding An Application
Building An Application
 
Installing Applications
Installing ApplicationsInstalling Applications
Installing Applications
 
Video Content Management
Video Content ManagementVideo Content Management
Video Content Management
 
Audio Content Management
Audio Content ManagementAudio Content Management
Audio Content Management
 
File Content Management
File Content ManagementFile Content Management
File Content Management
 
Email Configuration
Email ConfigurationEmail Configuration
Email Configuration
 
HTML5 Tags and Elements Tutorial
HTML5 Tags and Elements TutorialHTML5 Tags and Elements Tutorial
HTML5 Tags and Elements Tutorial
 
HTML Forms Tutorial
HTML Forms TutorialHTML Forms Tutorial
HTML Forms Tutorial
 
Html Tags Tutorial
Html Tags TutorialHtml Tags Tutorial
Html Tags Tutorial
 
Video Conversion PHP
Video Conversion PHPVideo Conversion PHP
Video Conversion PHP
 
Sending Email Basics PHP
Sending Email Basics PHPSending Email Basics PHP
Sending Email Basics PHP
 
Tools ProdigyView
Tools ProdigyViewTools ProdigyView
Tools ProdigyView
 
Custom Validation PHP
Custom Validation PHPCustom Validation PHP
Custom Validation PHP
 
Basic File Cache Tutorial - PHP
Basic File Cache Tutorial - PHPBasic File Cache Tutorial - PHP
Basic File Cache Tutorial - PHP
 
Understanding Web Cache
Understanding Web CacheUnderstanding Web Cache
Understanding Web Cache
 
SQL Prepared Statements Tutorial
SQL Prepared Statements TutorialSQL Prepared Statements Tutorial
SQL Prepared Statements Tutorial
 
Database Basics
Database BasicsDatabase Basics
Database Basics
 
Implementing the Adapter Design Pattern
Implementing the Adapter Design PatternImplementing the Adapter Design Pattern
Implementing the Adapter Design Pattern
 
Intercepting Filters Design Pattern
Intercepting Filters Design PatternIntercepting Filters Design Pattern
Intercepting Filters Design Pattern
 

Dernier

TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc
 
“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf
“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf
“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf
Muhammad Subhan
 
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
FIDO Alliance
 

Dernier (20)

Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
 
Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024
 
Intro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджераIntro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджера
 
Design Guidelines for Passkeys 2024.pptx
Design Guidelines for Passkeys 2024.pptxDesign Guidelines for Passkeys 2024.pptx
Design Guidelines for Passkeys 2024.pptx
 
ADP Passwordless Journey Case Study.pptx
ADP Passwordless Journey Case Study.pptxADP Passwordless Journey Case Study.pptx
ADP Passwordless Journey Case Study.pptx
 
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
TrustArc Webinar - Unified Trust Center for Privacy, Security, Compliance, an...
 
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
 
Observability Concepts EVERY Developer Should Know (DevOpsDays Seattle)
Observability Concepts EVERY Developer Should Know (DevOpsDays Seattle)Observability Concepts EVERY Developer Should Know (DevOpsDays Seattle)
Observability Concepts EVERY Developer Should Know (DevOpsDays Seattle)
 
Event-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream ProcessingEvent-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream Processing
 
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
 
ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...
ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...
ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...
 
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The InsideCollecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
 
“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf
“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf
“Iamnobody89757” Understanding the Mysterious of Digital Identity.pdf
 
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfHow Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdf
 
Overview of Hyperledger Foundation
Overview of Hyperledger FoundationOverview of Hyperledger Foundation
Overview of Hyperledger Foundation
 
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
 
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...Hyatt driving innovation and exceptional customer experiences with FIDO passw...
Hyatt driving innovation and exceptional customer experiences with FIDO passw...
 
Working together SRE & Platform Engineering
Working together SRE & Platform EngineeringWorking together SRE & Platform Engineering
Working together SRE & Platform Engineering
 
Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024
 

Javascript And CSS Libraries

  • 2. Overview Objective Learn the basics of adding JavaScript and CSS in ProdigyView. Requirements  Understanding of the DEFINES Estimated Time 10 Minutes
  • 3. Follow Along With Code Example 1. Download a copy of the example code at www.prodigyview.com/source. 2. Install the system in an environment you feel comfortable testing in. 3. Proceed to examples/system/Libraries_Javascript.php
  • 4. Separation of Libraries ProdigyView natively support 5 different file types that can be added to PVLibraries. 1 of them is CSS, and the others are variations of JavaScript and JavaScript Frameworks. Prototype JQuery CSS Javascript PVLibraries Mootools
  • 5. Queuing Libraries Add JavaScript files Add JQuery Files Add Prototype Files Add Mootools Files Add CSS Files
  • 6. Queued Scripts Queuing a script does not actually add the script into the code, but creates a reference to that script. It is up to the developer to tell where that script exist. An easy way of placing the scripts is using the defines discussed in an earlier tutorial.
  • 7. Adding Open Script Unlike the other files that pertain to a certain type, open script is any type of content(JavaScript, meta tags, properties, etc). How you add your content to open script is exactly how it will be outputted later. 1. Explicitly write the full script 2. Add the script to the open script queue
  • 8. Javascript Libraries The first library we are going to pull is the regular JavaScript files added. Technically any kind of JavaScript file can be queued and pulled, but any files queued to the JavaScript queue should be stored in the same location as the PV_JAVASCRIPT define. 1. Pull the queue and return an array 2. Use the PV_JAVASCRIPT to set the location of your script
  • 9. JQuery Libraries Similar to how we retrieved the JavaScript libraries, we can also get the queued JQuery files. The JQuery define, PV_JQUERY, should be used in this instance as the location where the file exist.
  • 10. Prototype Libraries Our next files to retrieve are the libraries specific to prototype. Prototype libraries used the PV_PROTOTYPE define for the location where the script exist.
  • 11. Mootools Libraries Our last natively supported JavaScript library files is mootools. The mootools files should correspond with the PV_MOOTOOLS define.
  • 12. CSS Files The css files that were originally added to PVLibraries can be retrieved at anytime as well. The PV_CSS defines sets their location.
  • 13. Retrieving Open Script Open scripting, being that it is any information that you want to pass the header, does not have a set location nor needs to be iterated through. It simply comes back as a string of text that needs to be printed out.
  • 14. Output If you ran the example as a script, your output should look like below.
  • 15. Heads Up! The real importance of learning how to queue libraries is because these libraries are tightly integrated with the template manager in ProdigyView. In the tutorials on the templating system, you will learn how to pull these libraries directly into your html and have them be formatted.
  • 16. API Reference For a better understanding of the libraries, visit the api by clicking on the link below. PVLibraries More Tutorials For more tutorials, please visit: http://www.prodigyview.com/tutorials www.prodigyview.com