Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Geoffrey Rowland -
Number of replies: 15
Picture of Plugin developers

I have updated the Jmol filter to use JSmol, as recently developed by Bob Hanson and collaborators.

http://chemapps.stolaf.edu/jmol/jsmol/test2.htm

This means that (in most cases) JSmol (JavaScript/HTML5) is used in preference to Jmol (Java applet). JSmol works on platforms that don't have Java installed/available and also avoids the security issues/fixes/popups that have recently affected Java-browser combinations. JSmol performance is a little slower than that of Jmol, but still very usable.

In order for the JSmol JavaScript to work alongside Moodle 2 AJAX, the filter wraps JSmol as YUI module. Multiple JSmol instances can be inserted in a Moodle course, though too many may increase page load times.

In my hands, this version of the filter works with Moodle 2.3, 2.4 and 2.5 beta. Earlier Moodle 2.x versions may work, but have not been tested.

Similarly, it works with any recent browser with HTML 5 support (Firefox 20, Chrome 26, Opera 12, Internet Explorer 10 and 9 tested). Internet Explorer 8 also works, but only by defaulting to the Jmol Java applet.

Since JSmol is the same program as Jmol, just converted to JavaScript, and is effectively a drop-in replacement for Jmol, I have retained the Jmol name for the filter.

Jmol/JSmol is under active development and it should be relatively straight-forward to add options for WebGL display or minimal JSmol lite display (for, say, mobile platforms).

This should be considered development code. So, please test on a non-production server in the first instance. That said, as a basic filter, it should not alter the moodle database.

The latest versions can be downloaded from GitHub:

https://github.com/geoffrowland/moodle-filter_jmol

The master branch is for this JSmol version for Moodle 2.x , but there are also branches for the 'old' Jmol Java applet versions for Moodle 2.x and Moodle 1.x

Enjoy!

Average of ratings: Useful (1)
In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Geoffrey Rowland -
Picture of Plugin developers

...and here is a screenshot of the filter in action in Moodle 2.4.3

Jmol Filter using JSmol

In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Anand Mahadevan -

Hi Geoffrey,

I'm finding that we can visualize .pdb files but not .pdb.gz files for larger protein structures. We could do that in older versions of moodle running Jmol. 

Any suggestions?

Thanks,

 

Anand

 

In reply to Anand Mahadevan

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Geoffrey Rowland -
Picture of Plugin developers

Hi Anand

.pdb.gz files should display with recent Firefox or Opera browsers, but not Internet Explorer or Chrome (not tested Safari).

This is because .gz files are binary format and the JavaScript/AJAX capabilities of Internet Explorer and Chrome are, apparently, not up to directly handling binary files. There is more detail here: http://wiki.jmol.org/index.php/Jmol_JavaScript_Object#Reading_binary_files

The included jsmol.php file *should* allow IE and Chrome to read binary files. However, I have not yet got this working with the Moodle filter. Seems there may be complications due to folder/file hierarchies and browser/AJAX permissions. I'm still looking into this and will post a fix if/when I find one!

Since you are, presumably, looking at large complex protein structures, you may wish to switch the default display back to Java. Although there have been huge improvements in the display performance of the JavaScript version, JSmol, the Java applet, Jmol, still performs noticeably faster with larger structures.

You can force the filter to use Java (Jmol) by changing filter.php around line 201.

Replace:

use: 'HTML5',

with:

use: 'JAVA',

By default, the filter adds hydrogens to .pdb files, on loading, by using the pdbAddHydrogens command. For consistency, this should probably happen for .pdb.gz files too.

Hope that helps.

In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Geoffrey Rowland -
Picture of Plugin developers

Just realised  that this is, perhaps, not the best location for this thread about the Jmol/JSmol filter. Apologies for any inconvenience.

Perhaps someone with admin rights would kindly move it to somehere more appropriate

e.g. Other components > General add-ons ?

Thanks

In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Carl LeBlond -

Thanks Geoffrey!  I set it up easily and it works well on my development server (moodle2.5).

In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Fred Senese -

Does anyone know if the JSMol filter works with Moodle 2.6?

In reply to Fred Senese

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Geoffrey Rowland -
Picture of Plugin developers

Hi Fred

Should work. Though I hope to release an updated version in the next few days. This will include the latest stable Jmol/JSmol 14.0.x code including the signed applet (for folks wanting the Java version with minimal security warnings), fixes to z-index (correct layering behind edit menus etc) and fixes for issues with JSmol working alongside MathJax (which now can use the mhchem extension for rendering chemical equations).

