[HOME] jsMath (Authors/2.x) [Prev][Top][Up][Next]

The autoload plugin

If you are using jsMath on pages that are dynamically created, you may not know ahead of time whether jsMath will be needed or not. Since jsMath.js is a large file, and downloading it can take a noticable time, you would not want to load jsMath.js if it is not going to be used. (Most browsers will cache JavaScript files, so only the first page the reader views will have the delay, but still, there is no need to cause the delay if the user is looking at a page with no math on it.) The autoload plugin is designed to help you out in these situations. It will look through the web page to see if there are any instances of <SPAN> or <DIV> tags of class "math" that jsMath would process, and loads jsMath.js automatically if so, but does not load jsMath.js otherwise, effectively preventing the unwanted download for those cases where it was not needed. To use this plugin, add the lines
    <SCRIPT SRC="path-to-jsMath/plugins/autoload.js"></SCRIPT>

    <NOSCRIPT>
    <DIV STYLE="color:#CC0000; text-align:center">
      <B>Warning: <A HREF="http://www.math.union.edu/locate/jsMath">jsMath</A>
      requires JavaScript to process the mathematics on this page.<BR>
      If your browser supports JavaScript, be sure it is enabled.</B>
    </DIV>
    <HR>
    </NOSCRIPT>
at the bottom of the BODY of your document, before the call to jsMath.Process() or jsMath.ProcessBeforeShowing(). Note that this file must be loaded in the BODY of the document, and can not be placed in the onLoad handler for the document body.


Autloading the tex2math plugin

If you are also using the tex2math plugin, autoload can be requested to check for the math strings delimited by $...$, $$...$$, \(...\) and \[...\] in addition to (or in place of) looking for math SPAN's and DIV's. To do this, you set values in jsMath.Autoload before loading autoload.js, as in the following example:
    jsMath = {
      Autoload: {
         findMathElements: 1,     // 0 to skip looking for SPAN's and DIV's
         findTeXstrings: 0,       // 1 to look for any tex-delimited math
         findLaTeXstrings: 0,     // 1 to look for \(...\) and \[...\] only
      }
    }
You can set any (or all) of these values to control which tests are performed. If either of the TeX-string searches are performed, and strings are found, then the tex2math plugin is loaded automatically, so there is no need to load it separately. Note that there is no need to set both findTeXstrings and findLaTeXstrings, as the TeX string search includes the LaTeX strings (but not vice versa).


Loading additional plugins and fonts

The value of jsMath.loaded is set to 1 if jsMath.js was loaded, and 0 if not, so you can use this variable to conditionally load additional plugins, fonts, etc. For example,
    <SCRIPT SRC="path-to-jsMath/plugins/autoload.js"></SCRIPT>
    <SCRIPT> if (jsMath.loaded) {jsMath.Setup.Script("plugins/mimeTeX.js")} </SCRIPT>
    <SCRIPT> jsMath.Process(document) </SCRIPT>
would load the mimeTeX plugin only if jsMath.js was loaded by the autoload plugin. Note that the request for mimeTeX.js should be in a separate SCRIPT block from the jsMath.Process call. This is because the the plugin will not actually be loaded until after the SCRIPT block where it is requested has finished being executed, so if jsMath.Process where in the same SCRIPT block, it would run before the plugin was loaded.

Alternatively, you can set the values of jsMath.Autoload.loadFonts and jsMath.Autoload.loadFiles to specify fonts and JavaScript files that should be loaded after jsMath.js is. These can be set either to the name of a single font or file, or to arrays of such names. For example,

    jsMath = {
      Autoload: {
        loadFonts: ["msam10","msbm10"],
        loadFiles: "plugins/mimeTeX.js"
      }
    }
would load the two AMS symbols fonts and the mimeTeX plugin whenever jsMath.js is loaded. Note that the file names are relative to the jsMath directory, unless they include an absolute path or URL. For instance
    jsMath = {
      Autoload: {
        loadFiles: ["/site/common.js","http://mysite.com/jsMath/macros.js"]
      }
    }
would load the first file from the root directory of the webserver hosting the current page, and the second from the specified website, but only if jsMath.js is loaded.

When jsMath.js is not loaded, autoload.js will define jsMath.Process(), jsMath.ProcessBeforeShowing(), jsMath.ConvertTeX() and jsMath.ConvertLaTeX() to be empty functions, so you can call them without having to worry about checking for jsMath.loaded first.


Searching only parts of the page

If you want autoload to search only a specific HTML element (like a specific DIV) for mathematics rather than the whole page (for example, to avoid having to search through sidebars and other navigational elements), you can set jsMath.Autoload.element to the ID of the element to search, or to a reference to the element itself; if no element is specified, then the whole document is searched. (This mirrors the way that jsMath.Process() and jsMath.ProcessBeforeShowing() operate).

When you use the autoload plugin, there may be a delay at the bottom of the page while jsMath.js is loading. During this time, the rest of the page may be visible, so jsMath.ProcessBeforeShowing() may not have its desired effect.

If you are generating dynamic content on-the-fly (via JavaScript for example), then if the math content is not already in the page when autoload.js is loaded, it will not detect it, and so won't load jsMath.js for you. In these cases, you should not use autoload but should loaded jsMath.js in the usual way.


Using autoload with server-side includes

If your server is configures to allow server-side includes, you can cause autoload.js to be included directly into the web page rather than requiring the server to send the autoload.js file separately, causing a second file access. To do this, you need to first tell autoload where the jsMath files are (since it will not be able to look up the location from the SCRIPT tag as it usually does), and then include the autoload.js file;
    <SCRIPT>
      jsMath = {Autoload: {root: "path-to-jsMath"}};
      <!--#include virtual="path-to-jsMath/plugins/autoload.js" -->
    </SCRIPT>
    <NOSCRIPT>
    <DIV STYLE="color:#CC0000; text-align:center">
      <B>Warning: <A HREF="http://www.math.union.edu/locate/jsMath">jsMath</A>
      requires JavaScript to process the mathematics on this page.<BR>
      If your browser supports JavaScript, be sure it is enabled.</B>
    </DIV>
    <HR>
    </NOSCRIPT>
where path-to-jsMath is the URL for the jsMath directory. (This approach was suggested by Jan-Åke Larrson.)


Get jsMath at SourceForge.net. Fast, secure and Free Open Source software downloads [HOME] jsMath web pages
Created: 17 Sep 2005
Last modified: 02 Dec 2005 12:57:02
Comments to: dpvc@union.edu
[Next] Changing or removing the font warnings
[Up] Information for jsMath v2.x Authors
[Prev] The mimeTeX plugin