From Jmol
Revision as of 13:17, 28 March 2014 by Hansonr (talk | contribs) (MathJax Compatibility Issues)
Jump to navigation Jump to search

Known Compatibilities

JSmol is compatible with:

jQuery 1.9+
Google Charts
MathJax (but see below)
JSME (JavaScript Molecular Editor

Known Incompatibilities

JSmol will create the following global variables and will be incompatible with any package that does likewise:

our object:


primary Java-derived package names:

 J   JM   JMB   JSV   JU   JV   JW   JZ   java javajs  

used by javajs for communication in relation to dialogs and menus:


Java2Script globals:

Clazz   ClassLoader   ClassLoaderProgressMonitor   JavaObject 
$_A   $_AB   $_AC   $_AD   $_AF   $_AI   $_AL   $_AS   $_Ab   $_B   $_C   $_D  
$_E   $_F   $_G   $_H   $_I   $_J   $_K   $_L   $_M   $_N   $_O   $_P   $_Q   
$_R   $_S   $_T   $_U   $_V   $_W   $_X   $_Y   $_Z $_k   $_s     
c$ $t$ 

Note that Java2Script had to be extensively augmented to work with Jmol. Therefore JSmol will be incompatible with other Java2Script applications using the default implementations of Clazz.

MathJax Compatibility Issues

MathJax works by first loading a web page, then, after that is complete, editing the special mark-up on the page to turn those marks into beautiful math expressions. The problem is that both Jmol and MathJax are competing for the page processing after a page is loaded. Fortunately, MathJax was designed with this issue in mind, and there is a way of monitoring its progress. We need to start creating Jmol objects only after MathJax completes its job.

For compatibility with MathJax, make sure you:

1) are using JSmol (JSmol.min.js, not the older Jmol.js)

2) are using dynamic loading of JSmol

   -- use  $(document).ready() to create all JSmol objects
   -- no <script> tags that use Jmol.getApplet() within the body

3) set the jQuery $(document).ready event to monitor MathJax loading and only start creating JSmol objects until that is done. For example:

checkMathJax = function(fReady) {
  return (!$("#MathJax_Message")[0] 
    || $('#MathJax_Message:contains("Loading")')[0]
    ? setTimeout(function(){checkMathJax(fReady)},10)
    : fReady());
loadJmol = function() {
 var Info = {
   width: 300,
   height: 300,
   debug: false,
   color: "0xFFFFFF",
   addSelectionOptions: true,
   use: "HTML5",
   j2sPath: "./j2s",
   jarPath: "./java",
   jarFile: "JmolAppletSigned.jar",
   isSigned: true,
   script: "set antialiasDisplay;load $caffeine",
   serverURL: "",
   readyFunction: jmol_isReady,
   disableJ2SLoadMonitor: false,
   disableInitialConsole: true,
   allowJavaScript: true
 $("#appletplace").html(Jmol.getAppletHtml("jmol", Info));


<div id="appletplace"></div>


A demonstration page can be found at [1].


Hansonr, AngelHerraez