Merge pull request #371 from Connoropolous/wip-MouseStuff

Changes to Mouse Functionality

app/assets/javascripts/src/JIT.js

@@ -2481,6 +2481,7 @@ Extras.Classes.Navigation = new Class({
   },
   
   onMouseDown: function(e, win, eventInfo) {
+    ///console.log('mouse down!!!!');
     if(!this.config.panning) return;
     
     //START METAMAPS CODE
@@ -2495,8 +2496,9 @@ Extras.Classes.Navigation = new Class({
     //START METAMAPS CODE
     var rightClick = e.button == 2 || (navigator.platform.indexOf("Mac") != -1 && e.ctrlKey); 
     // TODO make sure this works across browsers  
-    if (!Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) {
+    if (!Metamaps.Mouse.boxStartCoordinates && ((e.button == 0 && e.shiftKey) || (e.button == 0 && e.ctrlKey)  || (rightClick && e.ctrlKey))) {
       Metamaps.Mouse.boxStartCoordinates = eventInfo.getPos();
+      //console.log('mouse down');
     }
 
     Metamaps.Mouse.didPan = false;
@@ -2524,14 +2526,19 @@ Extras.Classes.Navigation = new Class({
     
     // START METAMAPS CODE
     var rightClick = e.button == 2 || (navigator.platform.indexOf("Mac") != -1 && e.ctrlKey);
-    if (!Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) {
+    if (!Metamaps.Mouse.boxStartCoordinates && ((e.button == 0 && e.shiftKey) || (e.button == 0 && e.ctrlKey)  || (rightClick && e.ctrlKey))) {
       Metamaps.Visualize.mGraph.busy = true;
       Metamaps.boxStartCoordinates = eventInfo.getPos();
+      //console.log('mouse move');
       return;
     }
-    if (Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) { 
+    if (Metamaps.Mouse.boxStartCoordinates && ((e.button == 0 && e.shiftKey) || (e.button == 0 && e.ctrlKey)  || (rightClick && e.ctrlKey))) {
       Metamaps.Visualize.mGraph.busy = true;
       Metamaps.JIT.drawSelectBox(eventInfo,e);
+      //console.log('mouse move');
+      return;
+    }
+    if (rightClick){
       return;
     }
     if (e.target.id != 'infovis-canvas') { 

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

@@ -301,13 +301,16 @@ Metamaps.JIT = {
                 enableForEdges: true,
                 onMouseMove: function (node, eventInfo, e) {
                     Metamaps.JIT.onMouseMoveHandler(node, eventInfo, e);
+                    //console.log('called mouse move handler');
                 },
                 //Update node positions when dragged
                 onDragMove: function (node, eventInfo, e) {
                     Metamaps.JIT.onDragMoveTopicHandler(node, eventInfo, e);
+                    //console.log('called drag move handler');
                 },
                 onDragEnd: function (node, eventInfo, e) {
                     Metamaps.JIT.onDragEndTopicHandler(node, eventInfo, e, false);
+                    //console.log('called drag end handler');
                 },
                 onDragCancel: function (node, eventInfo, e) {
                     Metamaps.JIT.onDragCancelHandler(node, eventInfo, e, false);
@@ -352,21 +355,34 @@ Metamaps.JIT = {
                     $('.rightclickmenu').remove();
 
                     if (Metamaps.Mouse.boxStartCoordinates) {
+                        if(e.ctrlKey && e.shiftKey){
                             Metamaps.Visualize.mGraph.busy = false;
                             Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos();
                             Metamaps.JIT.zoomToBox(e);
+                            //console.log('called zoom to box');
                             return;
                         }
+                        else if (e.ctrlKey || e.shiftKey) {
+                            Metamaps.Visualize.mGraph.busy = false;
+                            Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos();
+                            Metamaps.JIT.selectWithBox(e);
+                            //console.log('called select with box');
+                            return;
+                        };
+                    }
 
                     if (e.target.id != "infovis-canvas") return false;
 
                     //clicking on a edge, node, or clicking on blank part of canvas?
                     if (node.nodeFrom) {
                         Metamaps.JIT.selectEdgeOnClickHandler(node, e);
+                        //console.log('called selectEdgeOnClickHandler');
                     } else if (node && !node.nodeFrom) {
                         Metamaps.JIT.selectNodeOnClickHandler(node, e);
+                        //console.log('called selectNodeOnClickHandler');
                     } else {
                         Metamaps.JIT.canvasClickHandler(eventInfo.getPos(), e);
+                        //console.log('called canvasClickHandler');
                     } //if
                 },
                 //Add also a click handler to nodes
@@ -375,10 +391,10 @@ Metamaps.JIT = {
                     // remove the rightclickmenu
                     $('.rightclickmenu').remove();
 
-                    if (Metamaps.Mouse.boxStartCoordinates) {
+                    if (Metamaps.Mouse.boxStartCoordinates && e.ctrlKey) {
                         Metamaps.Visualize.mGraph.busy = false;
                         Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos();
-                        Metamaps.JIT.selectWithBox(e);
+                        Metamaps.JIT.zoomToBox(e);
                         return;
                     }
 
@@ -390,8 +406,8 @@ Metamaps.JIT = {
                     } else if (node && !node.nodeFrom) {
                         Metamaps.JIT.selectNodeOnRightClickHandler(node, e);
                     } else {
-                        console.log('right clicked on open space');
+                        //console.log('right clicked on open space');
-                    } //if
+                    } 
                 }
             },
             //Number of iterations for the FD algorithm
@@ -736,7 +752,7 @@ Metamaps.JIT = {
         if (node && !node.nodeFrom) {
             var pos = eventInfo.getPos();
             // if it's a left click, or a touch, move the node
-            if (e.touches || (e.button == 0 && !e.altKey && (e.buttons == 0 || e.buttons == 1 || e.buttons == undefined))) {
+            if (e.touches || (e.button == 0 && !e.altKey && !e.ctrlKey && !e.shiftKey && (e.buttons == 0 || e.buttons == 1 || e.buttons == undefined))) {
                 //if the node dragged isn't already selected, select it
                 var whatToDo = self.handleSelectionBeforeDragging(node, e);
                 if (node.pos.rho || node.pos.rho === 0) {
@@ -949,9 +965,11 @@ Metamaps.JIT = {
             tempInit = false;
             tempNode = null;
             tempNode2 = null;
+            if (!e.ctrlKey && !e.shiftKey) {
                 Metamaps.Control.deselectAllEdges();
                 Metamaps.Control.deselectAllNodes();
             }
+        }
     }, //canvasClickHandler 
     nodeDoubleClickHandler: function (node, e) {
 
@@ -1181,17 +1199,18 @@ Metamaps.JIT = {
                     if (!e.shiftKey && !e.ctrlKey) {
                         Metamaps.Control.deselectAllNodes();
                         Metamaps.Control.deselectAllEdges();
+                        Metamaps.Control.selectNode(node,e);
                     }
-                    if(e.ctrlKey || e.shiftKey){
+                    else if(e.shiftKey && e.ctrlKey){
+                        //no result
+                    }
+                    else if(e.ctrlKey){
                         if (node.selected) {
                             Metamaps.Control.deselectNode(node);
                         } else {
                             Metamaps.Control.selectNode(node,e);
                         } 
-                    }
+                    }else if(e.shiftKey){
-                    else{
-                        Metamaps.Control.deselectAllNodes();
-                        Metamaps.Control.deselectAllEdges();
                         Metamaps.Control.selectNode(node,e);
                     } 
                     
@@ -1352,15 +1371,24 @@ 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();
                     }
+                    else if (e.shiftKey && e.ctrlKey){
+                        //no result
+                    }
+                    else if (e.ctrlKey){
                         if (Metamaps.Selected.Edges.indexOf(adj) !== -1) {
                             Metamaps.Control.deselectEdge(adj);
                         } else {
                             Metamaps.Control.selectEdge(adj);
                         }
+                    }
+                    else if (e.shiftKey){
+                        Metamaps.Control.selectEdge(adj);
+                    }
+
                     Metamaps.Visualize.mGraph.plot();
                 }
             }, Metamaps.Mouse.DOUBLE_CLICK_TOLERANCE);

app/assets/stylesheets/application.css

@@ -2730,3 +2730,11 @@ and it won't be important on password protected instances */
     -webkit-transform-origin: left center;
     transform-origin: left center;
 }   
+.blockchain-btn {
+    display: inline;
+    float: right;
+}
+script.data-gratipay-username {
+    display: inline;
+    float: left;
+}

app/views/layouts/_lightboxes.html.erb

@@ -167,14 +167,14 @@
         <p>We welcome people of all skillsets to contribute to the project in different ways. Designers, researchers, academics, strategists, and facilitators can get in touch about opportunities to contribute to the project. If you're a developer, help us advance the code and take a look around our <a href="http://github.com/connoropolous/metamaps_gen002" target="_blank">Github</a>.</p>
 
         <p>Financial contributions are greatly appreciated in support of our work. All financial contributions are transparently governed and recorded in our value accounting system.</p>
-        <script data-gratipay-username="Metamaps.cc" src="//gttp.co/v1.js" style="float:left;display:inline;"></script>
+        <script data-gratipay-username="Metamaps.cc" src="//gttp.co/v1.js"></script>
-                <div style="font-size:16px; width:250px; display:inline; float:right" class="blockchain-btn"
+                <div style="font-size:16px; width:250px" class="blockchain-btn"
      data-address="14GontNS1FKoiTQDEB5WBCUDZaFTiyxkzN"
      data-shared="false">
          <div class="blockchain stage-begin">
         <img src="https://blockchain.info//Resources/buttons/donate_64.png"/>
     </div>
-    <div class="blockchain stage-loading" style="display:inline;float:right;">
+    <div class="blockchain stage-loading">
 
         <img src="https://blockchain.info//Resources/loading-large.gif"/>
     </div>