Difference between revisions of "JSmol"
AngelHerraez (talk | contribs) (more details on limitations of JSmol) |
AngelHerraez (talk | contribs) |
||
Line 14: | Line 14: | ||
When used together with [[Jmol JavaScript Object]] (Jmol-JSO), the same webpage may be authored to run in all devices using in each case a Jmol variety or surrogate that is adjusted to capabilities of each device. | When used together with [[Jmol JavaScript Object]] (Jmol-JSO), the same webpage may be authored to run in all devices using in each case a Jmol variety or surrogate that is adjusted to capabilities of each device. | ||
+ | JSmol is still in the development stage (Nov. 2012). You can see it in action at the [http://chemapps.stolaf.edu/jmol/jsmol/test2.htm test page]. The current set of files (development version, subject to changes) may be downloaded [http://chemapps.stolaf.edu/jmol/JSmol.zip here]. | ||
+ | |||
+ | |||
+ | Necessary code is like this (subject to change): | ||
− | + | In the <code>head</code> section: | |
+ | <script type="text/javascript" src="JSmoljQuery.js"></script> | ||
+ | <script type="text/javascript" src="JSmolCore.js"></script> | ||
+ | <script type="text/javascript" src="JSmolApplet.js"></script> | ||
+ | <script type="text/javascript" src="JSmolApi.js"></script> | ||
+ | <script type="text/javascript" src="JSmolThree.js"></script> | ||
+ | <script type="text/javascript" src="JSmolGLmol.js"></script> | ||
+ | <script type="text/javascript" src="j2s/j2sjmol.js"></script> | ||
+ | <script type="text/javascript" src="JSmol.js"></script> | ||
+ | <script type="text/javascript"> | ||
+ | var Info = { | ||
+ | width: 300, | ||
+ | height: 300, | ||
+ | serverURL: "http://chemapps.stolaf.edu/jmol/jsmol/jsmol.php ", | ||
+ | use: "HTML5", | ||
+ | j2sPath: "j2s", | ||
+ | console: "jmolApplet0_infodiv" | ||
+ | } | ||
+ | </script> | ||
+ | |||
+ | (see [[Jmol_JavaScript_Object]] for more details about the <code>Info</code> variable) | ||
+ | |||
+ | JSmolThree.js and JSmolGLmol.js are only necessary if you are using the WebGL version (which currently is only partially working). | ||
+ | |||
+ | And in the <code><body></code> section: | ||
+ | <script type="text/javascript"> | ||
+ | myJmol = Jmol.getApplet("myJmol", Info); | ||
+ | </script> |
Revision as of 22:37, 13 November 2012
JSmol is the tentative name for an alternative to Jmol applet that does not require Java but instead renders the molecular models in a webpage using just JavaScript and HTML5 features. This opens up the use of Jmol not only in PC's, Mac's and Linux's systems without Java installed, but also in tablets and phones (iOS, Android) that do not allow Java or applets. No hardware-based graphics acceleration is used either, and hence it should run in any system that supports HTML5 standards in the web browser. JSmol runs entirely in the client, does not use any server technologies.
JSmol allows rendering, scripting and interaction with the models just as Jmol does, since the source code is shared by both. Note that JSmol is not a different program than Jmol: it is Jmol, just compiled into JavaScript instead of Java (thanks to the Java2Script software).
Current limitations:
- Using local files (i.e. not in a web server) may not be feasible depending on the browser (security policies).
- Opening binary files (e.g Spartan files, gzipped files, PNGJ files):
- Binary files can now be read; not all file types are identified yet, only those that match a file extension; you should be able to rename any file to include
.bin
in its name to force JSmol to read it as a binary file. For example,c6h6.bin.spartan
should work. - For binary file reading to be compatible with Chrome and MSIE, you will need to have a base64 server-side piece that will convert the binary data to BASE64 format. This is because only Firefox allows clean (reliable) synchronous binary file transfer. The test2.htm demo page is using a jsmol.php file, which does that and considerably more.
- Binary files can now be read; not all file types are identified yet, only those that match a file extension; you should be able to rename any file to include
- Commands that involve threading are not working yet. This includes
hover, spin, animation, minimize, delay
, as well as animatedmove, moveTo, compare
. - Writing of JPG and PNG data is not supported.
- Background images are not supported.
When used together with Jmol JavaScript Object (Jmol-JSO), the same webpage may be authored to run in all devices using in each case a Jmol variety or surrogate that is adjusted to capabilities of each device.
JSmol is still in the development stage (Nov. 2012). You can see it in action at the test page. The current set of files (development version, subject to changes) may be downloaded here.
Necessary code is like this (subject to change):
In the head
section:
<script type="text/javascript" src="JSmoljQuery.js"></script> <script type="text/javascript" src="JSmolCore.js"></script> <script type="text/javascript" src="JSmolApplet.js"></script> <script type="text/javascript" src="JSmolApi.js"></script> <script type="text/javascript" src="JSmolThree.js"></script> <script type="text/javascript" src="JSmolGLmol.js"></script> <script type="text/javascript" src="j2s/j2sjmol.js"></script> <script type="text/javascript" src="JSmol.js"></script> <script type="text/javascript"> var Info = { width: 300, height: 300, serverURL: "http://chemapps.stolaf.edu/jmol/jsmol/jsmol.php ", use: "HTML5", j2sPath: "j2s", console: "jmolApplet0_infodiv" } </script>
(see Jmol_JavaScript_Object for more details about the Info
variable)
JSmolThree.js and JSmolGLmol.js are only necessary if you are using the WebGL version (which currently is only partially working).
And in the <body>
section:
<script type="text/javascript"> myJmol = Jmol.getApplet("myJmol", Info); </script>