Including JavaScript libraries - nth-iteration/savvy GitHub Wiki

Savvy executes the Presenter code of card, header and footer views in separately scoped closures, inaccessible to other scripts. This means that objects and variables declared in one script file are not automatically available to another.

This is useful when working with scripts intended to manage individual Views. It allows each script to concentrate on presenting a particular View in the Model-View-Presenter paradigm. It also means that the same object and variable names can be used in different scripts without conflict.

However, it is not suitable for including libraries that are indented to be used by other scripts. It would mean, for example, that if jQuery was included on a card View then $ (or the jQuery object) would be inaccessible by other scripts, making it rather useless.

There are two primary ways to include libraries in Savvy projects:

  1. Add the library to the global View
  2. Include the library using a third-party script-loading library

Option 1: Adding a library globally

To add a JavaScript file globally (and so have it available to all scripts), include it as a child of the <savvy:deck> node in config.xml.

For example, jQuery can be added globally as follows:

<savvy:deck>
  <js>http://code.jquery.com/jquery-2.0.2.min.js</js>
  ...
</savvy:deck>

This technique is useful if the library is needed by a number of other scripts.

Option 2: Third-party script-loading libraries

An alternative method is to use a third-party script loader (such as RequireJS). In this case, the script-loader library is added as to the global View in config.xml so that it is available globally. Then load (and unload) additional libraries as necessary using the script-loader.

⚠️ **GitHub.com Fallback** ⚠️