<!DOCTYPE html>
<html>
<head>
+
<title>Heat Chart</title>
</head>
+<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
+<script type="text/javascript">
+
+function stopRKey(evt) {
+ var evt = (evt) ? evt : ((event) ? event : null);
+ var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
+ if ((evt.keyCode == 13) && (node.type=="text")) {return false;}
+}
+
+document.onkeypress = stopRKey;
+
+
+</script>
<body>
+<p> Paragraph here </p>
<?php
$temp = explode(" ",$_POST['included']);
for($i = 0; $i < sizeof($temp)-1; $i ++)
<br> <br>
<?php echo "There are " . $clusterCount . " clusters and " . $speciesCount . " species in the heatmap."; ?>
-<form name="infoForm" action="changes" method="post">
+<form name="infoForm" action="infoChoice.php" method="post">
<input type="hidden" name="param">
+<input type="hidden" name="type">
</form>
-<form name="jumpTo" >
-<input type="button" value="Jump to Cluster:" onClick="return jumpToCluster()"/>
-<input type="text" name="cluster" />
+<form id="jumpTo" name="jumpTo">
+<input type="button" id="jumpToBut" value="Jump to Cluster:" onClick="jumpToCluster(); return false;"/>
+<input type="text" id="cluster" name="cluster" value="0"/>
</form>
<form name="jumpToGene">
-<input type="button" value="Find Gene:" onClick="return jumpToGene()"/>
-<input type="text" name="gene"/>
+<input type="button" value="Find Gene:" onClick="getGeneLoc(); return false;"/>
+<input type="text" name="gene" value = ""/>
</form>
<div id="canvasDiv" style="overflow: hidden; float: left; height: 500px; width: 1100px;">
<canvas id="nothing" width="1" height="<?php echo 250 + sizeof($allClusterIDs)*25 ?>"> </canvas>
</div>
-<form name="downloadImage" >
-<input type="button" value="Download as JPG" onClick="generateImage()"/>
+<form id="downloadImage" action="download.php" method="post">
+<input type="hidden" name="param" value = "unset DISPLAY && java -Djava.awt.headless=true -jar Heatmap.jar "image" <?php echo implode(" ",$includedSpecies)?>;<?php echo $input; ?>">
+<input type="button" value="Download as JPG" onClick="downloadImage()"/>
</form>
</body>
<script type="text/javascript">
-
var width = <?php echo $width; ?>;
function getClusterInfo(cluster, index) {
- document.infoForm.action = "ClusterInfo.php";
var userIndex = index+1;
+ document.infoForm.type.value = "cluster";
document.infoForm.param.value = cluster + "," + userIndex;
document.infoForm.submit();
}
function getSpeciesInfo(species) {
- document.infoForm.action = "SpeciesInfo.php";
+ document.infoForm.type.value = "species";
var pass = [species];
pass = pass.concat(allClusterIDs);
document.infoForm.param.value = pass;
function getBoxInfo(cluster, species, clusterIndex, speciesIndex) {
var userIndex = clusterIndex+1;
var count = heatMapData[speciesIndex][clusterIndex];
- document.infoForm.action = "ClusterSpeciesInfo.php";
+ document.infoForm.type.value = "box";
document.infoForm.param.value = cluster + "," + species + "," + userIndex + "," + count;
document.infoForm.submit();
}
function jumpToCluster() {
- var cluster = document.jumpTo.cluster.value;
+ var cluster = parseInt(document.getElementById('jumpTo').cluster.value);
if(cluster > clusterCount) {
alert("No such cluster exists for this result set!");
return;
if(cluster > clusterCount - maxCols) document.getElementById("scrollDiv").scrollTop = clusterCount*25 - maxCols*25;
document.getElementById("scrollDiv").scrollTop = cluster*25;
drawMap();
- return;
}
-function jumpToGene() {
- alert(document.jumpToGene.gene.value);
-}
-
-function generateImage() {
- document.infoForm.action="download.php";
- document.infoForm.param.value = "unset DISPLAY && java -Djava.awt.headless=true -jar Heatmap.jar \"image " + "<?php echo implode(" ",$includedSpecies)?>" + ";" + "<?php echo $input; ?>\"";
- document.infoForm.submit();
+function downloadImage() {
+ document.getElementById("downloadImage").submit();
}
drawMap(true);
canvas.addEventListener('mouseup', showInfo, false);
+function getGeneLoc() {
+ url = "getGeneLoc.php?gene=" + document.jumpToGene.gene.value + "";
+ alert(url);
+ var xmlhttp;
+ if (window.XMLHttpRequest)
+ {// code for IE7+, Firefox, Chrome, Opera, Safari
+ xmlhttp=new XMLHttpRequest();
+ }
+ else
+ {// code for IE6, IE5
+ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
+ }
+ xmlhttp.onreadystatechange=function() {
+ if (xmlhttp.readyState==4 && xmlhttp.status==200) {
+ alert(xmlhttp.responseText);
+ var txt = xmlhttp.responseText;
+ var clusterID = parseInt(txt.split(",")[0]);
+ var speciesName = txt.split(",")[1];
+ var c;
+ var s;
+ for(var i = 0; i < allClusterIDs.length; i ++) {
+ if(parseInt(allClusterIDs[i])==clusterID) {
+ c = i;
+ document.getElementById('jumpTo').cluster.value = i+1;
+ jumpToCluster()
+ }
+ }
+ for(i = 0; i < allSpecies.length; i ++) {
+ if(speciesName == allSpecies[i]) {
+ s = i;
+ }
+ }
+ alert("Species Index: " + s + " Cluster Index: " + c);
+ heatMap.strokeStyle="#9DE24F";
+ heatMap.lineWidth=3;
+ heatMap.strokeRect(leftOffset + s*25 -1, topOffset -1,cellSize,cellSize);
+ heatMap.lineWidth=1;
+ heatMap.strokeStyle="#000000";
+ }
+ }
+ xmlhttp.open("GET",url,true);
+ xmlhttp.send();
+}
</script>
+
</body>
</html>
<!--
-1. Updating links given by Pankaj
-2. Extraneus species show up at the end of the heatchart
-3. Improve text summary
+1. Double highlighting: Good or Bad side effect? If bad, drawMap() before highlight gene box
+2. Tree phylogeny using Hal, RaxML
+3. Annotations on genes
+4. Implement side scrolling support for findGene box
+5. Reexamine scrolling code in drawMap(), i think it needs to be deprecated
-->
\ No newline at end of file