Javascript

JavaScript files and variables

Tequila provide some help handling JS files CSS resources and variables to simplify your work.

Include caching

File include calls are cached in execution time, this allows the framework to eliminate duplicated calls and allow strategies to add their required files to guarantee their functionality.

Adding JS and CSS references

JS and CSS files can be added using the methods addJS and addCSS mixed parameters allowed as follows:

addJS(‘filename’);

addJS(‘filename1,filename2,filename3’);

* Filename can also include a path, this is particularly useful when your library use language resources.

Requirements:

* Header template (header.htm) must conform to Tequila standard (Check provided header.htm or emptyheader.htm files)

Adding JS variables

While most of the time JS file are self contained sometimes is useful to add a variable or a language resource to be available on client execution, you can easily do this using the method:

addJSvar('minChars', "5");

addJSvar('config_wait', "3");

* This variables are normally used by your scripts and set in the configuration of the system

Adding JS variables from language files

Javascript messages in multilanguage applications must match the current language in the server, while you can refer the specific language file in the addJS method it's also possible to keep the language entries in your PHP file and output the values straight into JS.

You can do this individually or in groups, using the array grouping style of the lang file.

To assign a JS variable from a language file use this method:

addJSfromlang($key, $subkey);

Example:

Language file:

$lang['js_lbl']['msg_confirm_delete'] = 'Confirmez svp...';

$lang['js_lbl']['msg_deleted'] = 'ยระ';

..... more entries under js_lbl

PHP view file

addJSfromlang('js_lbl');

JS file

Variables will be available on Javascript using the 2d key:

alert(msg_confirm_delete);

Adding a global CSS or JS reference

Most systems include CSS and JS files that are used globally (not only one but all pages), this can be modified in includes/config.php file, Tequila defines by default one JS, one CSS and one jsvar

$inc = array ('js' => 'functions.js',

'css' => 'styles.css',

'jsvars' => "templatestyle=$style" );

Values are comma separated so just replace or add any global file or variable you need.

templatestyle is variable used by some js Tequila javascript libraries, if you don't use feel free to remove it.

How to avoid missing JS files or minimize them on the fly?

JS_includes package

Tequila provides optional minimizing and caching of JS files using Tequila js_includes package and based on minimizer, this can be activated and configured in config.php

/** * Configuration for package JSINCLUDES * If true, libraries are loaded trough script to guarantee their presence * cache_dir : empty to not use cache * Be sure to set write permissions for this dir. */ $js_safeloading = false; $js_blocktillcomplete = true; $js_retry = 3; $js_cachedir = 'cache';

This will determine:

    • $js_safeloading: Whether to pack and compress the JS files

    • $js_blocktillcomplete: Block client side execution until all JS is loaded, very useful for slow connections and sites with high interactivity

    • $js_retry: How many JS retries should be made when

    • $js_cachedir: Specifies the location of the cache directory

* Don't forget to give your js_cachedir write permissions!