I'll post here when it's available.

Geoff

In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Joseph Baxter -

Hi Geoff,


We are looking to upgrade to the latest version (we are currently on the original version) along with our upgrade from moodle 2.2 to 2.6 here at the University of Nottingham.

I have had a play on my local dev environment and all looks good.

I was wondering if you still think of this as "development code" or if you think it is stable now?




...

Joseph Baxter

University of Nottingham


In reply to Geoffrey Rowland

Jmol filter conflict with LaTeX?

by Luis Raul Chavez G. -

Hello, Geoffrey
In our Moodle 2.5 server Jmol is activated in any page containing LaTeX and tries to show a molecule. The LaTex generated PNG files are not displayed and we get an error message in red:

Unrecognized file format for file http://our.moodle.site.url/filtertex

<!- DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">

<html><head>

<title> 404 Not Found </title>

LaTeX works fine again disabling Jmol. Is it a bug?

Our system: Ubuntu LAMP server 12.04.4 LTS (GNU/Linux 3.2.0-64-generic-pae I686). It was upgraded from 1.9 to 2.2, then 2.5. The old Jmol version was removed first and then replaced with the new one in the last step. The Ubuntu/Moodle default language is Spanish. The LaTeX filter output is configured as PNG.


Attachment Imagen1.jpg
Attachment Imagen2.jpg
Attachment Imagen3.jpg
In reply to Luis Raul Chavez G.

Re: Jmol filter conflict with LaTeX?

by Joseph Baxter -

I have checked the above issue on:


Windows

Moodle 2.6 (clean install)


And I cannot replicate the issue. So  am a bit stumped to what the issue could be.




...

Joseph Baxter

University of Nottingham

In reply to Luis Raul Chavez G.

Re: Jmol filter conflict with LaTeX?

by Geoffrey Rowland -
Picture of Plugin developers

I have not encountered this issue either, though will investigate. May be worth checking/changing the order in which the filters are loaded.

There is a known conflict between JSmol and MathJax Javascript - for anyone using MathJax rather than the LaTex filters for rendering maths or chemistry (with the mhchem MathJax extension) equations. 

A quick fix is to uncomment some lines towards the end of jmol/filter.php. This ensures JSmol is loaded after MathJax has completed rendering the page. Now that a MathJax filter is built into Moodle 2.7, I hope to make this simpler to configure in the next Jmol/JSmol filter release.

Y.on('load', function () {
//Uncomment following if MathJax is installed
//MathJax.Hub.Queue(function () {
Jmol.setDocument(0);
Jmol._alertNoBinary = false;
Jmol.getApplet('jmol".$id."', Info);
$('#jmoldiv".$id."').html(Jmol.getAppletHtml(jmol".$id."));
$('#control".$id."').html(".$control.");
//});
});
In reply to Geoffrey Rowland

Re: Jmol filter conflict with LaTeX?

by Luis Raul Chavez G. -
I don't know if this is related, but another course using this plug-in got corrupted before upgrading Moodle and cannot be deleted. I found a newer version of jmol and upgraded using the standard sequence: 1. Uninstalled the old one from the admin/plug-in overview page 2. Replaced the jmol filter folder with the new one 3. Click over the Site Administration/Notifications link This solved the problem.
In reply to Geoffrey Rowland

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Christian Westphal -

Hello,

I use jmol filter 6.1 (Build: 2016011200)  in moodle (2.9) and I have a problem with it.

When I include a molecule in my moodle, the applet work fine, but I need to click on the applet. (button with circular arrow and "activat 3D model" hint) (view screenshot)

How can I activate automaticaly the model, without clicking on it ? it would be useful for young schoolchildren to limit the number of clicks


Christian

please excuse my poor english, I'm french  wink
Attachment Capture décran - 06032016 - 164923.png
In reply to Christian Westphal

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Ian Hunt -

Did you get your question (above) answered ? We just updated to 3.1 and I want a solution to the same problem. Thanks!

In reply to Ian Hunt

Re: Jmol 3D chemistry structure filter updated to use JSmol (HTML5/JavaScript)

by Geoffrey Rowland -
Picture of Plugin developers

Hi Christian and Ian

Apologies for not answering sooner. I had overlooked this thread.

If you add the ?i=0 parameter to the chemical structure file link, the cover image will be automatically replaced with the interactive structure.

The default of using a cover image is to speed up the loading/display of Moodle pages, particularly if multiple JSmol objects are present or if the end user is using low performance hardware/mobile devices.

Cheers

Geoff