Difference between revisions of "Jmol JavaScript Object/JSV"

From Jmol
Jump to navigation Jump to search
(Integration of JSpecView into Jmol-JSO)
(Initialization and Info data)
Line 1: Line 1:
 
= Integration of JSpecView into Jmol-JSO =
 
= Integration of JSpecView into Jmol-JSO =
  
Extensive work in 2012 integrated [http://jspecview.sourceforge.net JSpecView] into Jmol 13.  
+
Extensive work in 2012 integrated [http://jspecview.sourceforge.net JSpecView] into Jmol 13 thanks to the [[Jmol JavaScript Object|JSO]] infrastructure.  
 
* The '''Jmol application''' now includes a new <code>tools</code> menu item that opens a frame for JSpecView.
 
* The '''Jmol application''' now includes a new <code>tools</code> menu item that opens a frame for JSpecView.
 
* The '''Jmol applet''' can communicate to and from a JSpecView applet in the same page, using the Jmol <code>sync</code> command. '''Jmol-JSO''' brokers this transaction and allows coordinated applet start-up so that one applet does not send a command to the other before both are ready.  
 
* The '''Jmol applet''' can communicate to and from a JSpecView applet in the same page, using the Jmol <code>sync</code> command. '''Jmol-JSO''' brokers this transaction and allows coordinated applet start-up so that one applet does not send a command to the other before both are ready.  
Line 10: Line 10:
  
 
For a demonstration of the Jmol <-> JSpecView connection, see the [{{StOlaf}}jspecview JSpecView subdirectory] at St.Olaf or the demo pages at [http://wwwchem.uwimona.edu.jm/spectra/JSpecView/ the University of the West Indies].
 
For a demonstration of the Jmol <-> JSpecView connection, see the [{{StOlaf}}jspecview JSpecView subdirectory] at St.Olaf or the demo pages at [http://wwwchem.uwimona.edu.jm/spectra/JSpecView/ the University of the West Indies].
 +
 +
== Initialization ==
 +
Add this in the <code>head</code> section of your page:
 +
<pre>
 +
<script src="somePath/JSmol.min.js" type="text/javascript"></script>
 +
<script src="somePath/js/JSmolJSV.js" type="text/javascript"></script>
 +
</pre>
  
 
== Creating and inserting the JSpecView applet ==  
 
== Creating and inserting the JSpecView applet ==  
 
To create a JSpecView applet, use for example:
 
To create a JSpecView applet, use for example:
  var myJSV = Jmol.getJSVApplet("myJSV", Info)
+
  Jmol.getJSVApplet("myJSV", jsvInfo)
  
Parameters making the <code>Info</code> variable (with default values shown between angular brackets):
+
This will create a <tt>myJSV</tt> global variable in JavaScript that holds the JSpecView object and is also the unique ID for that object in all functions and methods described below.  
* '''Info.height''' <<code>500</code>>
 
* '''Info.width''' <<code>300</code>>
 
* '''Info.debug''' <<code>false</code>>
 
* '''Info.jarPath''' <<code>.</code>>
 
* '''Info.jarFile''' <<code>JSpecViewApplet.jar</code>>
 
* '''Info.isSigned''' <<code>false</code>>
 
* '''Info.initParams''' <empty>
 
* '''Info.readyFunction''' <empty>
 
* '''Info.script''' <empty>
 
  
 +
<tt>jsvInfo</tt> is an associative array (a set of key+value pairs) indicating all the desired characteristics of the JSpecView object. The keys that may be used and their default values are given below:
 +
* '''height''' <<code>500</code>>
 +
* '''width''' <<code>300</code>>
 +
* '''debug''' <<code>false</code>>
 +
* '''jarPath''' <<code>.</code>>
 +
* '''jarFile''' <<code>JSpecViewApplet.jar</code>>
 +
* '''isSigned''' <<code>false</code>>
 +
* '''initParams''' <empty>
 +
* '''readyFunction''' <empty>
 +
* '''script''' <empty>
  
 +
Example:
 +
<pre>
 +
var jsvInfo = {
 +
  height: 300,
 +
  width: 300,
 +
  jarPath: '.',
 +
  jarFile: 'JSpecViewApplet.jar',
 +
  isSigned: false,
 +
  script: 'load "acetophenone.jdx"'
 +
};
 +
</pre>
 +
 
== JSpecView-specific methods ==
 
== JSpecView-specific methods ==
  

Revision as of 16:54, 18 May 2013

Integration of JSpecView into Jmol-JSO

Extensive work in 2012 integrated JSpecView into Jmol 13 thanks to the JSO infrastructure.

  • The Jmol application now includes a new tools menu item that opens a frame for JSpecView.
  • The Jmol applet can communicate to and from a JSpecView applet in the same page, using the Jmol sync command. Jmol-JSO brokers this transaction and allows coordinated applet start-up so that one applet does not send a command to the other before both are ready.

This makes it possible to tie 3D models to IR, NMR, UV/VIS, GC, and GC/MS spectra, using the JCAMP-DX Version 6 standard.

Associated with this integration, we have designed a specification for an extension of the JCAMP-DX format that allows one JDX file to contain both Jmol-readable 3D models and peak information, allowing the user to click on, for example, a carbon atom in Jmol and have the 13C-NMR spectrum automatically display and highlight the associated peak in JSpecView.

For a demonstration of the Jmol <-> JSpecView connection, see the JSpecView subdirectory at St.Olaf or the demo pages at the University of the West Indies.

Initialization

Add this in the head section of your page:

<script src="somePath/JSmol.min.js" type="text/javascript"></script>
<script src="somePath/js/JSmolJSV.js" type="text/javascript"></script>

Creating and inserting the JSpecView applet

To create a JSpecView applet, use for example:

Jmol.getJSVApplet("myJSV", jsvInfo)

This will create a myJSV global variable in JavaScript that holds the JSpecView object and is also the unique ID for that object in all functions and methods described below.

jsvInfo is an associative array (a set of key+value pairs) indicating all the desired characteristics of the JSpecView object. The keys that may be used and their default values are given below:

  • height <500>
  • width <300>
  • debug <false>
  • jarPath <.>
  • jarFile <JSpecViewApplet.jar>
  • isSigned <false>
  • initParams <empty>
  • readyFunction <empty>
  • script <empty>

Example:

var jsvInfo = {
  height: 300,
  width: 300,
  jarPath: '.',
  jarFile: 'JSpecViewApplet.jar',
  isSigned: false,
  script: 'load "acetophenone.jdx"'
};

JSpecView-specific methods

All these functions must be applied to the unique Jmol object (this name is literal, cannot be changed):

Jmol.jsvAddHightlight(myJSV, x1, x2, r, g, b, a) 
Jmol.jsvExport(myJSV, exportType, n) 
Jmol.jsvGetCoordinate(myJSV) 
Jmol.jsvGetPropertyAsJavaObject(myJSV, key) 
Jmol.jsvGetPropertyAsJSON(myJSV, key) 
Jmol.jsvGetSolnColour(myJSV) 
Jmol.jsvIsPro(myJSV) 
Jmol.jsvIsSigned(myJSV) 
Jmol.jsvLoadInline(myJSV, data, params)
Jmol.jsvRemoveAllHighlights(myJSV) 
Jmol.jsvRemoveHighlight(myJSV, x1, x2)
Jmol.jsvReversePlot(myJSV) 
Jmol.jsvRunScript(myJSV, script)
Jmol.jsvRunScriptNow(myJSV, script) 
Jmol.jsvSetFilePath(myJSV, tmpFilePath) 
Jmol.jsvSetSpectrumNumber(myJSV, n) 
Jmol.jsvSetVisible(myJSV, true/false)
Jmol.jsvSyncScript(myJSV, peakScript)
Jmol.jsvToggleCoordinate(myJSV)
Jmol.jsvToggleGrid(myJSV) 
Jmol.jsvToggleIntegration(myJSV)
Jmol.jsvWriteStatus(myJSV, message)

Contributors

AngelHerraez