--- loncom/homework/chemresponse.pm	2013/05/03 16:29:40	1.92
+++ loncom/homework/chemresponse.pm	2014/08/20 18:02:08	1.94
@@ -1,7 +1,7 @@
 # The LearningOnline Network with CAPA
 # chemical equation style response
 #
-# $Id: chemresponse.pm,v 1.92 2013/05/03 16:29:40 bisitz Exp $
+# $Id: chemresponse.pm,v 1.94 2014/08/20 18:02:08 raeburn Exp $
 #
 # Copyright Michigan State University Board of Trustees
 #
@@ -68,29 +68,123 @@ sub chem_standard_order {
 
 sub separate_jme_window {
     my ($smile_input,$jme_input,$molecule,$options,$shown_text)=@_;
+    my $usejsme = 1;
+    my $linkstyle = 'display:none';
+    my $creditstyle = 'display:inline';
+    if ($env{'browser.type'} eq 'explorer') {
+        if (($env{'browser.os'} eq 'win') && ($env{'browser.version'} < 9)) {
+            $linkstyle = 'display:inline';
+            $creditstyle = 'display:none';
+        }
+    }
     my $smilesection;
     if (defined($smile_input)) {
+        my $smiles;
+        if ($usejsme) {
+            $smiles = 'document.JME.smiles()'; 
+        } else {
+            $smiles = 'document.applets.JME.smiles()';
+        }
 	$smilesection=<<SMILESECTION;
-        smiles = document.applets.JME.smiles();
-	opener.document.lonhomework.$smile_input.value = smiles;
+	opener.document.lonhomework.$smile_input.value = $smiles;
 SMILESECTION
     }
     my $jmesection;
+    my $jmefile;
     if (defined($jme_input)) {
+        if ($usejsme) {
+            $jmefile = 'document.JME.jmeFile()';
+        } else {
+            $jmefile = 'document.applets.JME.jmeFile()';
+        }
 	$jmesection=<<JMESECTION;
-	jmeFile = document.applets.JME.jmeFile();
-	opener.document.lonhomework.$jme_input.value = jmeFile;
+	opener.document.lonhomework.$jme_input.value = $jmefile;
 JMESECTION
     }
 
-    if ($molecule) { $molecule='<param name="jme" value="'.$molecule.'" />'; }
+    if ($molecule) {
+        if ($usejsme) {
+            $molecule = 'document.JME.readMolecule("'.$molecule.'")';
+        } else {
+            $molecule='<param name="jme" value="'.$molecule.'" />';
+        }
+    }
     my $insert_answer;
     if ($shown_text eq '') { 
 	$insert_answer=
-	    '<input type="button" name="submit" value="Insert Answer" onclick="javascript:submitSmiles();" />';
+	    '<input type="button" name="submit" value="'.&mt('Insert Answer').'" onclick="javascript:submitSmiles();" /><br />';
     }
 
-    my $js = <<CHEMJS;
+   
+
+    my ($jsme_js,$js,$buttonstyle,$viewportjs,$resizejs);
+    if ($usejsme) {
+        $buttonstyle = 'display:none';
+        $resizejs =<<RESIZEJS;
+<script type="text/javascript">
+function callResize() {
+    var timer;
+    clearTimeout(timer);
+    timer=setTimeout('resize_jsme()',100);
+}
+
+window.onresize = callResize;
+
+function resize_jsme() {
+    init_geometry();
+    var vph = Geometry.getViewportHeight();
+    var vpw = Geometry.getViewportWidth();
+    var lowerdivheight = document.getElementById('JMEbuttons').offsetHeight;
+    var formheight = document.getElementById('JMEform').offsetHeight;
+    var freevspace = vph-(lowerdivheight+50);
+    var freehspace = vpw-20;
+    if (typeof jsmeApplet !== 'undefined') {
+        jsmeApplet.setSize(freehspace,freevspace);
+    }
+}
+</script>
+RESIZEJS
+        $resizejs = &Apache::loncommon::js_ready($resizejs);
+        $jsme_js = '
+<script type="text/javascript" language="javascript" src="/adm/jsme/jsme.nocache.js"></script>'."\n";
+        $js =<<CHEMJS;
+<script type="text/javascript">
+function jsmeOnLoad() {
+    document.getElementById('JMErefresh').style.display="none";
+    document.getElementById('JMEcredits').style.display="inline";
+    jsmeApplet = new JSApplet.JSME("jme", "420px", "330px");
+    document.JME = jsmeApplet;
+    $molecule;
+    document.getElementById('JMEbuttons').style.display="block";
+    callResize();
+}
+
+function submitSmiles() {
+    jmeFile = document.JME.jmeFile();
+    if (jmeFile == "") {
+        alert("Nothing to submit");
+    } else {
+        $jmesection
+        $smilesection
+        window.close();
+    }
+}
+function openHelpWindow() {
+    window.open("http://peter-ertl.com/jsme/2013_03/help.html","","scrollbars=yes,resizable=yes,width=500,height=600");
+}
+
+</script>
+
+CHEMJS
+
+        $viewportjs = &Apache::loncommon::viewport_geometry_js();
+        $viewportjs = '<script type="text/javascript">'."\n".
+                      $viewportjs."\n".
+                      '</script>';
+
+    } else {
+        $buttonstyle = 'display:block';
+        $js =<<CHEMJS; 
 <script type="text/javascript">
 function submitSmiles() {
     jmeFile = document.applets.JME.jmeFile();
@@ -108,24 +202,41 @@ function openHelpWindow() {
 function substituent(r) {document.applets.JME.setSubstituent(r);}
 </script>
 CHEMJS
+    }
 
     my $start_page = 
-        &Apache::loncommon::start_page('Molecule Editor',undef,
+        &Apache::loncommon::start_page('Molecule Editor',$viewportjs,
 				       {'only_body' => 1,
 					'js_ready'  => 1,
 					'bgcolor'   => '#FFFFFF',});
     my $end_page =
  	&Apache::loncommon::end_page({'js_ready' => 1,});
     my $java_not_enabled=&Apache::lonhtmlcommon::java_not_enabled();
-    my $body=<<CHEMPAGE;
-$js
+    my %lt = &Apache::lonlocal::texthash(
+        'seltext' => 'Select substituent...',
+        'close'   => 'Close',
+        'help'    => 'Help',
+       );
+    my $body = "
+$jsme_js
+$js".'
 <center>
-<form action="">
+<form action="" id="JMEform">
+';
+    if ($usejsme) {
+        $body.= <<"ENDCHEM";
+<div id="jme">
+<div id="JMEcredits" style="$creditstyle">
+<span style="font-size:small; font-family:arial,sans-serif;"><a href="http://peter-ertl.com/jsme/">JSME Molecular Editor</a> courtesy of Peter Ertl (Novartis) and Bruno Bienfait</span></div>
+</div>
+ENDCHEM
+    } else {
+        $body.=<<CHEMPAGE;
   <table width="440"><tr>
     <td></td>
     <td align="right">
       <select onchange="javascript:substituent(options[selectedIndex].text)">
-        <option>Select substituent</option>
+        <option>$lt{'seltext'}</option>
         <option>-C(=O)OH</option>
         <option>-C(=O)OMe</option>
         <option>-OC(=O)Me</option>
@@ -146,14 +257,21 @@ $js
 $java_not_enabled
 $molecule
 <param name="options" value="$options" />
-</applet><br />
-<font face="arial,helvetica,sans-serif" size="-1"><a href="http://www.molinspiration.com/jme/index.html">JME Editor</a> courtesy of Peter Ertl, Novartis</font>
+</applet>
 <br />
+<font face="arial,helvetica,sans-serif" size="-1"><a href="http://www.molinspiration.com/jme/index.html">JME Editor</a> courtesy of Peter Ertl, Novartis</font>
+CHEMPAGE
+    }
+    $body .= <<CHEMPAGE;
+<div id="JMEbuttons" style="$buttonstyle">
 $insert_answer
-<br />
-<input type="button" value="  Close  " onclick = "javascript:window.close()" />
+<input type="button" value="$lt{'close'}" onclick="javascript:window.close()" />
 &nbsp;&nbsp;
-<input type="button" value="  Help  " onclick = "javascript:openHelpWindow()" />
+<input type="button" value="$lt{'help'}" onclick="javascript:openHelpWindow()" />
+</div>
+<div id="JMErefresh" style="$linkstyle">
+<a href="javascript:location.reload();">Display Molecule Editor</a>
+</div> 
 </form>
 </center>
 CHEMPAGE
@@ -164,25 +282,28 @@ CHEMPAGE
     my $display=&mt('Draw Molecule');
     if (defined($shown_text)) { $display=&mt($shown_text); }
     my $iconpath=$Apache::lonnet::perlvar{'lonIconsURL'};
-    my $function = 
+    my $function =
 	'LONCAPA_draw_molecule_'.&get_uniq_name();
     my $result=<<CHEMINPUT;
 <script type="text/javascript">
     function $function() {
 	editor=window.open($nothing,'jmeedit','width=500,height=500,menubar=no,scrollbars=no,resizable=yes');
-	editor.$docopen;
-	editor.document.write('$start_page $body $end_page');
-	editor.document.close();
-	editor.focus();
+        if (editor) {
+	    editor.$docopen;
+	    editor.document.write('$start_page $body $resizejs $end_page');
+	    editor.document.close();
+	    editor.focus();
+        }
     }
 </script>
 CHEMINPUT
+    my $jscall = "javascript:$function();void(0);";
     if ($shown_text eq '') {
-        $result .=<<PENCIL; 
-<a href="javascript:$function();void(0);"><img class="stift" src='$iconpath/stift.gif' alt='$display' title='$display' /></a>
+        $result .=<<PENCIL;
+<a href="$jscall"><img class="stift" src="$iconpath/stift.gif" alt="$display" title="$display" /></a>
 PENCIL
     } else {
-        $result .= '<input type="button" value="'.&mt($shown_text).'" onclick="javascript:'.$function.'();void(0);" />';
+        $result .= '<input type="button" value="'.&mt($shown_text).'" onclick="$jscall" />';
     }
     return $result;
 }
@@ -377,7 +498,7 @@ sub end_organicresponse {
 
 sub format_prior_answer_organic {
     my ($mode,$answer,$other_data) = @_;
-    my $result=&mt('Smile representation: "[_1]"','<tt>'.$answer.'</tt>');
+    my $result=&mt('Smile representation: [_1]','"<tt>'.$answer.'</tt>"');
     my $jme=$other_data->[0];
     $result.=&jme_img($jme,$answer,400);
     return $result;