Recycling Corner/Duplicate Pop-up
Jump to navigation
Jump to search
Opening a duplicate of the model in a resizable pop-up window
The model, with is current state, is duplicated or cloned into a new (pop-up) window so it may be displayed at a larger size (and the user may resize that window at will).
The classic version (not shown here) is good for Jmol.js-based JmolApplet.
This version is for JSmol (in either HTML5, Java or WebGL modalities).
You need a portion of JavaScript code included in your page and a separate html file (for the pop-up), also with the relevant code.
1. Code in your page:
<script type="text/javascript"> var JSmolCloneData = {}; function cloneJSmol(JSmolObject) { var t = JSmolObject._jmolType; //temp if ( /_Canvas2D/.test(t) ) { t = 'HTML5'; } else if ( /_Canvas3D/.test(t) ) { t = 'WebGL'; } else if ( /_Applet/.test(t) ) { t = 'Java'; } else { t = null; } JSmolCloneData.type = t; JSmolCloneData.platformSpeed = Jmol.evaluate(JSmolObject, 'platformSpeed + 0'); JSmolCloneData.state = Jmol.getPropertyAsString(JSmolObject, 'stateInfo'); window.open('JSmolPopup.htm','JSmolPopup','resizable, width=500, height=500'); } </script> <input type="button" value="clone JSmol in a popup window" onClick="cloneJSmol(myJmol)">
Note: myJmol
should be changed to whatever you have named your JSmol object - and it is the object itself, not a text string.
2. Source code of the JSmolPopup.htm file:
<!DOCTYPE html> <html> <title>cloned JSmol</title> <head> <meta charset="utf-8"> <style type="text/css"> html , body { height:100%; overflow:hidden; margin:0; padding:0; } </style> <script type="text/javascript" src="JSmol.min.js"></script> <script type="text/javascript"> if (opener.JSmolCloneData.type == 'WebGL') { document.writeln('<script src="js/JSmolThree.js" type="text/javascript"><'+'/script>'); document.writeln('<script src="js/JSmolGLmol.js" type="text/javascript"></'+'script>'); } </script> </head> <body> <script type="text/javascript"> var cloneInfo = { height: '100%', width: '100%', isSigned: false, jarFile: 'JmolApplet0.jar', jarPath: 'java', j2sPath: 'j2s', script: opener.JSmolCloneData.state.replace(/zoomLarge true/i,'zoomLarge false'), use: opener.JSmolCloneData.type }; Jmol.getApplet("JSmolClone", cloneInfo); Jmol.script(JSmolClone,"set platformSpeed " + opener.JSmolCloneData.platformSpeed); </script> </body>
Note: you need to adjust the paths to JSmol.min.js, j2s and java