From ba937103e0ee39deba44f0d295e182731dc59f40 Mon Sep 17 00:00:00 2001
From: Pujan Joshi <pujan@guavaworld.com>
Date: Mon, 11 Jan 2016 15:41:00 -0500
Subject: [PATCH] sortable

---
 VQI_PathwayEditor.js | 186 ++++++++++++++++++++++---------------------
 1 file changed, 96 insertions(+), 90 deletions(-)

diff --git a/VQI_PathwayEditor.js b/VQI_PathwayEditor.js
index 6bbfd25..fc137e1 100755
--- a/VQI_PathwayEditor.js
+++ b/VQI_PathwayEditor.js
@@ -4,9 +4,9 @@ var VQI_PathwayEditor = function (parent) {
 //	var serverURL = "http://cardinal3.engr.uconn.edu/pathwayVisual/";
     var services = {};
 
-	/*Local Services*/
-	services["pathwayFinderUrl"] = "http://bibci.engr.uconn.edu/puj07001/pathway_services/find_path_and_score/find_path_and_score.php";
-	
+    /*Local Services*/
+    services["pathwayFinderUrl"] = "http://bibci.engr.uconn.edu/puj07001/pathway_services/find_path_and_score/find_path_and_score.php";
+
     /* Yue's Local Server*/
     services['pathwayFinder'] = 'http://cardinal3.engr.uconn.edu/pathwayVisual/PathwayParser/ajaxJSON.php';
     services['pathwaySaver'] = 'http://cardinal3.engr.uconn.edu/pathwayVisual/PathwayParser/updateDB_json.php';
@@ -122,7 +122,7 @@ var VQI_PathwayEditor = function (parent) {
     strVar += "			<td>rna distance<\/td>";
     strVar += "			<td>cnv distance<\/td>";
     strVar += "			<td>mut distance<\/td>";
-	strVar += "		<\/tr>";
+    strVar += "		<\/tr>";
     strVar += "	<\/table>";
     strVar += "	<\/div>";
     strVar += " <div id=\"" + parent + "-dialog-form-save-as-pathway\" title=\"SaveAs\">";
@@ -161,14 +161,10 @@ var VQI_PathwayEditor = function (parent) {
     strVar += " 				<input type=\"text\" class=\"form-control\" name=\"" + parent + "-sid\" id=\"" + parent + "-sid\"><br>";
     strVar += "      			<label for=\"" + parent + "-vid\">vid:<\/label>";
     strVar += " 				<input type=\"text\" class=\"form-control\" name=\"" + parent + "-vid\" id=\"" + parent + "-vid\"><br>";
-<<<<<<< HEAD
-    strVar += " 				<input type=\"submit\" tabindex=\"-1\" style=\"position:absolute; top:-1000px\"><\/input>";
-    strVar += "    		<\/fieldset>";
-=======
+
     strVar += " 				<input id=\"" + parent + "-find-paths-all\" value=\"Find All\" type=\"button\" class=\"btn btn-link\"><\/input>";
-	strVar += " 				<input id=\"" + parent + "-find-paths-one\" value=\"Find\" type=\"button\" class=\"btn btn-link\"><\/input>";
+    strVar += " 				<input id=\"" + parent + "-find-paths-one\" value=\"Find\" type=\"button\" class=\"btn btn-link\"><\/input>";
     strVar += "    			</div>";
->>>>>>> origin/master
     strVar += " 		<\/form>";
     strVar += "	<\/div>";
     strVar += "	<div id=\"" + parent + "-dialog-form-edge\" title=\"Edit edge(s)\">";
@@ -258,8 +254,8 @@ var VQI_PathwayEditor = function (parent) {
     strVar += "  					<option id=\"" + parent + "-select-receptor\">receptor<\/option>";
     strVar += "  					<option id=\"" + parent + "-select-biologicalProcess\">biologicalProcess<\/option>";
     strVar += "  					<option id=\"" + parent + "-select-triangle\">triangle<\/option>";
-	strVar += "  					<option id=\"" + parent + "-select-rectangle\">rectangle<\/option>";
-	strVar += "  					<option id=\"" + parent + "-select-circle\">circle<\/option>";
+    strVar += "  					<option id=\"" + parent + "-select-rectangle\">rectangle<\/option>";
+    strVar += "  					<option id=\"" + parent + "-select-circle\">circle<\/option>";
     strVar += "  					<option id=\"" + parent + "-select-ellipse\">ellipse<\/option>";
     strVar += "  					<option id=\"" + parent + "-select-pentagon\">pentagon<\/option>";
     strVar += "  					<option id=\"" + parent + "-select-hexagon\">hexagon<\/option>";
@@ -309,7 +305,10 @@ var VQI_PathwayEditor = function (parent) {
     strVar += "	<div id=\"" + parent + "-cy\" style=\"height: 100%;width: 100%;position: absolute; left: 0;\"><\/div>";
 
     document.getElementById(parent).innerHTML = strVar;
-	sorttable.makeSortable(document.getElementById(parent + '-inner-table'));
+//    var resultTable = document.getElementById(parent + '-inner-table')
+//    console.log(resultTable);
+//    sorttable.makeSortable(resultTable);
+//        console.log(resultTable);
 
     $(function () {// on dom ready
 
@@ -387,7 +386,7 @@ var VQI_PathwayEditor = function (parent) {
             }
             saveState();
         }
-		
+
         function expandBundle(event) {
             var cy = $('#' + parent + '-cy').cytoscape('get');
             for (var i = 0; i < selectedForEditNodes.size(); i++) {
@@ -1173,12 +1172,12 @@ var VQI_PathwayEditor = function (parent) {
             var sid = orderedSelectedNodes[0]._private.data['id'];
             var vid = orderedSelectedNodes[1]._private.data['id'];
             $.post(services['pathwayFinderUrl'], {
-				s: sid,
-				d: vid,
-				json: JSON.stringify(JSON.parse(states[states.length - 1])),
-				p: "X1728790"
+                s: sid,
+                d: vid,
+                json: JSON.stringify(JSON.parse(states[states.length - 1])),
+                p: "X1728790"
             }, function (yue_data) {
-				console.log(yue_data);
+                console.log(yue_data);
                 var result = JSON.parse(yue_data);
                 var table = document.getElementById(parent + "-inner-table");
                 var length = document.getElementById(parent + "-inner-table").rows.length;
@@ -1186,8 +1185,9 @@ var VQI_PathwayEditor = function (parent) {
                 for (var n = 0; n < length; n++) {
                     table.deleteRow(0);
                 }
-                
-				for (var n = 0; n <= result.length; n++) {
+                table.deleteTHead();
+//
+                for (var n = 0; n <= result.length; n++) {
                     var row = table.insertRow();
 
                     var path = row.insertCell(0);
@@ -1206,7 +1206,9 @@ var VQI_PathwayEditor = function (parent) {
                         mFdr.innerHTML = "<i><h3>M-FDR</h3></i>";
                         lowP.innerHTML = "<i><h3>LowP</h3></i>"
                         consistentLowP.innerHTML = "<i><h3>Consistent Low P</h3></i>"
+                        sorttable.makeSortable(table);
                     } else {
+//                        break;
                         var btn = document.createElement("button");
                         var t = document.createTextNode((n - 1).toString());
                         btn.className = "btn btn-link";
@@ -1215,7 +1217,7 @@ var VQI_PathwayEditor = function (parent) {
                             var k = parseInt(event.currentTarget.innerHTML);
                             cy.$('node').unselect();
                             cy.$('edge').unselect();
-							cy.$('node').style("opacity", 0.2);
+                            cy.$('node').style("opacity", 0.2);
                             cy.$('edge').style("opacity", 0.2);
                             for (var j = 0; j < result[k].edges.length; j++) {
                                 cy.elements("edge[id = \"" + result[k].edges[j] + "\"]").style("opacity", 1.0);
@@ -1226,15 +1228,16 @@ var VQI_PathwayEditor = function (parent) {
                             }
                         });
                         path.appendChild(btn);
-                        rScore.appendChild(document.createTextNode(result[n-1].rscore));
-                        mScore.appendChild(document.createTextNode(result[n-1].mscore));
-						mFdr.appendChild(document.createTextNode(result[n-1].mFDR));
-                        lowP.appendChild(document.createTextNode(result[n-1].lowp));
-                        consistentLowP.appendChild(document.createTextNode(result[n-1].consistent_lowp));
+                        rScore.appendChild(document.createTextNode(result[n - 1].rscore));
+                        mScore.appendChild(document.createTextNode(result[n - 1].mscore));
+                        mFdr.appendChild(document.createTextNode(result[n - 1].mFDR));
+                        lowP.appendChild(document.createTextNode(result[n - 1].lowp));
+                        consistentLowP.appendChild(document.createTextNode(result[n - 1].consistent_lowp));
                     }
                 }
                 dialogTable.dialog("open");
                 dialogPathfind.dialog("close");
+//                sorttable.makeSortable(table);
             });
         }
 
@@ -1405,55 +1408,55 @@ var VQI_PathwayEditor = function (parent) {
         }
 
         function editNodeName() {
-			var cy = $('#' + parent + '-cy').cytoscape('get');
+            var cy = $('#' + parent + '-cy').cytoscape('get');
             var name = document.getElementById(parent + "-gene-name").value;
-			if(name.indexOf(',')==-1)
-				selectedForEditNodes.data('name', name);
-			else{
-				var node = [];
-				var names = name.split(',');
-				for(var i=0; selectedForEditNodes.length > i; i++){
-					selectedForEditNodes[i].data("Type","bundleOne");
-					var xGap=0;
-					var yGap=0;
-					for(var j=0; names.length > j; j++){
-						if(j%5 == 0){
-							xGap=0
-							yGap+=10
-						}else{
-							xGap+=10
-						}
-						var newPositionX = selectedForEditNodes[i].position("x")+xGap;
-						var newPositionY = selectedForEditNodes[i].position("y")+yGap;
-						node.push({
-							group: "nodes",
-							data: {
-								LabelSize: 10,
-								Type: "circle",
-								Valign: "Middle",
-								Width: 10,
-								Height: 10,
-								id: "n" + nodeCounter,
-								name: names[j],
-								selected: false,
-								backgroundImage: "",
-								zIndex: 0,
-								parent: selectedForEditNodes[i].data("id")
-								
-							},
-							position: {
-								x: newPositionX,
-								y: newPositionY
-							}	
-						})
-						nodeCounter++;
-					}
-					cy.add(node);
-					postAddProcessing();
+            if (name.indexOf(',') == -1)
+                selectedForEditNodes.data('name', name);
+            else {
+                var node = [];
+                var names = name.split(',');
+                for (var i = 0; selectedForEditNodes.length > i; i++) {
+                    selectedForEditNodes[i].data("Type", "bundleOne");
+                    var xGap = 0;
+                    var yGap = 0;
+                    for (var j = 0; names.length > j; j++) {
+                        if (j % 5 == 0) {
+                            xGap = 0
+                            yGap += 10
+                        } else {
+                            xGap += 10
+                        }
+                        var newPositionX = selectedForEditNodes[i].position("x") + xGap;
+                        var newPositionY = selectedForEditNodes[i].position("y") + yGap;
+                        node.push({
+                            group: "nodes",
+                            data: {
+                                LabelSize: 10,
+                                Type: "circle",
+                                Valign: "Middle",
+                                Width: 10,
+                                Height: 10,
+                                id: "n" + nodeCounter,
+                                name: names[j],
+                                selected: false,
+                                backgroundImage: "",
+                                zIndex: 0,
+                                parent: selectedForEditNodes[i].data("id")
+
+                            },
+                            position: {
+                                x: newPositionX,
+                                y: newPositionY
+                            }
+                        })
+                        nodeCounter++;
+                    }
+                    cy.add(node);
+                    postAddProcessing();
                     selectedForEditNodes[i].descendants().ungrabify();
-					saveState();
-				}
-			}	
+                    saveState();
+                }
+            }
         }
 
         function editNodeMUT() {
@@ -1512,9 +1515,10 @@ var VQI_PathwayEditor = function (parent) {
 
                 var table = document.getElementById(parent + "-inner-table");
                 var length = document.getElementById(parent + "-inner-table").rows.length;
-                for (var n = 0; n < length; n++) {
-                    table.deleteRow(0);
-                }
+                sorttable.makeSortable(table);
+//                for (var n = 0; n < length; n++) {
+//                    table.deleteRow(0);
+//                }
                 for (var n = 0; n <= array.length; n++) {
                     var row = table.insertRow();
 
@@ -1540,8 +1544,10 @@ var VQI_PathwayEditor = function (parent) {
                         mutDistance.innerHTML = array[n - 1][1][3];
                     }
                 }
+
                 //document.getElementById(parent + "-dialog-table").innerHTML = data;
                 dialogTable.dialog("open")
+                sorttable.makeSortable(table);
             });
         }
 
@@ -1828,8 +1834,8 @@ var VQI_PathwayEditor = function (parent) {
                     'border-width': 1
                 })
 
-                // edge elements default css (unselected)
-                .selector('edge').css({
+                        // edge elements default css (unselected)
+                        .selector('edge').css({
                     'line-color': 'black',
                     'line-style': 'solid',
                     'opacity': 0.75,
@@ -1856,8 +1862,8 @@ var VQI_PathwayEditor = function (parent) {
                 })
 
 
-                // node & edge elements (selected state)
-                .selector('edge:selected').css({
+                        // node & edge elements (selected state)
+                        .selector('edge:selected').css({
                     'background-color': 'green',
                     'line-color': 'green',
                     'target-arrow-color': 'green',
@@ -1870,8 +1876,8 @@ var VQI_PathwayEditor = function (parent) {
                     'text-opacity': 1.0
                 })
 
-                // query purpose
-                .selector('.green_bg').css({
+                        // query purpose
+                        .selector('.green_bg').css({
                     'background-color': 'lightgreen',
                     'color': 'black'
                 }).selector('.red_bg').css({
@@ -1899,8 +1905,8 @@ var VQI_PathwayEditor = function (parent) {
                     'border-width': 1
                 })
 
-                // collapse
-                .selector('.collapsed').css({
+                        // collapse
+                        .selector('.collapsed').css({
                     'opacity': 0.01
                 }),
                 layout: {
@@ -1920,7 +1926,7 @@ var VQI_PathwayEditor = function (parent) {
                     $('#' + parent + '-bundle').removeClass('disabled');
                     $('#' + parent + '-unbundle').removeClass('disabled');
                     $('#' + parent + '-collapse').removeClass('disabled');
-					$('#' + parent + '-collapse-informative').removeClass('disabled');
+                    $('#' + parent + '-collapse-informative').removeClass('disabled');
                     $('#' + parent + '-expand').removeClass('disabled');
                     $('#' + parent + '-findpath').removeClass('disabled');
                     $('#' + parent + '-find-object').removeClass('disabled');
@@ -2102,8 +2108,8 @@ var VQI_PathwayEditor = function (parent) {
                     document.getElementById(parent + "-select-receptor").disabled = false;
                     document.getElementById(parent + "-select-biologicalProcess").disabled = false;
                     document.getElementById(parent + "-select-triangle").disabled = false;
-					document.getElementById(parent + "-select-rectangle").disabled = false;
-					document.getElementById(parent + "-select-circle").disabled = false;
+                    document.getElementById(parent + "-select-rectangle").disabled = false;
+                    document.getElementById(parent + "-select-circle").disabled = false;
                     document.getElementById(parent + "-select-ellipse").disabled = false;
                     document.getElementById(parent + "-select-pentagon").disabled = false;
                     document.getElementById(parent + "-select-hexagon").disabled = false;
@@ -2127,8 +2133,8 @@ var VQI_PathwayEditor = function (parent) {
                     document.getElementById(parent + "-select-receptor").disabled = true;
                     document.getElementById(parent + "-select-biologicalProcess").disabled = true;
                     document.getElementById(parent + "-select-triangle").disabled = true;
-					document.getElementById(parent + "-select-rectangle").disabled = true;
-					document.getElementById(parent + "-select-circle").disabled = true;
+                    document.getElementById(parent + "-select-rectangle").disabled = true;
+                    document.getElementById(parent + "-select-circle").disabled = true;
                     document.getElementById(parent + "-select-ellipse").disabled = true;
                     document.getElementById(parent + "-select-pentagon").disabled = true;
                     document.getElementById(parent + "-select-hexagon").disabled = true;