cytoscape-edgehandles - npm Package Compare versions

Comparing version 2.12.2 to 2.13.0

cytoscape-edgehandles.js

@@ -23,3 +23,3 @@ /*!
 
-;( function($$) {
+( function($$) {
   'use strict';
@@ -147,3 +147,3 @@
 
-  var assign = false && Object.assign ? Object.assign.bind( Object ) : function( tgt ){
+  var assign = function( tgt ){
     for( var i = 1; i < arguments.length; i++ ){
@@ -169,2 +169,3 @@ var obj = arguments[i];
 
+    /* eslint-disable no-unused-vars */
     var defaults = {
@@ -222,2 +223,3 @@ preview: true, // whether to show added edges preview before releasing selection
     };
+    /* eslint-enable */
 
@@ -294,3 +296,2 @@ var edgehandles = function( params ) {
         init: function() {
-          var self = this;
           var opts = assign({}, defaults, params );
@@ -300,4 +301,3 @@ var $container = $( this );
           var $canvas = $(canvas);
-          var handle;
-          var line, linePoints;
+          var linePoints;
           var mdownOnHandle = false;
@@ -311,3 +311,2 @@ var grabbingNode = false;
           var ghostNode;
-          var ghostEdge;
           var sourceNode;
@@ -461,3 +460,3 @@ var drawMode = false;
 
-            cy.$( '.edgehandles-ghost' ).remove();
+            cy.$( '.edgehandles-ghost, .edgehandles-preview' ).remove();
             //}, 1);
@@ -551,3 +550,3 @@
 
-                  ghostEdge = cy.add( {
+                  cy.add( {
                     group: 'edges',
@@ -813,3 +812,3 @@ classes: 'edgehandles-ghost edgehandles-ghost-edge',
 
-          cy.ready( function( e ) {
+          cy.ready( function() {
             lastPanningEnabled = cy.panningEnabled();
@@ -831,3 +830,3 @@ lastZoomingEnabled = cy.zoomingEnabled();
             var startHandler, hoverHandler, leaveHandler, grabNodeHandler, freeNodeHandler, dragNodeHandler, forceStartHandler, removeHandler, cxtstartHandler, tapToStartHandler, cxtdragHandler, cxtdragoverHandler, cxtdragoutHandler, cxtendHandler, dragHandler, grabHandler;
-            cy.on( 'mouseover tap', 'node', startHandler = function( e ) {
+            cy.on( 'mouseover tap', 'node', startHandler = function() {
               var node = this;
@@ -847,7 +846,2 @@
 
-              var source = this;
-              var p = node.renderedPosition();
-              var h = node.renderedOuterHeight();
-              var w = node.renderedOuterWidth();
-
               lastActiveId = node.id();
@@ -900,3 +894,3 @@
 
-                function doneMoving( dmEvent ) {
+                function doneMoving() {
                   // console.log('doneMoving %s %o', node.id(), node);
@@ -908,3 +902,2 @@
 
-                  var $this = $( this );
                   mdownOnHandle = false;
@@ -955,5 +948,4 @@ $( window ).off( 'mousemove touchmove', moveHandler );
 
-            } ).on( 'mouseover tapdragover', 'node', hoverHandler = function() {
+            } ).on( 'mouseover tapdragover', 'node', hoverHandler = function(e) {
               var node = this;
-              var target = this;
 
@@ -966,3 +958,4 @@ // console.log('mouseover hoverHandler')
 
-              if( mdownOnHandle ) { // only handle mdown case
+              // n.b. only desktop mouse events can show hover preview in force mode
+              if( mdownOnHandle || (inForceStart && e.type === 'mouseover') ) {
 
@@ -976,3 +969,3 @@ // console.log( 'mouseover hoverHandler %s $o', node.id(), node );
 
-            } ).on( 'mouseout tapdragout', 'node', leaveHandler = function() {
+            } ).on( 'mouseout tapdragout', 'node', leaveHandler = function(e) {
               var node = this;
@@ -984,3 +977,4 @@
 
-              if( mdownOnHandle ) {
+              // n.b. only desktop mouse events can show hover preview in force mode
+              if( mdownOnHandle || (inForceStart && e.type === 'mouseout') ) {
                 hoverOut( node );
@@ -1042,2 +1036,17 @@ }
 
+              var moveHandler = function( me ) {
+                var offset = $container.offset();
+                var x = ( me.pageX !== undefined ? me.pageX : me.touches[ 0 ].pageX ) - offset.left;
+                var y = ( me.pageY !== undefined ? me.pageY : me.touches[ 0 ].pageY ) - offset.top;
+
+                mx = x;
+                my = y;
+
+                if( options().handleLineType !== 'ghost' ) {
+                  clearDraws();
+                  drawHandle();
+                }
+                drawLine( x, y );
+              };
+
               // case: down and drag as normal
@@ -1058,16 +1067,2 @@ var downHandler = function( e ) {
 
-                  var moveHandler = function( me ) {
-                    var x = ( me.pageX !== undefined ? me.pageX : me.touches[ 0 ].pageX ) - $container.offset().left;
-                    var y = ( me.pageY !== undefined ? me.pageY : me.touches[ 0 ].pageY ) - $container.offset().top;
-
-                    mx = x;
-                    my = y;
-
-                    if( options().handleLineType !== 'ghost' ) {
-                      clearDraws();
-                      drawHandle();
-                    }
-                    drawLine( x, y );
-                  }
-
                   $container[ 0 ].addEventListener( 'mousemove', moveHandler, true );
@@ -1088,3 +1083,3 @@ $container[ 0 ].addEventListener( 'touchmove', moveHandler, true );
 
-                    cy.off( 'tap', 'node', tapHandler );
+                    cy.off( 'tap', tapHandler );
                     node.off( 'remove', removeBeforeHandler );
@@ -1107,20 +1102,6 @@ resetToDefaultState();
                 $container[ 0 ].removeEventListener( 'touchstart', downHandler, true );
-                cy.off( 'tap', 'node', tapHandler );
+                cy.off( 'tap', tapHandler );
               } );
 
-              // case: tap a target node
-              var tapHandler;
-              cy.one( 'tap', 'node', tapHandler = function() {
-                var target = this;
-
-                var isLoop = source.id() === target.id();
-                var loopAllowed = options().loopAllowed( target );
-
-                if( !isLoop || ( isLoop && loopAllowed ) ) {
-                  makeEdges( false, source, target );
-
-                  //options().complete( node );
-                  //node.trigger('cyedgehandles.complete');
-                }
-
+              function stopForceMode( node ){
                 inForceStart = false; // now we're done so reset the flag
@@ -1133,7 +1114,35 @@
                 $container[ 0 ].removeEventListener( 'touchstart', downHandler, true );
+                $container[ 0 ].removeEventListener( 'mousemove', moveHandler, true );
                 node.off( 'remove', removeBeforeHandler );
+
                 resetToDefaultState();
+              }
+
+              // case: tap a target node
+              var tapHandler;
+              cy.one( 'tap', tapHandler = function(e) {
+                var target = e.target || e.cyTarget; // 3.x | 2.x
+
+                if( target === cy ){ // tap bg cancels force gesture
+                  stopForceMode( node );
+
+                  return;
+                } else if( target.isNode() ){ // tap node completes force gesture
+                  var isLoop = source.id() === target.id();
+                  var loopAllowed = options().loopAllowed( target );
+
+                  if( !isLoop || ( isLoop && loopAllowed ) ) {
+                    makeEdges( false, source, target );
+                  }
+
+                  stopForceMode( node );
+                }
               } );
 
+              // in the forced start, we use the above tap case but we can still preview on desktop mousemove
+              if( inForceStart ){
+                $container[ 0 ].addEventListener( 'mousemove', moveHandler, true );
+              }
 
+
             } ).on( 'remove', 'node', removeHandler = function() {
@@ -1152,2 +1161,6 @@ var id = this.id();
 
+              if( disabled() ) {
+                return; // prevent drawing an edge whenever the extension is disabled
+              }
+
               if( node.filter( options().handleNodes ).length === 0 ) {
@@ -1166,4 +1179,3 @@ return; // skip if node not allowed
 
-                var node = sourceNode = this;
-                var source = node;
+                node = sourceNode = this;
 
@@ -1239,21 +1251,21 @@ lastActiveId = node.id();
             } ).on( 'tap', 'node', tapToStartHandler = function() {
-              return;
-              var node = this;
+              // TODO can this be re-enabled and exposed behind an option?
+              // var node = this;
+              //
+              // if( !sourceNode ) { // must not be active
+              //   setTimeout( function() {
+              //     if( node.filter( options().handleNodes ).length === 0 ) {
+              //       return; // skip if node not allowed
+              //     }
+              //
+              //     clearDraws(); // clear just in case
+              //
+              //     setHandleDimensions( node );
+              //
+              //     drawHandle();
+              //
+              //     node.trigger( 'cyedgehandles.showhandle' );
+              //   }, 16 );
+              // }
 
-              if( !sourceNode ) { // must not be active
-                setTimeout( function() {
-                  if( node.filter( options().handleNodes ).length === 0 ) {
-                    return; // skip if node not allowed
-                  }
-
-                  clearDraws(); // clear just in case
-
-                  setHandleDimensions( node );
-
-                  drawHandle();
-
-                  node.trigger( 'cyedgehandles.showhandle' );
-                }, 16 );
-              }
-
             } );
@@ -1277,3 +1289,6 @@
                 .off( 'cxtdragout', 'node', cxtdragoutHandler )
-                .off( 'tap', 'node', tapToStartHandler );
+                .off( 'tap', 'node', tapToStartHandler )
+                .off( 'drag', 'node', dragHandler )
+                .off( 'grab', 'node', grabHandler )
+              ;
 
@@ -1295,5 +1310,3 @@ cy.unbind( 'zoom pan', transformHandler );
         start: function( id ) {
-          var $container = $( this );
-
-          cy.ready( function( e ) {
+          cy.ready( function() {
             cy.$( '#' + id ).trigger( 'cyedgehandles.forcestart' );
@@ -1309,3 +1322,3 @@ } );
       } else {
-        console.error( 'No such function `' + fn + '` for edgehandles' );
+        throw new Error( 'No such function `' + fn + '` for edgehandles' );
       }
@@ -1318,6 +1331,8 @@ };
 
+  /* global _, define, cytoscape */
+
   if( typeof module !== 'undefined' && module.exports ) { // expose as a commonjs module
     module.exports = function( $$ ){
       register( $$, require('lodash.debounce'), require('lodash.throttle') );
-    }
+    };
   } else if( typeof define !== 'undefined' && define.amd ) { // expose as an amd/requirejs module
@@ -1324,0 +1339,0 @@ define( 'cytoscape-edgehandles', function() {

gulpfile.js

@@ -12,2 +12,3 @@ var gulp = require('gulp');
 var prompt = require('gulp-prompt');
+var eslint = require('gulp-eslint');
 var version;
@@ -81,18 +82,7 @@
   return gulp.src( 'cytoscape-*.js' )
-    .pipe( jshint({
-      funcscope: true,
-      laxbreak: true,
-      loopfunc: true,
-      strict: true,
-      unused: 'vars',
-      eqnull: true,
-      sub: true,
-      shadow: true,
-      laxcomma: true
-    }) )
+    .pipe( eslint() )
+    .pipe( eslint.format() )
+    //.pipe( eslint.failAfterError() )
 
-    .pipe( jshint.reporter(jshStylish) )
-
-    //.pipe( jshint.reporter('fail') )
   ;
-});
+});

package.json

 {
   "name": "cytoscape-edgehandles",
-  "version": "2.12.2",
+  "version": "2.13.0",
   "description": "Edge creation extension for Cytoscape.js",
@@ -24,3 +24,3 @@ "main": "cytoscape-edgehandles.js",
     "gulp": "^3.8.8",
-    "gulp-jshint": "^1.8.5",
+    "gulp-eslint": "^3.0.1",
     "gulp-prompt": "^0.1.1",
@@ -27,0 +27,0 @@ "gulp-replace": "^0.4.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

90095

increased by1.52%

Number of package files

11

increased by22.22%

Lines of code

1108

increased by1.93%

No dependency changes