<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
jvGet = function(what) {
switch(what) {
case "tree":
- testApplet.app.openTreePanel$jalview_gui_AlignFrame$S$S(null, "NJ","BLOSUM62")
+ Jalview.app.openTreePanel("NJ","BLOSUM62")
break;
case "pca":
- testApplet.app.openPcaPanel$jalview_gui_AlignFrame$S(null, "BLOSUM62")
+ Jalview.app.openPcaPanel("BLOSUM62")
break;
case "3D":
+ Jalview.app.showStructure("1a70", "mmcif");
break;
}
$(document).ready(function() {
- SwingJS.getApplet('testApplet', Info);
+ SwingJS.getApplet('Jalview', Info);
});
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>.
</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>
<table style="background-color:lightgray"><tr><td style="padding:0px 0px 0px 20px">
<b>Select a few alignments</b> by left-dragging across a few rows of the alignment to make a selection box.
Then click one of the buttons below to see more information about your selected subset of the alignment.
-<ul>
-<li><button onclick='jvGet("tree")'>similarity tree</button></li>
-<li><button onclick='jvGet("pca")'>principal component analysis</button></li>
-</ul>
-
+<br><br>
+<button onclick='jvGet("tree")'>similarity tree</button> <button onclick='jvGet("pca")'>principal component analysis</button>
+<br><br>
+One more thing. Let's take a <a href="javascript:jvGet('3D')" style="text-decoration:none;color:red">look at the 3D structure</a> of one these proteins. Ferredoxins are important, because they have
+iron-sulfur clusters that can accept and deliver electrons in metabolic processes. Let's see if we can find it.
+<br><br>
</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
+<a href="javascript:jvGet('tree')">Jalview-tree-div</a>
</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
+<a href="javascript:jvGet('pca')">Jalview-pca-div</a>
+<br><br>
+
</div>
</td></tr></table>
</td></tr>
+<!-- let it float
<tr>
<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>
+<div id="Jalview-structureviewer-div" style="position:relative;top:0px;left:0px;width:600px;height:600px">
+<a href="javascript:jvGet('3D')">Jalview-structureviewer-div</a>
+</div>
</td>
<td valign=top style="padding:20px;background-color:white" >
One more thing. Let's take a look at the 3D structure of one these proteins. Ferredoxins are important, because they have
iron-sulfur clusters that can accept and deliver electrons in metabolic processes. Let's see if we can find it.
<br><center><button onclick='jvGet("3D")'>add the 3D structure</button>
-</td></tr></table>
+</td></tr>
+ -->
+
+</table>
<!-- debugging (hidden) -->