THE BASICS: HOW TO LOAD JQUERY?
The PowerPac enables loading jQuery dynamically, or whenever it is expressly needed. This involves making a single call to the PowerPac function pgExtFiles(). You can place an action to call this function with the on book load event, the on load page event for the first page of your book, or at any time in the structure of your application where the plugin is needed.
THE TWO WAYS TO LOAD JQUERY:
- TOP-LEVEL: This means the plugin is available to the all pages of your book at all times and during navigation. It also means that you will have access to the window component in which the ToolBook application is running. This is generally the preferred way to load the JQuery library.
- Loading JQuery TOP-LEVEL
- Image 2.png (48.4 KiB) Viewed 4393 times
Notice in this example that we set the parameter special = true to force the script to load top-level. In addition, in this example we are using the CDN version of JQuery which is hosted on google. Of course, you can download JQuery and load a minified or other version which you include with your exported content.
Once loaded, the script will show in the <head> tag of the main browser window dependencies as shown in this exported HTML example. Notice that the yellow highlighted area of the HTML source is where the ToolBook content is loading. However, our JQuery plugin is loaded above that, which makes is available to everything on the page, including the ToolBook application.- Firebug HTML page source
- Image 3.png (30.67 KiB) Viewed 4393 times
- ToolBook FRAME-LEVEL: In the case below, we simply change the parameter special to false (the default) and this forces the JQuery script to load in (or for) the ToolBook frame only.
- Loading ToolBook content level
- Image 4.png (24.12 KiB) Viewed 4393 times
NOTE: If JQuery is loaded at this level, it must be loaded for EVERY PAGE where its services are needed. In addition, the services of JQuery will NOT be available to the main window which contains the ToolBook application.
Notice the difference when we look at the HTML source of our exported page:- JQuery loaded at ToolBook frame level
- Image 6.png (62.61 KiB) Viewed 4393 times
ADDING JQUERY PLUGINS:
To add scripts for JQuery plugins which further extend or add behavior to your application, simply call pgExtFiles() again and specify the plugin URL. You must load the plugin in the same context that you loaded the original JQuery library.
HOW DO I ACTUALLY USE JQUERY OR ONE OF ITS PLUGINS?
To actually use the JQuery library or any of its plugins is beyond the scope of this forum topic. However, if you need assistance in getting your plugins to behave as expected please contact me at [email protected] and I would be glad to take a look or provide a small fee-based service to assist you.