JAL-3446 embedded file for proper name matching

web app name "Jalview"

div id="Jalview-desktop-div"

So whatever name you give the applet must match the div tags.
Previously, the div name was associated with a different name,
Info.j2sAppID, or something like that. This is much more sensible.

Just don't name it "jalview", because that is a package name!

diff --git a/utils/jalviewjs/site-resources/jalview_embedded_example1.html b/utils/jalviewjs/site-resources/jalview_embedded_example1.html
index 0e0c418..0dd1052 100644 (file)
--- a/utils/jalviewjs/site-resources/jalview_embedded_example1.html
+++ b/utils/jalviewjs/site-resources/jalview_embedded_example1.html
@@ -5,6 +5,8 @@
 <script src="swingjs/swingjs2.js"></script>
 <script>
 
+// NOTE: The applet on this page is "Jalview". 
+
 // BH 2019.10.06 adds Tree and Pca functionality
 // BH see issue JAL-3451
 
@@ -24,10 +26,10 @@ Info = {
 jvGet = function(what) {
        switch(what) {
        case "tree":
-               testApplet.app.openTreePanel$jalview_gui_AlignFrame$S$S(null, "NJ","BLOSUM62")
+               Jalview.app.openTreePanel$jalview_gui_AlignFrame$S$S(null, "NJ","BLOSUM62")
                break;
        case "pca":
-               testApplet.app.openPcaPanel$jalview_gui_AlignFrame$S(null, "BLOSUM62")
+               Jalview.app.openPcaPanel$jalview_gui_AlignFrame$S(null, "BLOSUM62")
                break;
        case "3D":
                break;
@@ -37,7 +39,7 @@ jvGet = function(what) {
 
 $(document).ready(function() {
 
-  SwingJS.getApplet('testApplet', Info);
+  SwingJS.getApplet('Jalview', Info);
 
 });
 
@@ -60,7 +62,7 @@ The basic idea is that we have something interesting to say &mdash; some sort of
 across to our visitors with more than just text and images. The idea is to have a <b>dynamic</b> page that will involve <b>user interaction</b>. 
 <br><br>
 We start with a Jalview desktop. You can't see it, because I have placed it in a <code>div</code> tag with style <i>width:0px;height:0px</i> just after the period that ends this sentence.
-<div id="jalview-desktop-div" style="width:0px;height:0px;"></div>
+<div id="Jalview-desktop-div" style="width:0px;height:0px;"></div>
 <br>
 The idea is NOT to teach visitors how to use Jalview. The idea is to seamlessly integrate components of Jalview that can be used to enrich a discussion. 
 Like JSmol in <a target="_blank" href="http://proteopedia.org/wiki/index.php/Main_Page"><img src=https://pbs.twimg.com/profile_images/818051034/proteopedia_135x200_small_logo_for_Twitter_400x400.png width=16 height=16/>Proteopedia</a>.
@@ -71,7 +73,7 @@ See the big block of red color? That's the <i>Ferredoxin fold</i>domain.
 
 </div>
 </td><td style="background-color:lightgray;padding:20px">
-<div id="jalview-alignment-div" style="padding:20px;position:relative;top:0px;left:0px;width:680px;height:400px">
+<div id="Jalview-alignment-div" style="padding:20px;position:relative;top:0px;left:0px;width:680px;height:400px">
 <br><br>
 The alignment frame will appear here momentarily. When it does, you can go ahead and manipulate the alignment with your mouse.
 </div>
@@ -95,14 +97,14 @@ Then click one of the buttons below to see more information about your selected
 
 </td><td style="padding:0px 0px 0px 0px">
 <table style="border-spacing:0"><tr><td style="background-color:lightgray;padding:10px 0px 10px 20px">
-<div id="jalview-tree-div" style="position:relative;top:0px;left:0px;width:500px;height:500px">
+<div id="Jalview-tree-div" style="position:relative;top:0px;left:0px;width:500px;height:500px">
 <br><br><br><br>
-jalview-tree-div
+Jalview-tree-div
 </div>
 </td><td style="background-color:lightgray;padding:10px 20px 10px 0px">
-<div id="jalview-pca-div" style="position:relative;top:0px;left:0px;width:500px;height:500px">
+<div id="Jalview-pca-div" style="position:relative;top:0px;left:0px;width:500px;height:500px">
 <br><br><br><br>
-jalview-pca-div
+Jalview-pca-div
 </div>
 </td></tr></table>
 
@@ -115,8 +117,8 @@ jalview-pca-div
 
 <td valign=top style="padding:20px;height:650px" >
 
-<div id="jalview-structureviewer-div" style="position:relative;top:0px;left:0px;width:600px;height:600px">
-jalview-strucddtureviewer-div
+<div id="Jalview-structureviewer-div" style="position:relative;top:0px;left:0px;width:600px;height:600px">
+Jalview-strucddtureviewer-div
 </div>
 </td>
 <td valign=top style="padding:20px;background-color:white" >