Fixed merge conflicts with wip-zoomextents code

app/assets/javascripts/src/JIT.js

@@ -2498,7 +2498,11 @@ Extras.Classes.Navigation = new Class({
     if (!Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) {
       Metamaps.Mouse.boxStartCoordinates = eventInfo.getPos();
     }
+
     Metamaps.Mouse.didPan = false;
+    
+
+    
     // END METAMAPS CODE
     
     this.pos = eventInfo.getPos();
@@ -2570,6 +2574,8 @@ Extras.Classes.Navigation = new Class({
     
     // START METAMAPS CODE
     if (Metamaps.Mouse.didPan) Metamaps.JIT.SmoothPanning();
+    
+    
     // END METAMAPS CODE
     
   }

app/assets/javascripts/src/Metamaps.GlobalUI.js

@@ -366,6 +366,23 @@ Metamaps.GlobalUI.Search = {
                     self.close(0, true);
                 }
                 break;
+            case 65:
+            case 97:
+                e.preventDefault();
+                if (e.ctrlKey){
+                    Metamaps.Visualize.mGraph.graph.eachNode(function (n) {
+                        Metamaps.Control.selectNode(n,e);
+                    });
+
+                    Metamaps.Visualize.mGraph.plot();
+                }
+                
+                break;
+            case 69:
+            case 101:
+                e.preventDefault();
+                Metamaps.JIT.zoomExtents();
+                break;
             default:
                 break; //console.log(e.which);
             }

app/assets/javascripts/src/Metamaps.JIT.js

@@ -319,7 +319,7 @@ Metamaps.JIT = {
                     if (Metamaps.Mouse.boxStartCoordinates) {
                         Metamaps.Visualize.mGraph.busy = false;
                         Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos();
-                        Metamaps.JIT.selectWithBox(e);
+                        Metamaps.JIT.zoomToBox();
                         return;
                     }
 
@@ -672,8 +672,6 @@ Metamaps.JIT = {
 
             var scale = dist / lastDist;
 
-            console.log(scale);
-
             if (8 >= Metamaps.Visualize.mGraph.canvas.scaleOffsetX * scale && Metamaps.Visualize.mGraph.canvas.scaleOffsetX * scale >= 1) {
                 Metamaps.Visualize.mGraph.canvas.scale(scale, scale);
             }
@@ -969,6 +967,8 @@ Metamaps.JIT = {
 			var fromNodeY = -1 * synapse.get('edge').nodeFrom.pos.y;
 			var toNodeX = synapse.get('edge').nodeTo.pos.x;
 			var toNodeY = -1 * synapse.get('edge').nodeTo.pos.y;
+            var from = synapse.get('edge').nodeFrom;
+			var to = synapse.get('edge').nodeTo;
             
 			var maxX = fromNodeX;
 			var maxY = fromNodeY;
@@ -988,7 +988,7 @@ Metamaps.JIT = {
 			(eX > maxBoxX) ? (maxBoxX = eX):(minBoxX = eX);
 			(eY > maxBoxY) ? (maxBoxY = eY):(minBoxY = eY);
 			
-			//Fins the slopes from the synapse fromNode to the 4 corners of the selection box
+			//Find the slopes from the synapse fromNode to the 4 corners of the selection box
 			var slopes = [];
 			slopes.push( (sY - fromNodeY) / (sX - fromNodeX) );
 			slopes.push( (sY - fromNodeY) / (eX - fromNodeX) );
@@ -1007,6 +1007,10 @@ Metamaps.JIT = {
 			var b = fromNodeY - synSlope * fromNodeX;
 			
 			var selectTest = false;
+            if (from.name == 'node 3' && to.name == 'node1'){
+                console.log(from.pos.x,-1*from.pos.y,to.pos.x,-1*to.pos.y,sX,sY,eX,eY);   
+            }
+            
 			
 			//if the synapse slope is within a range that would intersect with the selection box
 			if (synSlope <= maxSlope && synSlope >= minSlope){
@@ -1027,17 +1031,18 @@ Metamaps.JIT = {
 				testY = sY;
 				testX = (testY - b)/synSlope;
 				
-				if(testX >= minX && testX <= maxX && testY >= minY && testY <= maxY && testX >= minBoxX && testY <= maxBoxX){
+				if(testX >= minX && testX <= maxX && testY >= minY && testY <= maxY && testX >= minBoxX && testX <= maxBoxX){
 					selectTest = true;
 				}
 				
 				testY = eY;
 				testX = (testY - b)/synSlope;
 				
-				if(testX >= minX && testX <= maxX && testY >= minY && testY <= maxY && testX >= minBoxX && testY <= maxBoxX){
+				if(testX >= minX && testX <= maxX && testY >= minY && testY <= maxY && testX >= minBoxX && testX <= maxBoxX){
 					selectTest = true;
 				}				
 			}
+            //console.log('From '+from.name + ' to ' + to.name + ' is a ' +selectTest);
 			//The test synapse was selected!
 			if(selectTest){
 				if(e.ctrlKey){
@@ -1102,15 +1107,23 @@ Metamaps.JIT = {
             // wait a certain length of time, then check again, then run this code
             setTimeout(function () {
                 if (!Metamaps.JIT.nodeWasDoubleClicked()) {
-                    if (!e.shiftKey) {
+                    if (!e.shiftKey && !e.ctrlKey) {
                         Metamaps.Control.deselectAllNodes();
                         Metamaps.Control.deselectAllEdges();
                     }
+                    if(e.ctrlKey || e.shiftKey){
                         if (node.selected) {
                             Metamaps.Control.deselectNode(node);
                         } else {
                             Metamaps.Control.selectNode(node,e);
                         } 
+                    }
+                    else{
+                        Metamaps.Control.deselectAllNodes();
+                        Metamaps.Control.deselectAllEdges();
+                        Metamaps.Control.selectNode(node,e);
+                    }
+                    
                     //trigger animation to final styles
                     Metamaps.Visualize.mGraph.fx.animate({
                         modes: ['edge-property:lineWidth:color:alpha'],
@@ -1138,7 +1151,6 @@ Metamaps.JIT = {
         // create new menu for clicked on node
         var rightclickmenu = document.createElement("div");
         rightclickmenu.className = "rightclickmenu";
-
         // add the proper options to the menu
         var menustring = '<ul>';
 
@@ -1170,8 +1182,7 @@ Metamaps.JIT = {
             top: e.clientY
         });
         //add the menu to the page
-        $('#wrapper').append(rightclickmenu);
+        $('#infovis-canvaswidget').append(rightclickmenu);
-
 
         // attach events to clicks on the list items
 
@@ -1494,7 +1505,55 @@ Metamaps.JIT = {
 
         canvas.translate(-1*offsetX,-1*offsetY);
     },
-    zoomExtents: function (event) {
+    zoomToBox: function () {
+        var sX = Metamaps.Mouse.boxStartCoordinates.x,
+            sY = Metamaps.Mouse.boxStartCoordinates.y,
+            eX = Metamaps.Mouse.boxEndCoordinates.x,
+            eY = Metamaps.Mouse.boxEndCoordinates.y;
+
+        Metamaps.JIT.centerMap();
+
+        var height = $(document).height(),
+            width = $(document).width();
+
+        var spanX = Math.abs(sX - eX);
+        var spanY = Math.abs(sY - eY);
+        var ratioX = width / spanX;
+        var ratioY = height / spanY;
+        console.log(ratioX,ratioY);
+
+        var newRatio = Math.min(ratioX,ratioY);
+
+        var canvas = Metamaps.Visualize.mGraph.canvas;
+
+        if(canvas.scaleOffsetX *newRatio<= 5 && canvas.scaleOffsetX*newRatio >= 0.2){
+            canvas.scale(newRatio,newRatio);
+        }
+        else if(canvas.scaleOffsetX * newRatio > 5){
+            newRatio = 5/ canvas.scaleOffsetX;
+            canvas.scale(newRatio,newRatio);
+        }
+        else{
+            newRatio = 0.2/ canvas.scaleOffsetX;
+            canvas.scale(newRatio,newRatio);
+        }
+        
+        
+        
+        
+
+        var cogX = (sX + eX)/2;
+        var cogY = (sY + eY)/2;
+
+        canvas.translate(-1* cogX, -1* cogY);
+        
+
+        Metamaps.Mouse.boxStartCoordinates = false;
+        Metamaps.Mouse.boxEndCoordinates = false;
+        Metamaps.Visualize.mGraph.plot();
+        
+    },
+    zoomExtents: function () {
         Metamaps.JIT.centerMap();
         var height = $(document).height(),
             width = $(document).width(),
@@ -1503,6 +1562,10 @@ Metamaps.JIT = {
         
         if (Metamaps.Selected.Nodes.length > 0) {
             var nodes = Metamaps.Selected.Nodes;
+        }
+        else {
+            var nodes = _.values(Metamaps.Visualize.mGraph.graph.nodes);
+        }
 
         if(nodes.length > 1){
             nodes.forEach(function (n) {
@@ -1516,10 +1579,22 @@ Metamaps.JIT = {
                     minY = y; 
                 }
 
-                    maxX = Math.max(x,maxX);
+                var arrayOfLabelLines = Metamaps.Util.splitLine(n.name, 30).split('\n'),
-                    maxY = Math.max(y,maxY);
+                    dim = n.getData('dim'),
-                    minX = Math.min(x,minX);
+                    ctx = Metamaps.Visualize.mGraph.canvas.getCtx();
-                    minY = Math.min(y,minY);
+
+                var height = 25 * arrayOfLabelLines.length;
+
+                var index, lineWidths = [];
+                for (index = 0; index < arrayOfLabelLines.length; ++index) {
+                    lineWidths.push(ctx.measureText(arrayOfLabelLines[index]).width)
+                }
+                var width = Math.max.apply(null, lineWidths) + 8;
+
+                maxX = Math.max(x + width /2,maxX);
+                maxY = Math.max(y + n.getData("height") + 5 + height,maxY);
+                minX = Math.min(x - width /2,minX);
+                minY = Math.min(y - dim,minY);
 
                 counter++;
             });
@@ -1530,10 +1605,21 @@ Metamaps.JIT = {
             var ratioY = spanY / height;
 
             var newRatio = Math.max(ratioX,ratioY);
+            var scaleMultiplier = 1/newRatio*0.9;
 
             var canvas = Metamaps.Visualize.mGraph.canvas;
+            if(canvas.scaleOffsetX *scaleMultiplier<= 3 && canvas.scaleOffsetX*scaleMultiplier >= 0.2){
+                canvas.scale(scaleMultiplier,scaleMultiplier);
+            }
+            else if(canvas.scaleOffsetX * scaleMultiplier > 3){
+                scaleMultiplier = 3/ canvas.scaleOffsetX;
+                canvas.scale(scaleMultiplier,scaleMultiplier);
+            }
+            else{
+                scaleMultiplier = 0.2/ canvas.scaleOffsetX;
+                canvas.scale(scaleMultiplier,scaleMultiplier);
+            }
             
-                canvas.scale(1/newRatio*0.8,1/newRatio*0.8);
 
             counter = 0;
 
@@ -1548,74 +1634,26 @@ Metamaps.JIT = {
                     minY = y; 
                 }
 
-                    maxX = Math.max(x,maxX);
+                var arrayOfLabelLines = Metamaps.Util.splitLine(n.name, 30).split('\n'),
-                    maxY = Math.max(y,maxY);
+                    dim = n.getData('dim'),
-                    minX = Math.min(x,minX);
+                    ctx = Metamaps.Visualize.mGraph.canvas.getCtx();
-                    minY = Math.min(y,minY);
+
+                var height = 25 * arrayOfLabelLines.length;
+
+                var index, lineWidths = [];
+                for (index = 0; index < arrayOfLabelLines.length; ++index) {
+                    lineWidths.push(ctx.measureText(arrayOfLabelLines[index]).width)
+                }
+                var width = Math.max.apply(null, lineWidths) + 8;
+
+                maxX = Math.max(x + width /2,maxX);
+                maxY = Math.max(y + n.getData("height") + 5 + height,maxY);
+                minX = Math.min(x - width /2,minX);
+                minY = Math.min(y - dim,minY);
 
                 counter++;
             });
         }
-        }
-        else{
-            var nodes = Metamaps.Visualize.mGraph.graph;
-
-            if(Object.keys(nodes).length >1){
-                nodes.eachNode(function (n) {
-                    var x = n.pos.x,
-                        y = n.pos.y;
-
-                    if (counter == 0){
-                        maxX = x;
-                        minX = x; 
-                        maxY = y;
-                        minY = y; 
-                    }
-
-                    maxX = Math.max(x,maxX);
-                    maxY = Math.max(y,maxY);
-                    minX = Math.min(x,minX);
-                    minY = Math.min(y,minY);
-
-                    counter++;
-                });
-
-                var spanX = maxX - minX;
-                var spanY = maxY - minY;
-                var ratioX = spanX / width;
-                var ratioY = spanY / height;
-
-                var newRatio = Math.max(ratioX,ratioY);
-
-                var canvas = Metamaps.Visualize.mGraph.canvas;
-
-                canvas.scale(1/newRatio*0.8,1/newRatio*0.8);
-
-                counter = 0;
-
-                nodes.eachNode(function (n) {
-                    var x = n.pos.x,
-                        y = n.pos.y;
-
-                    if (counter == 0){
-                        maxX = x;
-                        minX = x; 
-                        maxY = y;
-                        minY = y; 
-                    }
-
-                    maxX = Math.max(x,maxX);
-                    maxY = Math.max(y,maxY);
-                    minX = Math.min(x,minX);
-                    minY = Math.min(y,minY);
-
-                    counter++;
-                });
-            }   
-        }
-
-        
-        
 
         var cogX = (maxX + minX)/2;
         var cogY = (maxY + minY)/2;

app/assets/javascripts/src/Metamaps.js

@@ -47,6 +47,7 @@ Metamaps.Touch = {
 
 Metamaps.Mouse = {
     didPan: false,
+    didBoxZoom: false,
     changeInX: 0,
     changeInY: 0,
     edgeHoveringOver: false,
@@ -2021,11 +2022,13 @@ Metamaps.Control = {
         if (Metamaps.Selected.Nodes.indexOf(node) != -1) return;
         node.selected = true;
         node.setData('dim', 30, 'current');
+        /*
 		if(!(e.ctrlKey) && !(e.altKey)){
 			node.eachAdjacency(function (adj) {
 				Metamaps.Control.selectEdge(adj);
 			});
 		}
+        */
 		
         Metamaps.Selected.Nodes.push(node);
     },