/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
var gallery;
var dataId;
var loading;
var lense;
var cornerImg;
var graphics;
var search;
var searchResult;
var select;
var header;
var content;
var headerStr;
var contentStr;

var catchJsp;
var locateJsp;
var displayJsp;
var displaySlidePageJsp
var slideJsp;
var instructionDeleted = 0;
var doneSearch = 0;

 function changeit()
 {
     //'opera' -- Opera
     //'msie' -- Internet Explorer
     //'safari' -- Safari
     //'firefox' -- FireFox
     //'mozilla' -- Mozilla 
     var appName = navigator.userAgent.toLowerCase();
     
     //if(self.navigator.appName.indexOf('Netscape') >= 0)
     if(appName.indexOf('firefox') >= 0)
         resizeit();
 }
 
 function resizeAndDropit()
 {
     resizeit();
     dropit();
 }
 
 function dropit()
 {
     var drag = lense;
     var drop = graphics;

     var xPos = Position.positionedOffset(drag)[0];
     var yPos = Position.positionedOffset(drag)[1];
     
     var dragWidth = drag.getWidth();
     var dragHeight = drag.getHeight();
     var dropWidth = drop.getWidth();
     var dropHeight = drop.getHeight();
     
     if ( xPos < 0 ) { drag.setStyle({left: '0px'}); }
     if ( yPos < 0 ) { drag.setStyle({top: '0px'}); }
     if ( xPos > (dropWidth - dragWidth) ) { drag.setStyle({left: '420px'}); }
     if ( yPos > (dropHeight - dragHeight) ) { drag.setStyle({top: '420px'}); } 

     xPos = Position.positionedOffset(drag)[0];
     yPos = Position.positionedOffset(drag)[1];
     dragWidth = drag.getWidth();
     dragHeight = drag.getHeight();
     
     var searchTable = $('searchTable');
     var searchTableTbody = searchTable.down();
                 
     while ( searchTableTbody.childNodes.length > 1 )
         searchTableTbody.removeChild(searchTableTbody.lastChild);     
     
     locateUpdate("ajax/" + catchJsp + "?id=" + dataId + "&y=" + yPos + "&x=" + xPos + "&w=" + dragWidth + "&h=" + dragHeight);
     var img = createImg();
     search.insert(img);
     Effect.BlindDown(search);
     
     searchResult.hide();
     search.show();
     doneSearch = 0;
 }
 
 function resizeit()
 {
     //var lense = $("lenseDiv");
     var image = cornerImg;

     var xC = Position.positionedOffset(image)[0];
     var yC = Position.positionedOffset(image)[1];
     var xL = Position.positionedOffset(lense)[0];
     var yL = Position.positionedOffset(lense)[1];
     
     var wC = image.getWidth();
     var hC = image.getHeight();
     var wL = lense.getWidth();
     var hL = lense.getHeight();
     var wI = image.getWidth();
     var hI = image.getHeight();
     
     //alert ('xC: ' + xC + ' yC: ' + yC + ' wC:' + wC + ' hC:' + hC);
     var cE = document.getElementById("cornerImg");
     if ( xC <=  0 || yC <= 0 )
     {
         cE.style.cssText = 'position: absolute; bottom: 0px; right: 0px; vertical-align: bottom; cursor: se-resize';
     }
     else
     {
         var width = (xC + wI) + 'px';
         lense.setStyle({width: width})
         var height = (yC + hI) + 'px';
         lense.setStyle({height: height});
         
         cE.style.cssText = 'position: absolute; bottom: 0px; right: 0px; vertical-align: bottom; cursor: se-resize';
     }
 }
 
 function deleteit(tdItem, pairId)
 {
     tdItem = $(tdItem);
     
     var item = tdItem.up().up();
     var itemDesc = item.next();
      
     markerDiv = $('' + pairId); //document.getElementById(pairId);
     if ( markerDiv )
     {
         $(markerDiv).remove();
     }
         
     item.remove();
     itemDesc.remove();
 }     
 
 function selectit(tdItem, pairId)
 {   
     //alert(pairId);
     //tdItem is <a></a>
     tdItem = $(tdItem);
     //alert(tdItem.innerHTML);
     
     var item = tdItem.up().up();
     //alert(item.innerHTML);
     var itemDesc = item.next();
     //alert(itemDesc.innerHTML);     
     
  
     var markerDiv = null;
     //at first test if the item has been selected
     markerDiv = document.getElementById(pairId);
     if ( markerDiv )
      {
          alert("The item has been selected.");
          return;
      }
         
      var selectTable = $('selectTable');
     //alert(selectTable.innerHTML);
         
     selectTableTbody = selectTable.down();
     if ( !selectTableTbody )
         selectTableTbody = selectTable;
     item.remove();
     itemDesc.remove();

     var url = "ajax/" + locateJsp + "?id=" + dataId + "&pointId=" + pairId;
     //alert(url);
     selectUpdate(url);
     
     if ( _progressEnd == 0 )
         startProgress();
     else
         queryOne();
 }
 
 function locateUpdate(url)
 {
     //alert(url);
     new Ajax.Request(url, { method: 'post',
                             onSuccess: function(transport) 
     {
         $("loading").remove();
         
         var itemList = transport.responseXML;
         var items = itemList.getElementsByTagName("Item");
         //alert("item number: " + items.length);
         
        var searchTable = $('searchTable');
        var searchTableTbody = searchTable.down();         

         var rows = buildRows(items, 'search');
         for ( i = 0; i < rows.length; i++ )
         {
             var tr = rows[i];
             //alert(tr.innerHTML);
             if ( tr ) 
             {
                 searchTableTbody.insert(tr);
             }
         }
         
         if ( instructionDeleted == 0 && rows.length > 0 )
         {
             var ins = $('instruction');
             if ( ins )
             {
                 ins.remove();
                 instructionDeleted = 1;
             }
         }
     }});
 }
 
 function selectUpdate(url)
 {
     new Ajax.Request(url, { method: 'post',
                             onSuccess: function(transport) 
     {
         var itemList = transport.responseXML;
         var items = itemList.getElementsByTagName("Item");
                                     
         var markers = buildMarkers(items);
         for ( var i = 0; i < markers.length; i++ )
         {
             graphics.insert(markers[i]);    
         }
         var rows = buildRows(items, 'selected');
         for ( i = 0; i < rows.length; i++ )
         {
             var tr = rows[i];
             //alert(tr.innerHTML);
             if ( tr ) 
             {
                 var selectTable = $('selectTable');
                 var selectTableTbody = selectTable.down();
                 selectTableTbody.insert(tr);
             }
         }
         
         gotOne();
     }});
 }
 
 function buildMarkers(items)
 {
     var markers = new Array(items.length);
     for ( var i = 0; i < items.length; i++ )
     {
         var item = items[i];
         var id = item.getAttribute("id");
         var title = item.getElementsByTagName("title")[0].childNodes[0].nodeValue;
         var desc = "";
         var descNode = item.getElementsByTagName("desc");
         if ( descNode && descNode.length > 0 )
         {
             var descText = descNode[0].childNodes;
             if ( descText && descText.length > 0 )
             {
                 desc = ": " + descText[0].nodeValue;
             }
         }         
         
         var node = document.createElement("div");
         node = $(node);
         node.setAttribute("id", id);
         node.setAttribute("title", title + desc);
         node.addClassName("marker");
         var x = item.getAttribute("x");
         var y = item.getAttribute("y");    
         var color = colorHash.get(id);
         if ( !color )
             color = "#FF0000";
         var style = "position: absolute; left: " + (x - 1) + "px; top: " + (y - 1) + "px; width: 6px; height: 6px; border: 2px solid " + color + "; z-index: 2";
         node.style.cssText = style;
         markers[i] = node;
     }
     return markers;
 }
 
 function buildRows(items, className)
 {
     var rows = new Array(items.length * 2);
     for ( var i = 0; i < items.length; i++ )
     {
         var item = items[i];
         var tr = document.createElement("tr");
         tr.setAttribute("class",  className);
         tr.style.cssText = "background-color: #E0E0E0";
         var id = item.getAttribute("id");
         //var e = item.getAttribute("e");
         var t = item.getAttribute("t");
         var c = item.getAttribute("c");
         var r = item.getAttribute("r");
         var p = item.getAttribute("p");
         var title = item.getElementsByTagName("title")[0].childNodes[0].nodeValue;
         tr.setAttribute("id", "" + id + "tr");
         
         var td = document.createElement("td");
         td = $(td);
         td.update("<a target=\"_blank\" href=\"" + displayJsp + "?id=" + id + "\">" + title + "</a>");
         tr.appendChild(td);
         
         td = document.createElement("td");
         td = $(td);
         td.style.cssText = "cursor: pointer";
         var tdStr = "<a onclick=\"deleteit(this, " + id  + ");\"><font color=\"blue\">delete</font></a>";
         if ( className == 'search' )
             tdStr = "<a onclick=\"selectit(this, " + id  + ");\"><font color=\"blue\">select</font></a>";
         td.update(tdStr);
         tr.appendChild(td);

         if ( className != 'search' )
         {
             td = document.createElement("td");
             td = $(td);
             td.style.cssText = "cursor: pointer; align: center";
             var color = colorHash.get(id);
             if ( !color )
                 color = "#FF0000";             
             td.update("<a id=\"a" + id + "\" name=\"a" + id + "\" onclick=\"pickcolor(" + id  + ", 'a" + id + "');\"><div id=\"div" + id + "\" style=\"background-color: " + color + "; width: 60px; height: 20px\"></div></a>");
             tr.appendChild(td);                 
         }
         
         td = document.createElement("td");
         td = $(td);
         td.update(t);
         tr.appendChild(td);
         td = document.createElement("td");
         td = $(td);
         td.update(c);
         tr.appendChild(td);
         td = document.createElement("td");
         td = $(td);
         td.update("<font color=\"red\">" + r + "</font>");
         tr.appendChild(td);
         td = document.createElement("td");
         td = $(td);
         td.update(p);
         tr.appendChild(td);         
         //td = document.createElement("td");
         //td = $(td);
         //td.update("<a target=\"_blank\" href=\"displayExpt.jsp?id=" + e + "\">exp</a>");
         //tr.appendChild(td);

         rows[2*i] = tr;
         
         var tr2 = document.createElement("tr");
         tr2 = $(tr2);
         tr2.setAttribute("class",  className);
         var td2 = document.createElement("td");
         td2 = $(td2);
         td2.setAttribute("colSpan", "8");         
         tr2.appendChild(td2);
         rows[2*i+1] = tr2;         
         var descNode = item.getElementsByTagName("desc");
         if ( descNode && descNode.length > 0 )
         {
             var descText = descNode[0].childNodes;
             if ( descText && descText.length > 0 )
             {
                 var desc = descText[0].nodeValue;

                 td2.update("<font size=\"-1\">" + desc + "</font>");
             }
         }
     }
     return rows;
 }
 
 function createImg()
 {
     var img = document.createElement("img");
     img.setAttribute("src", "img/loading.gif");
     img.setAttribute("id", "loading");
     return img;
 }
 
 function searchit(idxNum)
 {
     //alert(idxNum);
     //alert($F('searchKey'));
     var url = "ajax/search.jsp?key=" + $F('searchKey') + "&idx=" + idxNum + "&select=1";
     search.hide();
     searchResult.show();
     new Ajax.Updater('searchResultDiv', url); 
     doneSearch = 1;
 }
 
 function search()
 {
     var url = "ajax/search2.jsp?key=" + $F('key') + "&idx=" + $F('idx');
     //alert(url);
     new Ajax.Updater('resultDiv', url);
 }
 
 function page(type, sessionKey, pageIdx)
 {
     if ( type == 1)                      //type 1: search on index.jsp
         search2(sessionKey, pageIdx);
     else if ( type == 2 )                //type 2: all experiment on index.jsp
         allExpts(pageIdx);
     else if ( type == 3 )                //type 3: up-regulated genes on displayPair.jsp
         upRegulatedGeneList(sessionKey, pageIdx);
     else if ( type == 4 )                //type 4: down-regulated genes on displayPair.jsp
         downRegulatedGeneList(sessionKey, pageIdx);
     else if ( type == 5 )                //type 5: simmiar T/C in displayPair.jsp
         similarTc(sessionKey, pageIdx);
     else if ( type == 6 )                //type 6: simmiar Feature in displayFeature.jsp
         similarFeature(sessionKey, pageIdx);   
     else if ( type == 7 )                //type 7: up-regulation T/C on displayFeature.jsp
         upTcList(sessionKey, pageIdx);
     else if ( type == 8 )                //type 8: down-regulation T/C on displayFeature.jsp
         downTcList(sessionKey, pageIdx);

 }
 
 function highlightit(marker)
 {
/*     
     var markerDiv = $('' + marker);
     if ( markerDiv == null )
         return;
     
      Effect.Pulsate($(markerDiv));
*/
 }
 
 function clearItems(box)
 {
     var clear;
     if ( box == 'select')
     {
         clear = select;
         var markers = $$("div.marker");
         for ( var i = 0; i < markers.length; i++ )
         {
             var marker = markers[i];
             marker.remove();
         }              
     }
     else
     {
         clear = search;
         if ( doneSearch > 0 )
             clear = searchResult;
     }
     
     var clearTableTbody = clear.down().down();
     while ( clearTableTbody.childNodes.length > 1 )
         clearTableTbody.removeChild(clearTableTbody.lastChild);    
     
     if ( doneSearch > 0 )
         clearTableTbody.removeChild(clearTableTbody.lastChild);
 }
 
 function displaySlides()
 {
     var url = slideJsp + "?";
     var markers = $$("div.marker");
     
     if ( markers.length == 0 )
     {
         alert("Please select data items for slides show.");
         return;
     }
     if ( markers.length > 80 )
     {
         alert("You have too many data items for slide show. Please split your data items to 80 or less.");
         return;
     }

     for ( var i = 0; i < markers.length; i++ )
     {
         var marker = markers[i];
         if ( i > 0 )
             url += "&";
         
         url += "id=" + marker.readAttribute("id");
     }
     
     //alert(url);
     var nw = window.open();
     nw.location.href = url;     
     
 }

 function refreshSelectedItems()
 {
     var searchTable = $('searchTable');
     var searchTableTbody = searchTable.down();
                 
     while ( searchTableTbody.childNodes.length > 1 )
         searchTableTbody.removeChild(searchTableTbody.lastChild);
     
     var selectTable = $('selectTable');
     var selectTableTbody = selectTable.down();
                 
     while ( selectTableTbody.childNodes.length > 1 )
         selectTableTbody.removeChild(selectTableTbody.lastChild);
     
     var markers = $$("div.marker");
     if ( markers.length == 0 )
         return;
     
     var url = "ajax/" + locateJsp + "?id=" + dataId;
     for ( var i = 0; i < markers.length; i++ )
     {
         var marker = markers[i];
         var id = marker.readAttribute("id");
         url = url + "&pointId=" + id;
         marker.remove();
     }
     selectUpdate(url);
 }
 
 function refreshTitle()
 {
     var countStr = "";
     if ( gallery != null )
         countStr = "(" + (gallery.getCurIter() + 1) + "/" + gallery.getMaxIter() + ")";
     else
         countStr = "";
     
     header.update("<a target=\"_blank\" href=\"" + displaySlidePageJsp + "?id=" + dataId + "\">" + headerStr + " " + countStr + "</a>");
     content.update(contentStr);
     Effect.BlindDown(content);
 }