From: <gu...@us...> - 2010-06-07 01:04:43
|
Revision: 13303 http://jmol.svn.sourceforge.net/jmol/?rev=13303&view=rev Author: gutow Date: 2010-06-07 01:04:36 +0000 (Mon, 07 Jun 2010) Log Message: ----------- # new feature: widgets in WebExport (background colorpicker, spin on/off, stereo mode # animation control and open console button). #NOTE: internal documentation for this is done, but requires re-translation of the .html # help pages. Modified Paths: -------------- trunk/Jmol/src/org/jmol/viewer/Jmol.properties trunk/Jmol/src/org/openscience/jmol/app/webexport/WebExport.java trunk/Jmol/src/org/openscience/jmol/app/webexport/WebPanel.java trunk/Jmol/src/org/openscience/jmol/app/webexport/Widgets.java trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Installing_Applet.html trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Path_to_Applet.html trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Testing_Pages_Locally.html trunk/Jmol/src/org/openscience/jmol/app/webexport/html/WebExportIntro.html trunk/Jmol/src/org/openscience/jmol/app/webexport/html/pop_in_instructions.html trunk/Jmol/src/org/openscience/jmol/app/webexport/html/script_button_instructions.html Added Paths: ----------- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/widget_instructions.html Modified: trunk/Jmol/src/org/jmol/viewer/Jmol.properties =================================================================== --- trunk/Jmol/src/org/jmol/viewer/Jmol.properties 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/jmol/viewer/Jmol.properties 2010-06-07 01:04:36 UTC (rev 13303) @@ -4,6 +4,12 @@ version=12.0.RC18_dev # bug fix: SmilesGenerator double bonds +# new feature: Widgets in WebExport +# Spin on/off checkbox +# Open Console button +# Background Color Picker +# Stereo Viewing Mode Control +# Animation Control # -------------------------------------------------------------- Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/WebExport.java =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/WebExport.java 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/WebExport.java 2010-06-07 01:04:36 UTC (rev 13303) @@ -331,8 +331,9 @@ static URL getResource(Object object, String fileName, boolean flagError) { URL url = null; + if (!fileName.contains("/"))fileName="org/openscience/jmol/app/webexport/html/"+fileName; try { - if ((url = object.getClass().getResource("html/" + fileName)) == null && flagError) + if ((url = ClassLoader.getSystemResource(fileName)) == null && flagError) System.err.println("Couldn't find file: " + fileName); } catch (Exception e) { System.err.println("Exception " + e.getMessage() + " in getResource " Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/WebPanel.java =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/WebPanel.java 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/WebPanel.java 2010-06-07 01:04:36 UTC (rev 13303) @@ -224,7 +224,30 @@ JList getInstanceList() { return instanceList; } - + +// private static byte[] getResourceAsBytes(String fullPath) { +// byte[] buf = new byte[1024]; +// byte[] bytes = new byte[4096]; +// BufferedInputStream bis = new BufferedInputStream(ClassLoader +// .getSystemResourceAsStream(fullPath)); +// int len = 0; +// int totalLen = 0; +// try { +// while ((len = bis.read(buf)) > 0) { +// totalLen += len; +// if (totalLen >= bytes.length) +// bytes = ArrayUtil.ensureLength(bytes, totalLen * 2); +// System.arraycopy(buf, 0, bytes, totalLen - len, len); +// } +// buf = new byte[totalLen]; +// System.arraycopy(bytes, 0, buf, 0, totalLen); +// } catch (Exception IOException) { +// Logger.error("WebPanel IO ERROR reading resource " + fullPath); +// return null; +// } +// return buf; +// } + /* * for example: * getResourceAsBytes("org/openscience/jmol/app/images/angleButton.gif") @@ -269,6 +292,7 @@ } return buf; }*/ + private JPanel getLeftPanel(int w, int h) { @@ -601,6 +625,33 @@ viewer.writeTextFile(datadirPath + "/" + scriptFileName + "", WebExport.getResourceString(this, scriptFileName)); } + String [] supportFileNames=theWidgets.widgetList[i].getSupportFileNames(); + int nFiles = supportFileNames.length; + if (nFiles!=0){ + for(int fileN=0;fileN<nFiles;fileN++){ + String inFile = supportFileNames[fileN]; + String outFile = inFile; + if((inFile.lastIndexOf("/"))!=-1) { + outFile = inFile.substring((inFile.lastIndexOf("/")+1)); + } + URL fileURL = WebExport.getResource(this, inFile); + if (fileURL==null){ + LogPanel.log(" "+GT._("Unable to load resource "+inFile)); + }else{ + InputStream is = fileURL.openConnection().getInputStream(); + FileOutputStream os = new FileOutputStream(datadirPath + "/" + + outFile); + int temp = is.read(); + while (temp != -1) { + os.write(temp); + temp = is.read(); + } + os.flush(); + os.close(); + LogPanel.log(" " + GT._("adding {0}", outFile)); + } + } + } } } html=TextFormat.simpleReplace(html,"@WIDGETJSFILES@",jsStr); Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/Widgets.java =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/Widgets.java 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/Widgets.java 2010-06-07 01:04:36 UTC (rev 13303) @@ -9,13 +9,15 @@ // group of javascript widgets to allow user input to Jmol - Widget[] widgetList = new Widget[3]; + Widget[] widgetList = new Widget[5]; Widgets() { // this should just be a list of available widgets widgetList[0] = new SpinOnWidget(); widgetList[1] = new BackgroundColorWidget(); widgetList[2] = new StereoViewWidget(); + widgetList[3] = new AnimationWidget(); + widgetList[4] = new ConsoleWidget(); // widgetList[3] = new DownLoadWidget(); } @@ -40,8 +42,16 @@ */ abstract String getJavaScriptFileName();// returns the name of the - // TODO add a method for getting list of image files probably should return - // an array of strings. + /** + * The list of files returned by this function should contain the full path to + * each file. The only exception is that files that only contain a filename + * will be assumed to be in the html section of WebExport. + * @return string of filenames. + */ + abstract String[] getSupportFileNames();// returns array of support file names. + //These file names should include the full path within the Java application jar. + //files stored in html part of WebExport will be found even if only the filename + //is given. } @@ -49,7 +59,10 @@ SpinOnWidget() { name = GT._("Spin on/off"); } - + String[] getSupportFileNames(){ + String[] fileNames = new String[0]; + return(fileNames); + } String getJavaScriptFileName() { return "JmolSpin.js"; } @@ -71,7 +84,12 @@ String getJavaScriptFileName() { return ("JmolColorPicker.js"); } - + + String[] getSupportFileNames(){ + String[] fileNames = new String[0]; + return(fileNames); + } + String getJavaScript(int appletID, JmolInstance instance) { Point3f ptRGB = Graphics3D.colorPointFromInt2(instance.bgColor); return "<table><tbody><tr><td>" @@ -94,7 +112,12 @@ String getJavaScriptFileName() { return "none"; } - + + String[] getSupportFileNames(){ + String[] fileNames = new String[0]; + return(fileNames); + } + String getJavaScript(int appletID, JmolInstance instance) { return "<select id=\"StereoMode" + appletID + "\" title=\"" + GT._("select stereo type") + "\"" @@ -111,7 +134,77 @@ + "\n</select>"; } } + class AnimationWidget extends Widget { + AnimationWidget() { + name = GT._("Animation Control"); + } + String getJavaScriptFileName() { + return ("JmolAnimationCntrl.js"); + } + + String[] getSupportFileNames(){ + String[] fileNames = new String[9]; + String imagePath = "org/openscience/jmol/app/images/"; + fileNames[0] = imagePath+"lastButton.png"; + fileNames[1] = imagePath+"playButton.png"; + fileNames[2] = imagePath+"playLoopButton.png"; + fileNames[3] = imagePath+"playOnceButton.png"; + fileNames[4] = imagePath+"playPalindromeButton.png"; + fileNames[5] = imagePath+"prevButton.png"; + fileNames[6] = imagePath+"pauseButton.png"; + fileNames[7] = imagePath+"nextButton.png"; + fileNames[8] = imagePath+"firstButton.png"; + return(fileNames); + } + + String getJavaScript(int appletID, JmolInstance instance) { + String jsString ="<table id=\"AnimContrl\" style=\"text-align:center; border:thin solid black;\">"; + jsString +="<tbody><tr><td>"+GT._("Animation")+"</td></tr><tr><td><table><tbody>"; + jsString +="<tr><td><button title=\"first frame\" style=\"font-size:0px;\" onclick=\"void(jmolScriptWait(\'frame 1\'));\">"; + jsString +="<img src = \"firstButton.png\"></button></td>"; + jsString+= "<td><button title=\"previous frame\" style=\"font-size:0px;\" onclick=\"void(jmolScriptWait(\'frame previous\'));\">"; + jsString+= "<img src = \"prevButton.png\" ></button></td>"; + jsString+= "<td><button title=\""+GT._("play")+"\" style=\"font-size:0px;\" onclick=\"void(jmolScriptWait(\'animation on\'));\">"; + jsString+= "<img src = \"playButton.png\"></button></td>"; + jsString+= "<td><button title=\""+GT._("next frame")+"\" style=\"font-size:0px;\" onclick=\"void(jmolScriptWait(\'frame next\'));\">"; + jsString+= "<img src = \"nextButton.png\"></button></td>"; + jsString+= "<td><button title=\""+GT._("pause/stop")+"\" style=\"font-size:0px;\" onclick=\"void(jmolScriptWait(\'animation off\'));\">"; + jsString+= "<img src = \"pauseButton.png\"></button></td>"; + jsString+= "<td><button title=\""+GT._("last frame")+"\" style=\"font-size:0px;\" onclick=\"void(jmolScriptWait(\'frame last\'));\">"; + jsString+= "<img src = \"lastButton.png\"></button></td>"; + jsString+= "</tr></tbody></table><table><tbody><tr><td>Mode:</td>"; + jsString+= "<td id=\"jmol_loop_"+appletID+"\"><button title=\""+GT._("loop")+"\" style=\"font-size:0px\" onclick=\"void(jmol_animationmode(\'loop\',"+appletID+"));\">"; + jsString+= "<img src = \"playLoopButton.png\" ></button></td>"; + jsString+= "<td id=\"jmol_palindrome_"+appletID+"\"><button title=\""+GT._("palindrome")+"\" style=\"font-size:0px\" onclick=\"void(jmol_animationmode(\'palindrome\', "+appletID+"));\">"; + jsString+= "<img src = \"playPalindromeButton.png\" ></button></td>"; + jsString+= "<td id=\"jmol_playOnce_"+appletID+"\" style=\"background:blue;\"><button title=\""+GT._("once through")+"\" style=\"font-size:0px\" onclick=\"void(jmol_animationmode(\'playOnce\', "+appletID+"));\">"; + jsString+= "<img src = \"playOnceButton.png\" ></button></td></tr></tbody></table></td></tr></tbody></table>"; + return (jsString); + } + + } + + class ConsoleWidget extends Widget { + ConsoleWidget() { + name = GT._("Open Console Button"); + } + + String getJavaScriptFileName() { + return ("none"); + } + + String[] getSupportFileNames(){ + String[] fileNames = new String[0]; + return(fileNames); + } + + String getJavaScript(int appletID, JmolInstance instance) { + return ("<button title=\"" + GT._("launch Jmol console") + + "\" onclick=\"void(jmolScript(\'console\'));\">" + + GT._("Jmol Console") + "</button>"); + } + } class DownLoadWidget extends Widget { DownLoadWidget() { name = GT._("Download view"); @@ -121,6 +214,11 @@ // TODO return ("none"); } + + String[] getSupportFileNames(){ + String[] fileNames = new String[0]; + return(fileNames); + } String getJavaScript(int appletID, JmolInstance instance) { // TODO Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Installing_Applet.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Installing_Applet.html 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Installing_Applet.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -1,4 +1,4 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html; charset=ISO-8859-1" @@ -9,32 +9,29 @@ </head> <body> <hr> - <table style="text-align: left; width: 100%;" border="0" - cellpadding="2" cellspacing="2"> - <tbody> - <tr valign="top"> - <td><small>Page Templates</small></td> - <td><small>Set Up</small></td> - </tr> - <tr valign="top"> - <td><small>> <a - href="pop_in_instructions.html">Pop-In</a><br> - <br> +<table style="text-align: left; width: 100%;" border="0" cellpadding="2" + cellspacing="2"> + <tbody> + <tr valign="top"> + <td><small>Page Templates</small></td> + <td><small>Set Up</small></td> + </tr> + <tr valign="top"> + <td><small>> <a href="pop_in_instructions.html">Pop-In</a><br> > <a href="script_button_instructions.html">Scriptbutton</a><br> - </small></td> - <td><small>> <a - href="Path_to_Applet.html">Path to Jmol</a><br> +> <a href="widget_instructions.html">Widgets</a><br> + </small></td> + <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> > Jmol on your server<br> > <a href="Testing_Pages_Locally.html">Testing locally (no server)</a><br> - </small></td> - </tr> - </tbody> - </table> + </small></td> + </tr> + </tbody> +</table> <hr> - <p style="text-align: center; font-weight: bold;">Installing -Jmol on Your Server - </p> - <p>You may install Jmol anywhere on +<p style="text-align: center; font-weight: bold;">Installing +Jmol on Your Server </p> +<p>You may install Jmol anywhere on your server that you are allowed to install files. At a bare minimum you should install the following files in a directory dedicated to Jmol: Jmol.js, JmolApplet.jar, all JmolApplet0_...jar files, and @@ -44,6 +41,5 @@ are installing the Jmol directory as you will have to <a href="Path_to_Applet.html">specify the path to Jmol in web pages you create</a>.</p> - </body> </html> Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Path_to_Applet.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Path_to_Applet.html 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Path_to_Applet.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -1,4 +1,4 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html; charset=ISO-8859-1" @@ -9,52 +9,50 @@ </head> <body> <hr> - <table style="text-align: left; width: 100%;" border="0" - cellpadding="2" cellspacing="2"> - <tbody> - <tr valign="top"> - <td><small>Page Templates</small></td> - <td><small>Set Up</small></td> - </tr> - <tr valign="top"> - <td><small>> <a - href="pop_in_instructions.html">Pop-In</a><br> - <br> +<table style="text-align: left; width: 100%;" border="0" cellpadding="2" + cellspacing="2"> + <tbody> + <tr valign="top"> + <td><small>Page Templates</small></td> + <td><small>Set Up</small></td> + </tr> + <tr valign="top"> + <td><small>> <a href="pop_in_instructions.html">Pop-In</a><br> > <a href="script_button_instructions.html">Scriptbutton</a><br> - </small></td> - <td><small>> +> <a href="widget_instructions.html">Widgets</a><br> + </small></td> + <td><small>> Path to Jmol<br> > <a href="Installing_Applet.html">Jmol on your server</a><br> > <a href="Testing_Pages_Locally.html">Testing locally (no server)</a><br> - </small></td> - </tr> - </tbody> - </table> + </small></td> + </tr> + </tbody> +</table> <hr> - <p style="text-align: center; font-weight: bold;">The -Path to the Jmol Applet - </p> - <p><b>Relative server path to jar files.</b><br> - Designate the relative path for your SERVER to -the Jmol applet files (JmolApplet0*.jar and Jmol.js) from the directory containing the HTML file. - </p> - <p><b>Relative local path to jar files.</b><br> - Designate the relative path for a LOCAL HARD DRIVE to -the Jmol applet files (JmolApplet0*.jar and Jmol.js) from the directory containing the HTML file. - </p> - <p>Do not forget to account for the fact that the page produced by this program is inside a -folder (directory) that you will be adding to your web site. - </p> - <p>Server Example: Jmol jar files and Jmol.js are in directory /www/applets/java/jmol on the server, and -you will be creating directory /www/yourname/thispage to hold the HTML files. +<p style="text-align: center; font-weight: bold;">The +Path to the Jmol Applet </p> +<p><b>Relative server path to jar files.</b><br> +Designate the relative path for your SERVER to +the Jmol applet files (JmolApplet0*.jar and Jmol.js) from the directory +containing the HTML file. </p> +<p><b>Relative local path to jar files.</b><br> +Designate the relative path for a LOCAL HARD DRIVE to +the Jmol applet files (JmolApplet0*.jar and Jmol.js) from the directory +containing the HTML file. </p> +<p>Do not forget to account for the fact that the page produced by this +program is inside a +folder (directory) that you will be adding to your web site. </p> +<p>Server Example: Jmol jar files and Jmol.js are in directory +/www/applets/java/jmol on the server, and you will be creating +directory /www/yourname/thispage to hold the HTML files. The correct path to the Jmol applet is then <b>../../applets/java/jmol</b> - </p> - <p>Local Example: Jmol jar files and Jmol.js are in directory C:/temp/jmol, and -you will be creating directory /temp/jmol/thispage to hold the HTML files. (Note that on a local -drive the JAR files MUST be somewhere on the path to the directory containing the model files, +</p> +<p>Local Example: Jmol jar files and Jmol.js are in directory +C:/temp/jmol, and you will be creating directory /temp/jmol/thispage to +hold the HTML files. (Note that on a local drive the JAR files MUST be +somewhere on the path to the directory containing the model files, which in this case is the directory you designate for the HTML file. -The correct path to the Jmol applet is then just <b>../</b> - </p> - +The correct path to the Jmol applet is then just <b>../</b> </p> </body> </html> Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Testing_Pages_Locally.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Testing_Pages_Locally.html 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/Testing_Pages_Locally.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -1,4 +1,4 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html; charset=ISO-8859-1" @@ -11,58 +11,54 @@ </head> <body> <hr> - <table style="text-align: left; width: 100%;" border="0" - cellpadding="2" cellspacing="2"> - <tbody> - <tr valign="top"> - <td><small>Page Templates</small></td> - <td><small>Set Up</small></td> - </tr> - <tr valign="top"> - <td><small>> <a - href="pop_in_instructions.html">Pop-In</a><br> - <br> +<table style="text-align: left; width: 100%;" border="0" cellpadding="2" + cellspacing="2"> + <tbody> + <tr valign="top"> + <td><small>Page Templates</small></td> + <td><small>Set Up</small></td> + </tr> + <tr valign="top"> + <td><small>> <a href="pop_in_instructions.html">Pop-In</a><br> > <a href="script_button_instructions.html">Scriptbutton</a><br> - </small></td> - <td><small>> <a - href="Path_to_Applet.html">Path to Jmol</a><br> +> <a href="widget_instructions.html">Widgets</a><br> + </small></td> + <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> > <a href="Installing_Applet.html">Jmol on your server</a><br> > Testing locally (no server)<br> - </small></td> - </tr> - </tbody> - </table> + </small></td> + </tr> + </tbody> +</table> <hr> - <p style="text-align: center; font-weight: bold;">Testing -Web Pages Created by Jmol Web Page Maker on Your Local Machine - </p> - <p>(Does not work for the ScriptButton template if you use FireFox under +<p style="text-align: center; font-weight: bold;">Testing +Web Pages Created by Jmol Web Page Maker on Your Local Machine </p> +<p>(Does not work for the ScriptButton template if you use FireFox +under MacOSX, works with Safari on MacOSX and FireFox under Linux and Windows. It appears MacOS FireFox is passing absolute instead of -relative paths.) - </p> - <p>The javascript built into the +relative paths.) </p> +<p>The javascript built into the pages checks to see whether the page is being loaded from a server or the local machine. If it is being loaded from your local machine -the path to Jmol used is the relative path specified in the local path -text box. The directory containing the page to be tested must be a -subdirectory of the one containing the Jmol applet on the local machine. +the path to Jmol used is the relative path specified in the local path +text box. The directory containing the page to be tested must be a +subdirectory of the one containing the Jmol applet on the local +machine. So, to test pages made by Jmol Web Page Maker on your local machine follow the steps -below. - </p> - <ol> - <li>Create a directory (folder) named something like "tests" +below. </p> +<ol> + <li>Create a directory (folder) named something like "tests" inside the directory on your local machine that contains the Jmol applet.</li> - <li>Specify the local path to Jmol as "../../" when you create the - page in Jmol Web Page Maker.</li> - <li>Copy or move the directory (not just its contents) + <li>Specify the local path to Jmol as "../../" when you create the +page in Jmol Web Page Maker.</li> + <li>Copy or move the directory (not just its contents) containing the .html, .spt, .png and .js files for the page of interest into the directory created in step 1.</li> - <li>Open the .html file in the browser you want to use for + <li>Open the .html file in the browser you want to use for testing. The page should work just like it would on a server.</li> - </ol> - +</ol> </body> </html> Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/WebExportIntro.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/WebExportIntro.html 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/WebExportIntro.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -1,4 +1,4 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html; charset=ISO-8859-1" @@ -27,8 +27,10 @@ etc.</li> <li>ScriptButton: this template displays a single Jmol applet on the right side of the browser window. On the left side is a scrolling -region with buttons that allow the user to select the view.<br> - </li> +region with buttons that allow the user to select the view.</li> </ol> +There are also some widgets that you can select to appear with your +applet. These widgets give the user additional control over the +applet. See the help for more details.<br> </body> </html> Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/pop_in_instructions.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/pop_in_instructions.html 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/pop_in_instructions.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -1,62 +1,68 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> -<html><head> - <meta content="text/html; charset=iso-8859-1" http-equiv="content-type"> - - <title>Pop-In Jmol Instructions</title><meta content="J. Gutow" name="author"></head> - +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<html> +<head> + <meta content="text/html; charset=ISO-8859-1" + http-equiv="content-type"> + <title>Pop-In Jmol Instructions</title> + <meta content="J. Gutow" name="author"> +</head> <body> <hr> - <table style="text-align: left; width: 100%;" border="0" cellpadding="2" cellspacing="2"> - <tbody> - <tr valign="top"> - <td><small>Page Templates</small></td> - <td><small>Set Up</small></td> - </tr> - <tr valign="top"> - <td><small>> +<table style="text-align: left; width: 100%;" border="0" cellpadding="2" + cellspacing="2"> + <tbody> + <tr valign="top"> + <td><small>Page Templates</small></td> + <td><small>Set Up</small></td> + </tr> + <tr valign="top"> + <td><small>> Pop-In<br> - >><a href="#Description">Description</a><br> +>><a href="#Description">Description</a><br> >><a href="#Page_Cartoon">Page Cartoon</a><br> >><a href="#Instructions">Step-by-step</a><br> - <br> - > <a href="script_button_instructions.html">Scriptbutton</a><br> - </small></td> - <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> +> <a href="script_button_instructions.html">Scriptbutton</a><br> +> <a href="widget_instructions.html">Widgets</a><br> + </small></td> + <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> > <a href="Installing_Applet.html">Jmol on your server</a><br> > <a href="Testing_Pages_Locally.html">Testing locally (no server)</a><br> - </small></td> - </tr> - </tbody> - </table> + </small></td> + </tr> + </tbody> +</table> <hr> - <p style="text-align: center; font-weight: bold;">The -Pop-In Template - </p> - <p><a name="Description"></a>This tab is designed to produce a web +<p style="text-align: center; font-weight: bold;">The +Pop-In Template </p> +<p><a name="Description"></a>This tab is designed to produce a web page that displays images of Jmol graphics, each of which can be converted to a live Jmol display by the user. This makes initial loading of the page -faster. The image will match the initial Jmol setup for each occurrence which +faster. The image will match the initial Jmol setup for each +occurrence which is chosen by setting up the Jmol viewer the way you wish. You add the text later in your favorite web editor. This panel can be opened once and returned to anytime. An example picture of such a page is shown below:<br> - <img style="border: 1px solid ; width: 250px; height: 268px;" alt="picture of a pop in web page" src="pop_in.png"><a name="Page_Cartoon"></a></p> - <p><a name="Instructions"></a><b><i>Instructions</i></b> </p> - <p>1) Set the relative path to the Jmol applet on you web site from where +<img style="border: 1px solid ; width: 250px; height: 268px;" + alt="picture of a pop in web page" src="pop_in.png"><a + name="Page_Cartoon"></a></p> +<p><a name="Instructions"></a><b><i>Instructions</i></b> </p> +<p>1) Set the relative path to the Jmol applet on you web site from +where you will put the folder (directory) containing the files created by this program. (<a href="Path_to_Applet.html">more...</a>)</p> - <p>2) Put your name(s) in the Author space. This will add you as +<p>2) Put your name(s) in the Author space. This will add you as the author in the page meta data that is used for searching.</p> - <p>3) Add the title you want to appear in the browser window +<p>3) Add the title you want to appear in the browser window title bar. This does not have to be the same as the title you will use for the page.</p> - <p>4) +<p>4) If not already done, open the first file you want to appear in your page using the File..Open.. menu in the Jmol viewer. If you will be @@ -66,17 +72,20 @@ append" or the "append models" checkbox to allow displaying more than one model simultaneously), and follow steps (5) - (7) for each individual model.</p> - <p>5) Set the state of the model (zoom, rotate, select, change colors, add +<p>5) Set the state of the model (zoom, rotate, select, change colors, +add orbitals, set the molecule spinning, etc.) exactly the way you want it to appear on the web page.</p> - <p>6) Set the width and height for the model on this tab. There is no need +<p>6) Set the width and height for the model on this tab. There is no +need to resize the application window itself.</p> - <p>7) Click on the "Add Present Jmol State as Instance" button and select +<p>7) Click on the "Add Present Jmol State as Instance" button and +select a name for this applet instance.</p> - <p>8) Repeat for as many different displays as you wish. Because of the +<p>8) Repeat for as many different displays as you wish. Because of the memory constraints of web browsers, it is probably best to limit yourself to no more @@ -86,7 +95,7 @@ create a page with several applets and then split it later into multiple web pages.</p> - <p>9) When you are done, click on "Save HTML as..." Provide either the +<p>9) When you are done, click on "Save HTML as..." Provide either the name of a new directory for this page or the name of the HTML file (.htm or .html) you @@ -98,7 +107,7 @@ a PNG image. If a new directory is indicated, the HTML file will be created in that directory and have the same name, with ".html" appended.</p> - <p>10) Open the HTML file in your favorite web editor and add your +<p>10) Open the HTML file in your favorite web editor and add your explanatory text and anything else you wish. As long as you do not alter the inside of @@ -106,5 +115,5 @@ the page without disrupting the JavaScript that controls the behavior of Jmol. </p> - -</body></html> \ No newline at end of file +</body> +</html> Modified: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/script_button_instructions.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/script_button_instructions.html 2010-06-06 19:42:08 UTC (rev 13302) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/script_button_instructions.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -1,38 +1,42 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> -<html><head> - <meta content="text/html; charset=iso-8859-1" http-equiv="content-type"> - - <title>ScriptButton Instructions</title><meta content="J. Gutow" name="author"> - <meta content="Instructions for the script button tab in Jmol_Web_Page_Maker" name="description"></head> - +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<html> +<head> + <meta content="text/html; charset=ISO-8859-1" + http-equiv="content-type"> + <title>ScriptButton Instructions</title> + <meta content="J. Gutow" name="author"> + <meta + content="Instructions for the script button tab in Jmol_Web_Page_Maker" + name="description"> +</head> <body> <hr> - <table style="text-align: left; width: 100%;" border="0" cellpadding="2" cellspacing="2"> - <tbody> - <tr valign="top"> - <td><small>Page Templates</small></td> - <td><small>Set Up</small></td> - </tr> - <tr valign="top"> - <td><small>> <a href="pop_in_instructions.html">Pop-In</a><br> - <br> +<table style="text-align: left; width: 100%;" border="0" cellpadding="2" + cellspacing="2"> + <tbody> + <tr valign="top"> + <td><small>Page Templates</small></td> + <td><small>Set Up</small></td> + </tr> + <tr valign="top"> + <td><small>> <a href="pop_in_instructions.html">Pop-In</a><br> > Scriptbutton<br> >><a href="#Description">Description</a><br> >><a href="#Page_Cartoon">Page Cartoon</a><br> >><a href="#Instructions">Step-by-step</a><br> - </small></td> - <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> +> <a href="widget_instructions.html">Widgets</a><br> + </small></td> + <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> > <a href="Installing_Applet.html">Jmol on your server</a><br> > <a href="Testing_Pages_Locally.html">Testing locally (no server)</a><br> - </small></td> - </tr> - </tbody> - </table> + </small></td> + </tr> + </tbody> +</table> <hr> - <p style="text-align: center; font-weight: bold;">The -ScriptButton Template - </p> - <p><a name="Description"></a>This tab is +<p style="text-align: center; font-weight: bold;">The +ScriptButton Template </p> +<p><a name="Description"></a>This tab is designed to produce a web page that displays a single Jmol applet alongside a scrolling pane @@ -44,24 +48,27 @@ using a standard web editor. This panel can be opened once and returned to anytime. An example picture of such a page is shown below:<br> - <img style="border: 1px solid ; width: 250px; height: 199px;" alt="picture of a Resizable web page" src="script_button.png"><a name="Page_Cartoon"></a></p> - <p><a name="Instructions"></a><b><i>Instructions</i></b> </p> - <p>1) Set the relative path to the Jmol applet on your web site from where +<img style="border: 1px solid ; width: 250px; height: 199px;" + alt="picture of a Resizable web page" src="script_button.png"><a + name="Page_Cartoon"></a></p> +<p><a name="Instructions"></a><b><i>Instructions</i></b> </p> +<p>1) Set the relative path to the Jmol applet on your web site from +where you will put the folder (directory) containing the files created by this program. (<a href="Path_to_Applet.html">more...</a>)</p> - <p>2) Put your name(s) in the Author space. This will add you as +<p>2) Put your name(s) in the Author space. This will add you as the author in the page meta data that is used for searching.</p> - <p>3) Add the title you want to appear in the browser window +<p>3) Add the title you want to appear in the browser window title bar. This does not have to be the same as the title you will use for the page.</p> - <p>4) Set the percentage of the window width that you want Jmol +<p>4) Set the percentage of the window width that you want Jmol to occupy.</p> - <p>5) If not already done, open the first file you want to appear +<p>5) If not already done, open the first file you want to appear in your page using the File..Open.. menu in the Jmol viewer. If you will be using @@ -70,19 +77,21 @@ append" or the "append models" checkbox to allow displaying more than one model simultaneously), and follow steps (6) & (7) for each individual view.</p> - <p>6) Set the state of the model (zoom, rotate, select, change colors, add +<p>6) Set the state of the model (zoom, rotate, select, change colors, +add orbitals, set the molecule spinning, etc.)exactly the way you want it to appear on the web page.</p> - <p>7) Click on the "Add Present Jmol State as Instance" button.</p> - <p>8) Repeat for as many different displays as you wish. A button will be +<p>7) Click on the "Add Present Jmol State as Instance" button.</p> +<p>8) Repeat for as many different displays as you wish. A button will +be added to the web page that will create each display when the user clicks the button. You do not need to load a new file each time if you are just modifying the way the previous one is displayed.</p> - <p>9) When you are done, click on "Save HTML as..." Provide either the +<p>9) When you are done, click on "Save HTML as..." Provide either the name of a new directory for this page or the name of the HTML file (.htm or .html) you @@ -94,7 +103,7 @@ a PNG image. If a new directory is indicated, the HTML file will be created in that directory and have the same name, with ".html" appended.</p> - <p>10) Open the HTML file in your favorite web editor and add your +<p>10) Open the HTML file in your favorite web editor and add your explanatory text and anything else you wish. As long as you do not alter the inside of @@ -103,5 +112,5 @@ the page without disrupting the JavaScript that controls the behavior of Jmol. </p> - -</body></html> \ No newline at end of file +</body> +</html> Added: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/widget_instructions.html =================================================================== --- trunk/Jmol/src/org/openscience/jmol/app/webexport/html/widget_instructions.html (rev 0) +++ trunk/Jmol/src/org/openscience/jmol/app/webexport/html/widget_instructions.html 2010-06-07 01:04:36 UTC (rev 13303) @@ -0,0 +1,76 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> +<html> +<head> + <meta content="text/html; charset=ISO-8859-1" + http-equiv="content-type"> + <title>Widget Jmol Instructions</title> + <meta content="J. Gutow" name="author"> +</head> +<body> +<hr> +<table style="text-align: left; width: 100%;" border="0" cellpadding="2" + cellspacing="2"> + <tbody> + <tr valign="top"> + <td><small>Page Templates</small></td> + <td><small>Set Up</small></td> + </tr> + <tr valign="top"> + <td><small>> + <a href="pop_in_instructions.html">Pop-In</a><br> +> <a href="script_button_instructions.html">Scriptbutton</a><br> +> Widgets<br> +>> <a href="#Spin">Spin on/off</a><br> +>> <a href="#Console">Open Console Button</a><br> +>> <a href="#Background_Color">Background Color</a><br> +>> <a href="#Stereo_Mode">Stereo Mode</a><br> +>> <a href="#Animation_Controls">Animation Controls</a><br> + </small></td> + <td><small>> <a href="Path_to_Applet.html">Path to Jmol</a><br> +> <a href="Installing_Applet.html">Jmol on your server</a><br> +> <a href="Testing_Pages_Locally.html">Testing locally (no server)</a><br> + </small></td> + </tr> + </tbody> +</table> +<hr> +<p style="text-align: center; font-weight: bold;">Widgets<br> +(Jmol controls)<br> +</p> +<div style="text-align: left;"><span style="font-weight: bold;">Introduction</span><br> +When you set up a Jmol web page you can choose to have widgets appear +next to the active Jmol in Pop-In pages and below the applet in +Scriptbutton pages. Widgets give the user additional control over +how the applet works. For instance it might allow them to change +the background color. The available widgets are listed +above. Clicking on the link will take you to the more detailed +description of each widget or you can just scroll down to read all the +descriptions below. Would you like a widget that we don't +have? Request it by making a feature request at the Jmol web site +(www.jmol.org).<br> +<br> +<span style="font-weight: bold;"><a name="Spin"></a>Spin on/off<br> +</span>Provides a check box to control spinning of the molecule. +Checking the box starts the molecule spinning. Unchecking the box +stops the spinning.<br> +<br> +<span style="font-weight: bold;"><a name="Console"></a>Open Console +Button<br> +</span>Provides a button that opens the Jmol console.<span + style="font-weight: bold;"><br> +<br> +<a name="Background_Color"></a>Background Color<br> +</span>Provides a pop-up color picker from which the user can choose +the background color.<span style="font-weight: bold;"><br> +<br> +<a name="Stereo_Mode"></a>Stereo Mode<br> +</span>Provides a menu to select among: stereo off, red/blue, +red/cyan or red/green stereo modes.<br> +<span style="font-weight: bold;"><br> +<a name="Animation_Controls"></a>Animation Controls<br> +</span>Provides buttons to control the animation mode (play once, +palindrome, loop), plus start, stop and forward or backward one frame.<span + style="font-weight: bold;"><br> +</span></div> +</body> +</html> Property changes on: trunk/Jmol/src/org/openscience/jmol/app/webexport/html/widget_instructions.html ___________________________________________________________________ Added: svn:mime-type + text/plain This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site. |