View Ontology Changes:

        -side scrolling
        -automatic heigth and width adjustments
        -automatic top and side offsets
        -some code refactoring
        -PO Number now included in term

svn path=/; revision=440

diff --git a/Personnel/miles/Web Page/viewOntology.php b/Personnel/miles/Web Page/viewOntology.php
index b2b3d5247afbe7c90c0ba441ac785f3233cd6801..fed4c2282eda4420fab7f40614a5228db94bcb97 100644 (file)
--- a/Personnel/miles/Web Page/viewOntology.php
+++ b/Personnel/miles/Web Page/viewOntology.php
@@ -37,7 +37,7 @@ for($i = 0; $i < sizeof($genes); $i++) {
   $logic = $logic . $toAdd;
 }
 
-$query="select distinct name from (select term_id from gene_product left join association on association.gene_product_id=gene_product.id " . $logic . ") as mytable left join term on term_id=term.id order by name";
+$query="select concat(acc, \": \", name) from (select distinct name, acc from (select term_id from gene_product left join association on association.gene_product_id=gene_product.id " . $logic . ") as mytable left join term on term_id=term.id order by acc) as secondTable";
 $results=mysql_query($query);
 
 $i = 0;
@@ -57,7 +57,7 @@ for($i = 0; $i < sizeof($genes); $i++) {
   $logic = $logic . $toAdd;
 }
 
-$query = "select full_name,term_id,name from (select full_name,term_id from gene_product left join association on association.gene_product_id=gene_product.id " . $logic . " order by full_name,term_id) as temp left join term on term.id=term_id order by full_name,name";
+$query = "select full_name,term_id,concat(acc, \": \", name) from (select full_name,term_id from gene_product left join association on association.gene_product_id=gene_product.id " . $logic . " order by full_name,term_id) as temp left join term on term.id=term_id order by full_name,acc";
 $results=mysql_query($query);
 
 $t = 0;
@@ -88,18 +88,23 @@ for ($i = 0; $i < sizeof($cellData); $i ++)
 
 
 
-
+$height = 800;
+$width = 1200;
 ?>
 
-<div id="canvasDiv" style="overflow: hidden; float: left; height: 500px; width: 1100px;">
+<div id="canvasDiv" style="overflow: hidden; float: left; height: <?php echo $height ?>px; width: <?php echo $width ?>px;">
 <canvas id="myCanvas" width="1500" height="1000" style="border:1px solid #c3c3c3;">
 Your browser does not support the canvas element.
 </canvas> </div>
 
-<div id="scrollDiv" style="overflow: auto; float: left; height: 515px; width: 15px;" onscroll="drawMap();">
+<div id="topScrollDiv" style="overflow: auto; float: left; height: <?php echo ($height + 15) ?>px; width: 15px;" onscroll="drawMap();">
 <canvas id="nothing" width="1" height="<?php echo 210 + sizeof($genes)*15 ?>"> </canvas>
 </div>
 
+<div id="sideScrollDiv" style="overflow: auto; float: left; height: 15px; width: <?php echo ($width + 15) ?>px;" onscroll="drawMap();">
+<canvas id="nothing" width="<?php echo 85 + sizeof($terms)*15 ?>" height="1"> </canvas>
+</div>
+
 
 <script type="text/javascript">
 
@@ -122,12 +127,18 @@ var canvas = document.getElementById("myCanvas");
 var ontMap = canvas.getContext("2d");
 var startTerm = 0;
 
-var topOffset = 200;
+//to find out what our top offset should be:
+var maxTermSize = 0;
+for(var i = 0; i < terms.length; i ++) {
+  if(terms[i].length > maxTermSize) maxTermSize = terms[i].length;
+}
+
+var topOffset = maxTermSize*5;//NOTE the *7 is just my own approximation: characters on average seem to be about 5 pixels wide at the current font size
 var leftOffset = 85;
 
-var cellSize = 15; //NOTE if this is changed, the size of the canvasDiv must also be changed by the same factor!
-var maxRows = Math.floor((500-topOffset)/cellSize);
-var maxCols = Math.floor((1000-leftOffset)/cellSize);
+var cellSize = 15; //NOTE if this is changed, the size of the topScrollDiv must also be changed by the same factor!
+var maxRows = Math.floor((<?php echo $height ?>-topOffset)/cellSize);
+var maxCols = Math.floor((<?php echo $width ?>-leftOffset)/cellSize);
 
 var borderWidth = 1;
 
@@ -163,10 +174,9 @@ function drawGenes(startGene) {
 }
 drawGenes(0);
 drawTerms(0);
-
 function drawMap(init) {
-  scrolledLeft = document.getElementById("scrollDiv").scrollLeft;
-  scrolledTop = document.getElementById("scrollDiv").scrollTop;
+  scrolledLeft = document.getElementById("sideScrollDiv").scrollLeft;
+  scrolledTop = document.getElementById("topScrollDiv").scrollTop;
   if(scrolledLeft > termCount*cellSize - maxCols*cellSize) {
     scrolledLeft = termCount*cellSize - maxCols*cellSize;
   } //TODO examine this ^
@@ -182,7 +192,7 @@ function drawMap(init) {
     drawnRows = Math.floor(scrolledTop/cellSize);
     
     ontMap.fillStyle = "#FFFFFF";
-    ontMap.fillRect(0,0,1100,500);
+    ontMap.fillRect(0,0,<?php echo $width ?>,<?php echo $height ?>);
 
     startXCell = Math.floor(scrolledLeft/cellSize);
     startYCell = Math.floor(scrolledTop/cellSize);