Tap distance threshold #636

docs TODO
cytoscape · Nov 28, 2014 · f7a0808 · f7a0808
1 parent 839d439
commit f7a0808
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 4 deletions.
diff --git a/src/core.js b/src/core.js
@@ -135,7 +135,8 @@
       textureOnViewport: options.textureOnViewport,
       wheelSensitivity: $$.is.number(options.wheelSensitivity) && options.wheelSensitivity > 0 ? options.wheelSensitivity : 1,
       motionBlur: options.motionBlur,
-      pixelRatio: $$.is.number(options.pixelRatio) && options.pixelRatio > 0 ? options.pixelRatio : (options.pixelRatio === 'auto' ? undefined : 1)
+      pixelRatio: $$.is.number(options.pixelRatio) && options.pixelRatio > 0 ? options.pixelRatio : (options.pixelRatio === 'auto' ? undefined : 1),
+      tapThreshold: $$.is.touch() ? 8 : 4
     }, options.renderer) );
 
     // trigger the passed function for the `initrender` event

diff --git a/src/extensions/renderer.canvas.define-and-init-etc.js b/src/extensions/renderer.canvas.define-and-init-etc.js
@@ -102,6 +102,8 @@
     this.motionBlurEnabled = options.motionBlur === undefined ? true : options.motionBlur; // on by default
     this.forcedPixelRatio = options.pixelRatio;
     this.motionBlur = true; // for initial kick off
+    this.tapThreshold = options.tapThreshold;
+    this.tapThreshold2 = options.tapThreshold * options.tapThreshold;
 
     this.load();
   }

diff --git a/src/extensions/renderer.canvas.load-and-listeners.js b/src/extensions/renderer.canvas.load-and-listeners.js
@@ -415,6 +415,8 @@
       }
 
       var cy = r.data.cy;
+      var zoom = cy.zoom();
+      var pan = cy.pan();
       var pos = r.projectIntoViewport(e.clientX, e.clientY);
       var select = r.data.select;
 
@@ -572,7 +574,14 @@
           r.hoverData.last = near;
         }
 
-        if ( down && down.isNode() && r.nodeIsDraggable(down) ) {
+        var dx = select[2] - select[0];
+        var dx2 = dx * dx;
+        var dy = select[3] - select[1];
+        var dy2 = dy * dy;
+        var dist2 = dx2 + dy2;
+        var rdist2 = dist2 * zoom * zoom;
+
+        if ( down && down.isNode() && r.nodeIsDraggable(down) && (rdist2 > r.tapThreshold2) ){
           if( !r.dragData.didDrag ) {
             r.data.canvasNeedsRedraw[CanvasRenderer.NODE] = true;
           }
@@ -619,7 +628,6 @@
       }
 
       select[2] = pos[0]; select[3] = pos[1];
-
 
       if( preventDefault ){ 
         if(e.stopPropagation) e.stopPropagation();
@@ -1619,6 +1627,7 @@
       r.hoverData.draggingEles = false;
 
       var cy = r.data.cy; 
+      var zoom = cy.zoom();
       var now = r.touchData.now;
       var earlier = r.touchData.earlier;
 
@@ -1823,12 +1832,19 @@
             ;
           }
         }
+
+        var dx = r.touchData.startPosition[0] - now[0];
+        var dx2 = dx * dx;
+        var dy = r.touchData.startPosition[1] - now[1];
+        var dy2 = dy * dy;
+        var dist2 = dx2 + dy2;
+        var rdist2 = dist2 * zoom * zoom;
 
         // Prepare to select the currently touched node, only if it hasn't been dragged past a certain distance
         if (start != null 
             && !r.dragData.didDrag // didn't drag nodes around
             && start._private.selectable 
-            && (Math.sqrt(Math.pow(r.touchData.startPosition[0] - now[0], 2) + Math.pow(r.touchData.startPosition[1] - now[1], 2))) < 6) {
+            && ( rdist2 < r.tapThreshold2 ) {
 
           if( cy.selectionType() === 'single' ){
             cy.$(':selected').not( start ).unselect();