Jchempaint inside webpages

Table of Contents Example Code for the editor applet Embedding the viewer applet Applet parameters Features of applet / canvas Loading of model Features of formula Interaction with web page or other applet Interacting with the applet Applet methods Reading from the applet Writing to the applet

Example Code for the editor applet

Example usage of the <applet></applet> tag for the JChemPaint applet:

<applet code="org.openscience.jchempaint.applet.JChemPaintEditorApplet" 
        archive="jchempaint-applet-core.jar"
        name="Editor"
        width="500" height="400">

<param name="implicitHs"      value="true">
<param name="codebase_lookup" value="false">
<param name="image"           value="hourglass.gif">
<param name="centerImage"     value="true">
<param name="boxBorder"       value="false">
<param name="language"        value="en">
</applet>

Notes:

• Values for width and height (500 and 400 in the example) can be changed freely, but there is a mimimum needed to acommodate the interface in the JCP editor.
• The setting codebase_lookup=false is an option to improve applet initialization performance. It prevents the JRE from (pointlessly) looking up .class files in the web folder.
• The image parameter can be added to display an image while the applet is initializing. In the example, an image called hourglass.gif must be present in the same folder where the HTML page is. You can provide an image of your choice and set the parameter name accordingly (note that the hourglass.gif is not provided with the JChemPaint distribution).
• The language parameter can be added to force a language in the interface, as long as that localisation is included in the JCP distribution. Please, note that this will not be usually necessary since Java will automatically adopt the language of the user's operating system.

Embedding the viewer applet

Use the example above, but refer instead to

 code="org.openscience.jchempaint.applet.JChemPaintViewerApplet"

Applet parameters

A number of parameters can be used when loading the applet. They are described in the JavaDoc Page of JChemPaintAbstractApplet. Please refer to this page for up-to-date information, since it is autogenerated. Some of the important parameters are described here, but note this is not complete.

Features of applet / canvas

• background

The color of the canvas background, in decimal or hexadecimal† format (white by default).

Examples: 12632256 , #FFFFDD

• detachable †

A boolean; if true, the applet can be opened in its own window out of the web page, by double-clicking on the canvas, and then resized at will (false by default).

• scrollbars ‡

A boolean; if the molecule is too big to be displayed in normal size, shall scrollbars be used (default, true) or the molecule be resized (false).

† only available in version 2.3.4 or later

‡ only for the viewer, not the editor

Loading of model

• load

The file name of a structure to load, including its path (an URL).

Examples: sample.mol , mymodels/sample.mol , ../../mymodels/sample.mol

• smiles

A structure to load, in SMILES notation (a formatted string).

Example: OC(C)C

Features of formula

• atomNumbersVisible

To show or not atom numbers (a boolean, false by default)

Examples: true , false

• implicitHs

The implicit Hydrogens will be added from start (a boolean, true by default except for internal carbons)

Examples: true , false

• compact

Show atoms as dots, instead of element symbols (a boolean, false by default)

Examples: true , false

• tooltips

A string like 'atomnumber|label|atomnumber|label'; each label will be used as a tooltip for the respective atom (a formatted string, empty by default).

Example: C9|this is the chiral center|H3|this hydrogen will be released

Interaction with web page or other applet

These are of specialized use; see e.g. NMRShiftDB.

• highlightTable

A boolean; if true, data in a table will be highlighted when hovering over an atom; the i.d. of cell or row to be highlighted must be 'tableid' followed by the atom number (false by default).

• spectrumRenderer

The name of a spectrum applet where peaks should be highlighted when hovering over an atom (see subproject in NMRShiftDB).

Interacting with the applet

Depending on how you insert the applet in the page (applet or object tags), in JavaScript one refers to the applet using

document.JCP;

or

document.getElementById("JCP");

where "JCP" is whatever name was assigned when embedding the applet.

Applet methods

The public methods of the Applet can called from JavaScript. They are described in the JavaDoc Page of JChemPaintAbstractApplet. Please refer to this page for up-to-date information, since it is autogenerated. Some of the important methods are described here, but note this is not complete.

Reading from the applet

• getMolFile()
• getSmiles()
• getSmilesChiral()
• getParameter()
• getParameterInfo()
• getAppletInfo()
• getLocale()
• getImage()
• getTheJcpp()

Writing to the applet

• setMolFile()
• setMolFileWithReplace()
• addMolFileWithReplace()
• setSmiles()
• loadModelFromUrl()
• loadModelFromSmiles()
• clear()
• selectAtom()
• makeHydrogensExplicit()

---