cytoscape - npm Package Compare versions

Comparing version 2.2.1 to 2.2.2

bower.json

 {
   "name": "cytoscape",
-  "version": "2.2.1",
+  "version": "2.2.2",
   "main": "dist/cytoscape.js",
@@ -5,0 +5,0 @@ "ignore": [

documentation/js/script.js

@@ -28,3 +28,3 @@ $(function(){
 
-  $('#cy-refresh').on('mousedown touchstart', function(){
+  $('#cy-refresh').on('click', function(){
     loadCy();
@@ -35,3 +35,3 @@
 
-  $('#cy-hide').on('mousedown touchstart', function(){
+  $('#cy-hide').on('click', function(){
     $('#cy, #cy-hide, #cy-refresh').hide();
@@ -41,3 +41,3 @@ $('#cy-show').show();
 
-  $('#cy-show').on('mousedown touchstart', function(){
+  $('#cy-show').on('click', function(){
     $('#cy, #cy-hide, #cy-refresh').show();
@@ -48,3 +48,3 @@ $('#cy-show').hide();
 
-  $('#demo-source .expander').on('mousedown touchstart', function(){
+  $('#demo-source .expander').on('click', function(){
     $('#demo-source').removeClass('collapsed');
@@ -109,3 +109,3 @@ });
 
-  $('#download-button').on('mousedown touchstart', function(){
+  $('#download-button').on('click', function(){
     if( _gaq ){
@@ -112,0 +112,0 @@ _gaq.push(['_trackEvent', 'Actions', 'Download']);

documentation/md/architecture.md

@@ -7,2 +7,2 @@ Cytoscape.js uses an event-driven model with a core API.  The core has several extensions, each of which is notified of events by the core, as needed.  Extensions modify the elements in the graph and notify the core of any changes.
 
-![The architecture of Cytoscape.js](https://raw.github.com/cytoscape/cytoscape.js/master/ref/arch.png)
+![The architecture of Cytoscape.js](ref/arch.png)

documentation/md/intro.md

 ## About
 
-Cytoscape.js is an open-source [graph](http://en.wikipedia.org/wiki/Graph_theory)  library written in JavaScript.  You can use Cytoscape.js for graph analysis and visualisation.
+Cytoscape.js is an open-source [graph theory](http://en.wikipedia.org/wiki/Graph_theory) library written in JavaScript.  You can use Cytoscape.js for graph analysis and visualisation.
 
-Cytoscape.js allows you to easily display graphs in your websites.  Because Cytoscape.js allows the user to interact with the graph and the library allows the client to hook into user events, Cytoscape.js is easily integrated into your webapp, especially since Cytoscape.js supports both desktop browsers, like Chrome, and mobile browsers, like on the iPad.
+Cytoscape.js allows you to easily display and manipulate rich, interactive graphs.  Because Cytoscape.js allows the user to interact with the graph and the library allows the client to hook into user events, Cytoscape.js is easily integrated into your webapp, especially since Cytoscape.js supports both desktop browsers, like Chrome, and mobile browsers, like on the iPad.  Cytoscape.js includes all the gestures you would expect out-of-the-box, including pinch-to-zoom, box selection, panning, et cetera.
 
 Cytoscape.js also has graph analysis in mind:  The library contains a slew of useful functions in graph theory.  You can use Cytoscape.js headlessly on Node.js to do graph analysis in the terminal or on a web server.
 
+Cytoscape.js is an open-source project, and anyone is free to contribute.  For more information, refer to the [GitHub README](https://github.com/cytoscape/cytoscape.js).
+
 The library was developed at the [Donnelly Centre](http://thedonnellycentre.utoronto.ca) at the [University of Toronto](http://www.utoronto.ca/).  It is the successor of [Cytoscape Web](http://cytoscapeweb.cytoscape.org/).
@@ -10,0 +12,0 @@

documentation/md/performance.md

@@ -20,2 +20,3 @@ ## Background
  * When using transition animations in the style, make sure `transition-property` is defined only for states that you want to animate.  If you have `transition-property` defined in a default state, the animation will try to run more often than if you limit it to particular states you actually want to animate.
+* **Edge selection** : If your app does not need edge selection, you can get performance gains by unselectifying edges (i.e. `edges.unselectify()`).  This disables selection for edges, so their style will not have to be recalculated during box selection et cetera.
 * **Labels** : Drawing labels is expensive.
@@ -25,2 +26,3 @@ * If you can go without them or show them on tap/mouseover, you'll get better performance.
  * Consider setting `min-zoomed-font-size` in your style so that when labels are small — and hard to read anyway — they are not rendered.  When the labels are at least the size you set (i.e. the user zooms in), they will be visible.
+* **Simplify edge style** : Use solid edges.  Dotted and dashed edges are much more expensive to draw, so you will get increased performance by not using them.
 * **Simplify node style** : Keep your node styles simple to improve performance.  
@@ -27,0 +29,0 @@ * Background images are very expensive, so you should remove them if you need high performance.

gulpfile.js

@@ -13,2 +13,4 @@ var gulp = require('gulp');
 var fs = require('fs');
+var htmlmin = require('gulp-htmlmin');
+var cssmin = require('gulp-cssmin');
 
@@ -41,3 +43,19 @@ var now = new Date();
     'src/extensions/*.js'
-  ]
+  ],
+
+  docs: {
+    js: [
+      'documentation/js/fastclick.js',
+      'documentation/js/jquery.js',
+      'documentation/js/cytoscape.js',
+      'documentation/js/load.js',
+      'documentation/js/script.js'
+    ],
+
+    css: [
+      'documentation/css/reset.css',
+      'documentation/css/font-awesome.css',
+      'documentation/css/style.css'
+    ]
+  }
 };
@@ -183,6 +201,68 @@
 
-gulp.task('docspub', ['docsver', 'docs', 'docsjs', 'docsdl'], function(){
+gulp.task('docsmin', ['docshtmlmin'], function(next){
+  next();
+});
 
+gulp.task('docsclean', function(next){
+  return gulp.src(['documentation/js/all.min.js', 'documentation/css/all.min.css', 'documentation/index.html'])
+    .pipe( clean({ read: false }) )
+  ;
 });
 
+gulp.task('docshtmlmin', ['docsminrefs'], function(){
+  return gulp.src('documentation/index.html')
+    .pipe( htmlmin({ collapseWhitespace: true }) )
+
+    .pipe( gulp.dest('documentation') )
+  ;
+});
+
+gulp.task('docsjsmin', ['docs'], function(){
+  return gulp.src( paths.docs.js )
+    .pipe( concat('all.min.js') )
+    
+    .pipe( uglify({
+      mangle: true
+    }) )
+
+    .pipe( gulp.dest('documentation/js') )
+  ;
+});
+
+gulp.task('docscssmin', ['docs'], function(){ 
+  return gulp.src( paths.docs.css )
+    .pipe( concat('all.min.css') )
+
+    .pipe( cssmin() )
+
+    .pipe( gulp.dest('documentation/css') )
+  ;
+});
+
+gulp.task('docsminrefs', ['docscssmin', 'docsjsmin'], function(){
+  return gulp.src('documentation/index.html')
+    .pipe( inject( gulp.src([ 'documentation/js/all.min.js', 'documentation/css/all.min.css' ], { read: false }), {
+      addRootSlash: false,
+      ignorePath: 'documentation'
+    } ) )
+
+    .pipe( gulp.dest('documentation') )
+  ;
+});
+
+gulp.task('docsrefs', function(){
+  return gulp.src([ 'documentation/index.html', 'documentation/template.html' ])
+    .pipe( inject( gulp.src(paths.docs.js.concat( paths.docs.css ), { read: false }), {
+      addRootSlash: false,
+      ignorePath: 'documentation'
+    } ) )
+
+    .pipe( gulp.dest('documentation') )
+  ;
+});
+
+gulp.task('docspub', ['docsver', 'docsjs', 'docsdl'], function(){
+  return gulp.start('docsmin');
+});
+
 gulp.task('pkgver', function(){
@@ -189,0 +269,0 @@ return gulp.src([

package.json

 {
   "name": "cytoscape",
   "description": "A JavaScript graph library for analysis and visualisation",
-  "version": "2.2.1",
+  "version": "2.2.2",
   "license": "LGPL",
@@ -64,4 +64,6 @@ "engines": {
     "gulp-zip": "~0.1.2",
-    "marked": "~0.3.1"
+    "marked": "~0.3.1",
+    "gulp-htmlmin": "~0.1.2",
+    "gulp-cssmin": "~0.1.4"
   }
 }

README.md

@@ -61,2 +61,3 @@ # cytoscape.js
  * `docs` : build the documentation template
+ * `docsmin` : build the documentation template with all resources minified
  * `docspub` : build the documentation for publishing (ZIPs, JS refs, etc.)
@@ -63,0 +64,0 @@ * `dist` : update the distribution JS for npm, bower, etc.

src/collection-compounds.js

@@ -92,4 +92,4 @@ ;(function($$){ 'use strict';
   // aliases
-  $$.fn.eles.ancestors = $$.fn.eles.parents;
+  $$.elesfn.ancestors = $$.elesfn.parents;
   
 })( cytoscape );

src/collection-style.js

@@ -128,8 +128,10 @@ ;(function($$){ 'use strict';
       var ele = this[0];
+      var cy = this.cy();
 
       if( ele ){
+        var style = ele._private.style;
+
         if(
-          ele.css('visibility') !== 'visible'
-        ||  ele.css('display') !== 'element'
-        // ||  parseFloat( ele.css('opacity') ) === 0
+          style['visibility'].value !== 'visible'
+          || style['display'].value !== 'element'
         ){
@@ -140,11 +142,14 @@ return false;
         if( ele.isNode() ){
-          var parents = ele.parents();
-          for( var i = 0; i < parents.length; i++ ){
-            var parent = parents[i];
-            var pVis = parent.css('visibility');
-            var pDis = parent.css('display');
-            var pOpac = parseFloat( parent.css('opacity') );
+          var parents = ele._private.data.parent ? ele.parents() : null;
 
-            if( pVis !== 'visible' || pDis !== 'element' ){
-              return false;
+          if( parents ){
+            for( var i = 0; i < parents.length; i++ ){
+              var parent = parents[i];
+              var pStyle = parent._private.style;
+              var pVis = pStyle['visibility'].value;
+              var pDis = pStyle['display'].value;
+
+              if( pVis !== 'visible' || pDis !== 'element' ){
+                return false;
+              }
             }
@@ -155,4 +160,4 @@ }
         } else if( ele.isEdge() ){
-          var src = ele.source();
-          var tgt = ele.target();
+          var src = cy.getElementById( ele._private.data.source );
+          var tgt = cy.getElementById( ele._private.data.target );
 
@@ -178,9 +183,11 @@ return src.visible() && tgt.visible();
         var parentOpacity = ele._private.style.opacity.value;
-        var parents = ele.parents();
+        var parents = !ele._private.data.parent ? null : ele.parents();
         
-        for( var i = 0; i < parents.length; i++ ){
-          var parent = parents[i];
-          var opacity = parent._private.style.opacity.value;
+        if( parents ){
+          for( var i = 0; i < parents.length; i++ ){
+            var parent = parents[i];
+            var opacity = parent._private.style.opacity.value;
 
-          parentOpacity = opacity * parentOpacity;
+            parentOpacity = opacity * parentOpacity;
+          }
         }
@@ -187,0 +194,0 @@

src/collection.js

@@ -159,3 +159,2 @@ ;(function($$){ 'use strict';
     var ids = {};
-    var uniqueElements = [];
     var createdElements = false;
@@ -196,2 +195,4 @@
     
+    this.length = 0;
+
     for( var i = 0, l = elements.length; i < l; i++ ){
@@ -205,11 +206,8 @@ var element = elements[i];
         ids[ id ] = element;
-        uniqueElements.push( element );
+
+        this[ this.length ] = element;
+        this.length++;
       }
     }
     
-    for(var i = 0, l = uniqueElements.length; i < l; i++){
-      this[i] = uniqueElements[i];
-    }
-    this.length = uniqueElements.length;
-    
     this._private = {
@@ -216,0 +214,0 @@ cy: cy,

src/core-renderer.js

@@ -23,2 +23,10 @@ ;(function($$){ 'use strict';
     },
+
+    resize: function(){
+      this.notify({
+        type: 'resize'
+      });
+
+      return this;
+    },
     
@@ -40,4 +48,3 @@ initRenderer: function( options ){
       );
-      
-      
+       
     },
@@ -44,0 +51,0 @@

src/extensions/renderer.canvas.coord-ele-math.js

@@ -78,21 +78,27 @@ ;(function($$){ 'use strict';
     for (var i = 0; i < nodes.length; i++) {
-      if (CanvasRenderer.nodeShapes[this.getNodeShape(nodes[i])].checkPointRough(x, y,
-          nodes[i]._private.style['border-width'].pxValue / 2,
-          this.getNodeWidth(nodes[i]) + nodeThreshold, this.getNodeHeight(nodes[i]) + nodeThreshold,
-          nodes[i]._private.position.x, nodes[i]._private.position.y)
-        &&
-        CanvasRenderer.nodeShapes[this.getNodeShape(nodes[i])].checkPoint(x, y,
-          nodes[i]._private.style['border-width'].pxValue / 2,
-          (this.getNodeWidth(nodes[i]) + nodeThreshold), (this.getNodeHeight(nodes[i]) + nodeThreshold),
-          nodes[i]._private.position.x, nodes[i]._private.position.y)) {
+      var node = nodes[i];
+      var shape = CanvasRenderer.nodeShapes[ this.getNodeShape(node) ];
+      var borderWO = node._private.style['border-width'].pxValue / 2;
+      var width = this.getNodeWidth( node );
+      var height = this.getNodeHeight( node );
+      var pos = node._private.position;
+      var style = node._private.style;
+
+      if(
+        shape.checkPointRough(x, y, borderWO, width + nodeThreshold, height + nodeThreshold, pos.x, pos.y)
+          &&
+        shape.checkPoint(x, y, borderWO, width + nodeThreshold, height + nodeThreshold, pos.x, pos.y)
+      ){
         
         if (visibleElementsOnly) {
-          if (nodes[i]._private.style['opacity'].value != 0
-            && nodes[i]._private.style['visibility'].value == 'visible'
-            && nodes[i]._private.style['display'].value == 'element') {
+          if(
+            style['opacity'].value !== 0 &&
+            style['visibility'].value === 'visible' &&
+            style['display'].value === 'element'
+          ){
             
-            near.push(nodes[i]);  
+            near.push( node );  
           }
         } else {
-          near.push(nodes[i]);
+          near.push( node );
         }
@@ -103,52 +109,41 @@ }
     // Check edges
-    var addCurrentEdge;
-    for (var i = 0; i < edges.length; i++) {
+    for( var i = 0; i < edges.length; i++ ){
       var edge = edges[i];
       var rs = edge._private.rscratch;
+      var style = edge._private.style;
+      var width = style['width'].pxValue;
+      var widthSq = width * width;
+      var width2 = width * 2;
+      var visible = edge.visible() && !edge.transparent();
+      var src = data.cy.getElementById(edge._private.data.source);
+      var tgt = data.cy.getElementById(edge._private.data.target);
+      var srcStyle = src._private.style;
+      var tgtStyle = tgt._private.style;
 
-      addCurrentEdge = false;
+      // exit early if invisible edge and must be visible
+      if( visibleElementsOnly && !visible ){
+        continue;
+      }
 
-      if (rs.edgeType == 'self') {
-        if (($$.math.inBezierVicinity(x, y,
-            rs.startX,
-            rs.startY,
-            rs.cp2ax,
-            rs.cp2ay,
-            rs.selfEdgeMidX,
-            rs.selfEdgeMidY,
-            Math.pow(edge._private.style['width'].pxValue/2, 2))
-              &&
-          (Math.pow(edges[i]._private.style['width'].pxValue/2, 2) + edgeThreshold > 
-            $$.math.sqDistanceToQuadraticBezier(x, y,
-              rs.startX,
-              rs.startY,
-              rs.cp2ax,
-              rs.cp2ay,
-              rs.selfEdgeMidX,
-              rs.selfEdgeMidY)))
-          ||
-          ($$.math.inBezierVicinity(x, y,
-            rs.selfEdgeMidX,
-            rs.selfEdgeMidY,
-            rs.cp2cx,
-            rs.cp2cy,
-            rs.endX,
-            rs.endY,
-            Math.pow(edges[i]._private.style['width'].pxValue/2, 2))
-              &&
-          (Math.pow(edges[i]._private.style['width'].pxValue/2, 2) + edgeThreshold > 
-            $$.math.sqDistanceToQuadraticBezier(x, y,
-              rs.selfEdgeMidX,
-              rs.selfEdgeMidY,
-              rs.cp2cx,
-              rs.cp2cy,
-              rs.endX,
-              rs.endY))))
-           { addCurrentEdge = true; }
+      if (rs.edgeType === 'self') {
+        if(
+            (
+              $$.math.inBezierVicinity(x, y, rs.startX, rs.startY, rs.cp2ax, rs.cp2ay, rs.selfEdgeMidX, rs.selfEdgeMidY, widthSq)
+                &&
+              ( widthSq + edgeThreshold > $$.math.sqDistanceToQuadraticBezier(x, y, rs.startX, rs.startY, rs.cp2ax, rs.cp2ay, rs.selfEdgeMidX, rs.selfEdgeMidY) )
+            )
+              ||
+            (
+              $$.math.inBezierVicinity(x, y, rs.selfEdgeMidX, rs.selfEdgeMidY, rs.cp2cx, rs.cp2cy, rs.endX, rs.endY,widthSq)
+                &&
+              ( widthSq + edgeThreshold > $$.math.sqDistanceToQuadraticBezier(x, y, rs.selfEdgeMidX, rs.selfEdgeMidY, rs.cp2cx, rs.cp2cy, rs.endX, rs.endY) )
+            )
+        ){
+          near.push( edge );
+          continue;
+        }
       
       } else if (rs.edgeType == 'haystack') {
-        var tgt = edges[i].target()[0];
-        var tgtPos = tgt.position();
-        var src = edges[i].source()[0];
-        var srcPos = src.position();
+        var tgtPos = tgt._private.position;
+        var srcPos = src._private.position;
 
@@ -159,99 +154,68 @@ var startX = srcPos.x + rs.source.x;
         var endY = tgtPos.y + rs.target.y;
-        if ($$.math.inLineVicinity(x, y, startX, startY, endX, endY, edges[i]._private.style['width'].pxValue * 2)
+
+        if( 
+          $$.math.inLineVicinity(x, y, startX, startY, endX, endY, width2)
             &&
-          Math.pow(edges[i]._private.style['width'].pxValue / 2, 2) + edgeThreshold >
-          $$.math.sqDistanceToFiniteLine(x, y,
-            startX,
-            startY,
-            endX,
-            endY))
-          { addCurrentEdge = true; }
+          widthSq + edgeThreshold > $$.math.sqDistanceToFiniteLine(x, y, startX, startY, endX, endY)
+        ){
+          near.push( edge );
+          continue;
+        }
       
-      } else if (rs.edgeType == 'straight') {
-        if ($$.math.inLineVicinity(x, y, rs.startX, rs.startY, rs.endX, rs.endY, edges[i]._private.style['width'].pxValue * 2)
+      } else if (rs.edgeType === 'straight') {
+        if(
+          $$.math.inLineVicinity(x, y, rs.startX, rs.startY, rs.endX, rs.endY, width2)
             &&
-          Math.pow(edges[i]._private.style['width'].pxValue / 2, 2) + edgeThreshold >
-          $$.math.sqDistanceToFiniteLine(x, y,
-            rs.startX,
-            rs.startY,
-            rs.endX,
-            rs.endY))
-          { addCurrentEdge = true; }
+          widthSq + edgeThreshold > $$.math.sqDistanceToFiniteLine(x, y, rs.startX, rs.startY, rs.endX, rs.endY)
+        ){
+          near.push( edge );
+          continue;
+        }
       
-      } else if (rs.edgeType == 'bezier') {
-        if ($$.math.inBezierVicinity(x, y,
-          rs.startX,
-          rs.startY,
-          rs.cp2x,
-          rs.cp2y,
-          rs.endX,
-          rs.endY,
-          Math.pow(edges[i]._private.style['width'].pxValue / 2, 2))
+      } else if (rs.edgeType === 'bezier') {
+        if(
+          $$.math.inBezierVicinity(x, y, rs.startX, rs.startY, rs.cp2x, rs.cp2y, rs.endX, rs.endY, widthSq)
             &&
-          (Math.pow(edges[i]._private.style['width'].pxValue / 2 , 2) + edgeThreshold >
-            $$.math.sqDistanceToQuadraticBezier(x, y,
-              rs.startX,
-              rs.startY,
-              rs.cp2x,
-              rs.cp2y,
-              rs.endX,
-              rs.endY)))
-          { addCurrentEdge = true; }
+          (widthSq + edgeThreshold > $$.math.sqDistanceToQuadraticBezier(x, y, rs.startX, rs.startY, rs.cp2x, rs.cp2y, rs.endX, rs.endY))
+        ){
+          near.push( edge );
+          continue;
+        }
       }
       
-      if (!near.length || near[near.length - 1] != edges[i]) {
-        if ((CanvasRenderer.arrowShapes[edges[i]._private.style['source-arrow-shape'].value].roughCollide(x, y,
-            edges[i]._private.rscratch.arrowStartX, edges[i]._private.rscratch.arrowStartY,
-            this.getArrowWidth(edges[i]._private.style['width'].pxValue),
-            this.getArrowHeight(edges[i]._private.style['width'].pxValue),
-            [edges[i]._private.rscratch.arrowStartX - edges[i].source()[0]._private.position.x,
-              edges[i]._private.rscratch.arrowStartY - edges[i].source()[0]._private.position.y], 0)
-            &&
-          CanvasRenderer.arrowShapes[edges[i]._private.style['source-arrow-shape'].value].collide(x, y,
-            edges[i]._private.rscratch.arrowStartX, edges[i]._private.rscratch.arrowStartY,
-            this.getArrowWidth(edges[i]._private.style['width'].pxValue),
-            this.getArrowHeight(edges[i]._private.style['width'].pxValue),
-            [edges[i]._private.rscratch.arrowStartX - edges[i].source()[0]._private.position.x,
-              edges[i]._private.rscratch.arrowStartY - edges[i].source()[0]._private.position.y], 0))
-          ||
-          (CanvasRenderer.arrowShapes[edges[i]._private.style['target-arrow-shape'].value].roughCollide(x, y,
-            edges[i]._private.rscratch.arrowEndX, edges[i]._private.rscratch.arrowEndY,
-            this.getArrowWidth(edges[i]._private.style['width'].pxValue),
-            this.getArrowHeight(edges[i]._private.style['width'].pxValue),
-            [edges[i]._private.rscratch.arrowEndX - edges[i].target()[0]._private.position.x,
-              edges[i]._private.rscratch.arrowEndY - edges[i].target()[0]._private.position.y], 0)
-            &&
-          CanvasRenderer.arrowShapes[edges[i]._private.style['target-arrow-shape'].value].collide(x, y,
-            edges[i]._private.rscratch.arrowEndX, edges[i]._private.rscratch.arrowEndY,
-            this.getArrowWidth(edges[i]._private.style['width'].pxValue),
-            this.getArrowHeight(edges[i]._private.style['width'].pxValue),
-            [edges[i]._private.rscratch.arrowEndX - edges[i].target()[0]._private.position.x,
-              edges[i]._private.rscratch.arrowEndY - edges[i].target()[0]._private.position.y], 0)))
-          { addCurrentEdge = true; }
+      if( near.length === 0 || near[near.length - 1] !== edge ){
+        var srcShape = CanvasRenderer.arrowShapes[ style['source-arrow-shape'].value ];
+        var tgtShape = CanvasRenderer.arrowShapes[ style['target-arrow-shape'].value ];
+
+        var src = src || data.cy.getElementById(edge._private.data.source);
+        var tgt = tgt || data.cy.getElementById(edge._private.data.target);
+
+        var tgtPos = tgt._private.position;
+        var srcPos = src._private.position;
+
+        var srcArW = this.getArrowWidth( style['width'].pxValue );
+        var srcArH = this.getArrowHeight( style['width'].pxValue );
+
+        var tgtArW = srcArW;
+        var tgtArH = srcArH;
+
+        if(
+          (
+            srcShape.roughCollide(x, y, rs.arrowStartX, rs.arrowStartY, srcArW, srcArH, [rs.arrowStartX - srcPos.x, rs.arrowStartY - srcPos.y], 0)
+              &&
+            srcShape.collide(x, y, rs.arrowStartX, rs.arrowStartY, srcArW, srcArH, [rs.arrowStartX - srcPos.x, rs.arrowStartY - srcPos.y], 0)
+          )
+            ||
+          (
+            tgtShape.roughCollide(x, y, rs.arrowEndX, rs.arrowEndY, tgtArW, tgtArH, [rs.arrowEndX - tgtPos.x, rs.arrowEndY - tgtPos.y], 0)
+              &&
+            tgtShape.collide(x, y, rs.arrowEndX, rs.arrowEndY, tgtArW, tgtArH, [rs.arrowEndX - tgtPos.x, rs.arrowEndY - tgtPos.y], 0)
+          )
+        ){
+          near.push( edge );
+          continue;
+        }
+
       }
       
-      if (addCurrentEdge) {
-        if (visibleElementsOnly) {
-          // For edges, make sure the edge is visible/has nonzero opacity,
-          // then also make sure both source and target nodes are visible/have
-          // nonzero opacity
-          var source = data.cy.getElementById(edges[i]._private.data.source)
-          var target = data.cy.getElementById(edges[i]._private.data.target)
-          
-          if (edges[i]._private.style['opacity'].value != 0
-            && edges[i]._private.style['visibility'].value == 'visible'
-            && edges[i]._private.style['display'].value == 'element'
-            && source._private.style['opacity'].value != 0
-            && source._private.style['visibility'].value == 'visible'
-            && source._private.style['display'].value == 'element'
-            && target._private.style['opacity'].value != 0
-            && target._private.style['visibility'].value == 'visible'
-            && target._private.style['display'].value == 'element') {
-            
-            near.push(edges[i]);  
-          }
-        } else {
-          near.push(edges[i]);
-        }
-      }
     } 
@@ -662,3 +626,3 @@
     var rscratch = ele._private.rscratch;
-    var cacheKey = [fStyle, size, family, variant, weight].join('$$$');
+    var cacheKey = [fStyle, size, family, variant, weight, text].join('$$$');
     var cache = rscratch.labelDimCache || (rscratch.labelDimCache = {});
@@ -665,0 +629,0 @@

src/extensions/renderer.canvas.define-and-init-etc.js

@@ -121,2 +121,5 @@ /*
 
+    if( params.type === 'load' || params.type === 'resize' ){
+      this.matchCanvasSize(this.data.container);
+    }
     
@@ -123,0 +126,0 @@ this.data.canvasNeedsRedraw[CanvasRenderer.DRAG] = true;

src/extensions/renderer.canvas.drawing-edges.js

@@ -19,27 +19,20 @@ ;(function($$){ 'use strict';
 
-    var startNode, endNode, source, target;
-
-    source = startNode = edge.source()[0];
-    target = endNode = edge.target()[0];
-
-    var targetPos = target.position();
-    var sourcePos = source.position();
+    var style = edge._private.style;
     
-    if ( 
-         edge._private.style['visibility'].value != 'visible'
-      || edge._private.style['display'].value != 'element'
-      || startNode._private.style['visibility'].value != 'visible'
-      || startNode._private.style['display'].value != 'element'
-      || endNode._private.style['visibility'].value != 'visible'
-      || endNode._private.style['display'].value != 'element'
-    ){
+    // Edge line width
+    if (style['width'].pxValue <= 0) {
       return;
     }
-    
-    var overlayPadding = edge._private.style['overlay-padding'].pxValue;
-    var overlayOpacity = edge._private.style['overlay-opacity'].value;
-    var overlayColor = edge._private.style['overlay-color'].value;
 
+    var overlayPadding = style['overlay-padding'].pxValue;
+    var overlayOpacity = style['overlay-opacity'].value;
+    var overlayColor = style['overlay-color'].value;
+
     // Edge color & opacity
     if( drawOverlayInstead ){
+
+      if( overlayOpacity === 0 ){ // exit early if no overlay
+        return;
+      }
+
       context.strokeStyle = "rgba( " + overlayColor[0] + ", " + overlayColor[1] + ", " + overlayColor[2] + ", " + overlayOpacity + " )";
@@ -54,6 +47,6 @@ context.lineCap = 'round';
       context.strokeStyle = "rgba(" 
-        + edge._private.style['line-color'].value[0] + ","
-        + edge._private.style['line-color'].value[1] + ","
-        + edge._private.style['line-color'].value[2] + ","
-        + edge._private.style.opacity.value + ")";
+        + style['line-color'].value[0] + ","
+        + style['line-color'].value[1] + ","
+        + style['line-color'].value[2] + ","
+        + style.opacity.value + ")";
 
@@ -63,15 +56,20 @@
     }
+    
+    var cy = edge._private.cy;
+    var startNode, endNode, source, target;
+    source = startNode = cy.getElementById( edge._private.data.source );
+    target = endNode = cy.getElementById( edge._private.data.target );
 
-    // Edge line width
-    if (edge._private.style['width'].pxValue <= 0) {
-      return;
-    }
-    
-    var edgeWidth = edge._private.style['width'].pxValue + (drawOverlayInstead ? 2 * overlayPadding : 0);
-    var lineStyle = drawOverlayInstead ? 'solid' : edge._private.style['line-style'].value;
+    var targetPos = target.position();
+    var sourcePos = source.position();
+
+    var edgeWidth = style['width'].pxValue + (drawOverlayInstead ? 2 * overlayPadding : 0);
+    var lineStyle = drawOverlayInstead ? 'solid' : style['line-style'].value;
     context.lineWidth = edgeWidth;
     
-    this.findEndpoints(edge);
+    if( rs.edgeType !== 'haystack' ){
+      this.findEndpoints(edge);
+    }
     
-    if( rs.edgeType == 'haystack' ){
+    if( rs.edgeType === 'haystack' ){
       this.drawStyledEdge(
@@ -84,3 +82,3 @@ edge,
       );
-    } else if (rs.edgeType == 'self') {
+    } else if (rs.edgeType === 'self') {
           
@@ -107,3 +105,3 @@ var details = edge._private.rscratch;
       
-    } else if (rs.edgeType == 'straight') {
+    } else if (rs.edgeType === 'straight') {
       
@@ -113,4 +111,4 @@ var nodeDirectionX = endNode._private.position.x - startNode._private.position.x;
       
-      var edgeDirectionX = edge._private.rscratch.endX - edge._private.rscratch.startX;
-      var edgeDirectionY = edge._private.rscratch.endY - edge._private.rscratch.startY;
+      var edgeDirectionX = rs.endX - rs.startX;
+      var edgeDirectionY = rs.endY - rs.startY;
       
@@ -120,6 +118,6 @@ if (nodeDirectionX * edgeDirectionX
         
-        edge._private.rscratch.straightEdgeTooShort = true;  
+        rs.straightEdgeTooShort = true;  
       } else {
         
-        var details = edge._private.rscratch;
+        var details = rs;
         this.drawStyledEdge(edge, context, [details.startX, details.startY,
@@ -130,7 +128,7 @@ details.endX, details.endY],
         
-        edge._private.rscratch.straightEdgeTooShort = false;  
+        rs.straightEdgeTooShort = false;  
       }  
     } else {
       
-      var details = edge._private.rscratch;
+      var details = rs;
 
@@ -161,4 +159,3 @@ // context.fillStyle = 'rgba(255, 0, 0, 1)';
     
-    if (edge._private.rscratch.noArrowPlacement !== true
-        && edge._private.rscratch.startX !== undefined) {
+    if ( rs.edgeType !== 'haystack' && rs.noArrowPlacement !== true && rs.startX !== undefined ){
       this.drawArrowheads(context, edge, drawOverlayInstead);
@@ -165,0 +162,0 @@ }

src/extensions/renderer.canvas.drawing-nodes.js

@@ -15,2 +15,10 @@ ;(function($$){ 'use strict';
 
+    var overlayPadding = style['overlay-padding'].pxValue;
+    var overlayOpacity = style['overlay-opacity'].value;
+    var overlayColor = style['overlay-color'].value;
+
+    if( drawOverlayInstead && overlayOpacity === 0 ){ // exit early if drawing overlay but none to draw
+      return;
+    }
+
     var parentOpacity = node.effectiveOpacity();
@@ -115,5 +123,2 @@ if( parentOpacity === 0 ){ return; }
 
-      var overlayPadding = style['overlay-padding'].pxValue;
-      var overlayOpacity = style['overlay-opacity'].value;
-      var overlayColor = style['overlay-color'].value;
       if( overlayOpacity > 0 ){
@@ -137,12 +142,4 @@ context.fillStyle = "rgba( " + overlayColor[0] + ", " + overlayColor[1] + ", " + overlayColor[2] + ", " + overlayOpacity + " )";
     node = node[0]; // ensure ele ref
-
-    for( var i = 1; i <= $$.style.pieBackgroundN; i++ ){ // 1..N
-      var size = node._private.style['pie-' + i + '-background-size'].value;
-
-      if( size > 0 ){
-        return true;
-      }
-    }
-
-    return false;
+    
+    return node._private.hasPie;
   };
@@ -153,4 +150,2 @@
 
-    if( !this.hasPie(node) ){ return; } // exit early if not needed
-
     var pieSize = node._private.style['pie-size'];
@@ -157,0 +152,0 @@ var nodeW = this.getNodeWidth( node );

src/extensions/renderer.canvas.drawing-redraw.js

@@ -92,2 +92,3 @@ ;(function($$){ 'use strict';
     var cy = r.data.cy; var data = r.data; 
+    var needDraw = data.canvasNeedsRedraw;
     
@@ -141,5 +142,5 @@ clearTimeout( this.redrawTimeout );
 
-      if( !forcedContext ){
-        r.matchCanvasSize(data.container);
-      }
+      // if( !forcedContext ){
+      //   r.matchCanvasSize(data.container);
+      // }
 
@@ -163,6 +164,12 @@ var zoom = cy.zoom();
       
-      var elements;
-      var elesInDragLayer;
-      var elesNotInDragLayer;
-      var element;
+      var eles = {
+        drag: {
+          nodes: [],
+          edges: []
+        },
+        nondrag: {
+          nodes: [],
+          edges: []
+        }
+      };
 
@@ -185,3 +192,3 @@ function setContextTransform(context){
 
-      if (data.canvasNeedsRedraw[CanvasRenderer.DRAG] || data.canvasNeedsRedraw[CanvasRenderer.NODE] || drawAllLayers) {
+      if (needDraw[CanvasRenderer.DRAG] || needDraw[CanvasRenderer.NODE] || drawAllLayers) {
         //NB : VERY EXPENSIVE
@@ -202,16 +209,16 @@ //console.time('edgectlpts'); for( var looper = 0; looper <= looperMax; looper++ ){
         // console.time('sort'); for( var looper = 0; looper <= looperMax; looper++ ){
-        elements = r.getCachedZSortedEles();
+        var zEles = r.getCachedZSortedEles();
         // } console.timeEnd('sort')
 
-        elesInDragLayer = [];
-        elesNotInDragLayer = [];
+        for (var i = 0; i < zEles.length; i++) {
+          var ele = zEles[i];
+          var list;
 
-        for (var index = 0; index < elements.length; index++) {
-          element = elements[index];
-
-          if ( element._private.rscratch.inDragLayer ) {
-            elesInDragLayer.push( element );
+          if ( ele._private.rscratch.inDragLayer ) {
+            list = eles.drag;
           } else {
-            elesNotInDragLayer.push( element );
+            list = eles.nondrag;
           }
+
+          list[ ele._private.group ].push( ele );
         }
@@ -229,21 +236,10 @@
       
-      function drawElements( eleList, context ){
-        var edges = [];
-        var nodes = [];
+      function drawElements( list, context ){
+        var edges = list.edges;
+        var nodes = list.nodes;
 
-        for (var i = 0; i < eleList.length; i++) {
-          ele = eleList[i];
-          
-          if ( ele.isNode() ) {
-            nodes.push( ele );
-            
-          } else if ( ele.isEdge() && !hideEdges ) {
-            r.drawEdge(context, ele);
-            edges.push( ele );
-          }
-        }
-
         for (var i = 0; i < edges.length && !hideEdges; i++) {
           ele = edges[i];
           
+          r.drawEdge(context, ele);
           r.drawEdgeText(context, ele);
@@ -264,3 +260,3 @@ r.drawEdge(context, ele, true);
       // console.time('drawing'); for( var looper = 0; looper <= looperMax; looper++ ){
-      if (data.canvasNeedsRedraw[CanvasRenderer.NODE] || drawAllLayers) {
+      if (needDraw[CanvasRenderer.NODE] || drawAllLayers) {
         // console.log('redrawing node layer');
@@ -271,10 +267,10 @@
         setContextTransform( context );
-        drawElements(elesNotInDragLayer, context);
+        drawElements(eles.nondrag, context);
         
         if( !drawAllLayers ){
-          data.canvasNeedsRedraw[CanvasRenderer.NODE] = false; 
+          needDraw[CanvasRenderer.NODE] = false; 
         }
       }
       
-      if (data.canvasNeedsRedraw[CanvasRenderer.DRAG] || drawAllLayers) {
+      if (needDraw[CanvasRenderer.DRAG] || drawAllLayers) {
         
@@ -284,10 +280,10 @@ var context = forcedContext || data.canvases[CanvasRenderer.DRAG].getContext('2d');
         setContextTransform( context );
-        drawElements(elesInDragLayer, context);
+        drawElements(eles.drag, context);
         
         if( !drawAllLayers ){
-          data.canvasNeedsRedraw[CanvasRenderer.DRAG] = false;
+          needDraw[CanvasRenderer.DRAG] = false;
         }
       }
       
-      if (data.canvasNeedsRedraw[CanvasRenderer.SELECT_BOX] && !drawAllLayers) {
+      if (needDraw[CanvasRenderer.SELECT_BOX] && !drawAllLayers) {
         // console.log('redrawing selection box');
@@ -349,3 +345,3 @@
         if( !drawAllLayers ){
-          data.canvasNeedsRedraw[CanvasRenderer.SELECT_BOX] = false; 
+          needDraw[CanvasRenderer.SELECT_BOX] = false; 
         }
@@ -352,0 +348,0 @@ }

src/extensions/renderer.canvas.load-and-listeners.js

@@ -202,3 +202,3 @@ ;(function($$){ 'use strict';
           if (near != null && r.nodeIsDraggable(near)) {
-            if (near._private.group == 'nodes' && near._private.selected == false) {
+            if ( near.isNode() && !near.selected() ) {
 
@@ -220,5 +220,4 @@ draggedElements = r.dragData.possibleDragElements = [ ];
               updateAncestorsInDragLayer(near, true);
-            }
-                
-            if (near._private.group == 'nodes' && near._private.selected == true) {
+
+            } else if ( near.isNode() && near.selected() ) {
               draggedElements = r.dragData.possibleDragElements = [  ];
@@ -480,2 +479,4 @@
               var pos = ele.position();
+
+              toTrigger.push( ele );
               
@@ -487,7 +488,5 @@ return {
 
-              toTrigger.push( ele );
             }
           });
           
-          
           (new $$.Collection(cy, toTrigger))
@@ -714,3 +713,3 @@ .trigger('drag')
 
-            grabbedEles.trigger('free');
+            near.trigger('free');
           }
@@ -1447,5 +1446,16 @@ }
     
+    r.registerBinding(window, 'touchcancel', function(e) {
+      r.touchData.capture = false;
+    });
+
     r.registerBinding(window, 'touchend', function(e) {
       
-      var capture = r.touchData.capture; if (!capture) { return; }; r.touchData.capture = false;
+      var capture = r.touchData.capture; 
+
+      if( capture ){
+        r.touchData.capture = false;
+      } else {
+        return;
+      }
+      
       e.preventDefault();
@@ -1452,0 +1462,0 @@ var select = r.data.select;

src/heap.js

@@ -77,8 +77,17 @@ ;(function ($$) {
 
+  $$.fn.heap = function( fnMap, options ){
+    for( var name in fnMap ){
+      var fn = fnMap[name];
+      $$.Heap.prototype[ name ] = fn;
+    }
+  };
+
+  $$.heapfn = $$.Heap.prototype; // short alias
+
   /* object methods */
-  $$.Heap.prototype.size = function () {
+  $$.heapfn.size = function () {
     return this._private.length;
   };
 
-  $$.Heap.prototype.getArgumentAsCollection = function (eles, cy) {
+  $$.heapfn.getArgumentAsCollection = function (eles, cy) {
     var result;
@@ -111,3 +120,3 @@ if(typeof cy === "undefined") {
 
-  $$.Heap.prototype.isHeap = function () {
+  $$.heapfn.isHeap = function () {
     var array = this._private.heap,
@@ -136,3 +145,3 @@ arrlen = array.length,
 
-  $$.Heap.prototype.heapSwap = function (i, j) {
+  $$.heapfn.heapSwap = function (i, j) {
     var heap = this._private.heap,
@@ -156,3 +165,3 @@ pointers = this._private.pointers,
 
-  $$.Heap.prototype.heapify = function (i, rootToLeaf) {
+  $$.heapfn.heapify = function (i, rootToLeaf) {
     var treeLen = 0,
@@ -216,3 +225,3 @@ condHeap = false,
   /* collectionOrElement */
-  $$.Heap.prototype.insert = function (eles) {
+  $$.heapfn.insert = function (eles) {
     var elements = this.getArgumentAsCollection(eles),
@@ -245,3 +254,3 @@ elsize = elements.length,
 
-  $$.Heap.prototype.getValueById = function (elementId) {
+  $$.heapfn.getValueById = function (elementId) {
     if (this._private.pointers.hasOwnProperty(elementId)) {
@@ -254,3 +263,3 @@ var elementIndex = this._private.pointers[elementId];
   
-  $$.Heap.prototype.contains = function (eles) {
+  $$.heapfn.contains = function (eles) {
     var elements = this.getArgumentAsCollection(eles);
@@ -269,3 +278,3 @@
   
-  $$.Heap.prototype.top = function () {
+  $$.heapfn.top = function () {
     if (this._private.length > 0) {
@@ -281,3 +290,3 @@
 
-  $$.Heap.prototype.pop = function () {
+  $$.heapfn.pop = function () {
     if (this._private.length > 0) {
@@ -306,3 +315,3 @@ var top = this.top(),
 
-  $$.Heap.prototype.findDirectionHeapify = function (index) {
+  $$.heapfn.findDirectionHeapify = function (index) {
     var parent = Math.floor((index - 1) / 2),
@@ -317,3 +326,3 @@ array = this._private.heap,
   // only values in heap are updated. elements themselves are not!
-  $$.Heap.prototype.edit = function (eles, edit) {
+  $$.heapfn.edit = function (eles, edit) {
     var elements = this.getArgumentAsCollection(eles);
@@ -337,3 +346,3 @@
 
-  $$.Heap.prototype.delete = function (eles) {
+  $$.heapfn.delete = function (eles) {
     var elements = this.getArgumentAsCollection(eles);
@@ -340,0 +349,0 @@

src/style-apply.js

@@ -73,2 +73,17 @@ ;(function($$){ 'use strict';
 
+      // set whether has pie or not; for greater efficiency
+      var hasPie = false;
+      if( ele._private.group === 'nodes' ){
+        for( var i = 1; i <= $$.style.pieBackgroundN; i++ ){ // 1..N
+          var size = ele._private.style['pie-' + i + '-background-size'].value;
+
+          if( size > 0 ){
+            hasPie = true;
+            break;
+          }
+        }
+      }
+
+      ele._private.hasPie = hasPie;
+
     } // for elements
@@ -75,0 +90,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

Number of lines in readme file

105

increased by0.96%

Worsened metrics

Total package byte prevSize

17462581

decreased by-9.73%

Dev dependency count

14

increased by16.67%

Number of package files

367

decreased by-1.61%

Lines of code

277648

decreased by-13.74%

No dependency changes