cytoscape-edge-bend-editing - npm Package Compare versions

Comparing version 1.0.3 to 1.1.0

package.json

 {
   "name": "cytoscape-edge-bend-editing",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "description": "A Cytoscape.js extension enables editing edge bend points",
@@ -5,0 +5,0 @@ "main": "cytoscape-edge-bend-editing.js",

README.md

 cytoscape-edge-bend-editing
 ================================================================================
 
+## Important Note
+ 
+ To use this extension you should include 'cytoscape.js-context-menus' extension. 
+ Please see 'https://github.com/iVis-at-Bilkent/cytoscape.js-context-menus'.
 
@@ -5,0 +9,0 @@ ## Description

src/bendPointUtilities.js

@@ -209,11 +209,2 @@ var bendPointUtilities = {
     
-    var minDiff = 0.001;
-    
-    if(Math.abs(weight - 0) < minDiff){
-      weight = minDiff;
-    }
-    else if(Math.abs(weight - 1) < minDiff){
-      weight = 1 - minDiff;
-    }
-    
     return {
@@ -220,0 +211,0 @@ weight: weight,

src/UIUtilities.js

@@ -8,3 +8,5 @@ var debounce = require('./debounce');
 
-  var ePosition, eRemove, eZoom, eSelect, eUnselect, eTapStart, eTapDrag, eTapEnd, eCxtTap, eTap;
+  var addBendPointCxtMenuId = 'cy-edge-bend-editing-cxt-add-bend-point';
+  var removeBendPointCxtMenuId = 'cy-edge-bend-editing-cxt-remove-bend-point';
+  var ePosition, eRemove, eZoom, eSelect, eUnselect, eTapStart, eTapDrag, eTapEnd, eCxtTap;
   var functions = {
@@ -18,32 +20,10 @@ init: function () {
       var $container = $(this);
-      var cy;
+//      var cy;
       var $canvas = $('<canvas></canvas>');
 
       $container.append($canvas);
-      
-      var $ctxAddBendPoint = $('<menu title="Add Bend Point" id="cy-edge-bend-editing-ctx-add-bend-point" class="cy-edge-bend-editing-ctx-operation"></menu>');
-      var $ctxRemoveBendPoint = $('<menu title="Remove Bend Point" id="cy-edge-bend-editing-ctx-remove-bend-point" class="cy-edge-bend-editing-ctx-operation"></menu>');
-      
-      $('body').append($ctxAddBendPoint);
-      $('body').append($ctxRemoveBendPoint);
-      
-      document.getElementById("cy-edge-bend-editing-ctx-add-bend-point").addEventListener("contextmenu",function(event){
-        event.preventDefault();
-      },false);
 
-      document.getElementById("cy-edge-bend-editing-ctx-remove-bend-point").addEventListener("contextmenu",function(event){
-          event.preventDefault();
-      },false);
-
-      $('.cy-edge-bend-editing-ctx-operation').click(function (e) {
-        $('.cy-edge-bend-editing-ctx-operation').css('display', 'none');
-      });
-
-      $ctxAddBendPoint.click(function (e) {
-        var edge = bendPointUtilities.currentCtxEdge;
+      var cxtAddBendPointFcn = function (event) {
+        var edge = event.cyTarget;
         
-        if(!edge.selected()) {
-          return;
-        }
-        
         var param = {
@@ -62,12 +42,7 @@ edge: edge,
         clearDraws(true);
-        
-      });
+      };
 
-      $ctxRemoveBendPoint.click(function (e) {
-        var edge = bendPointUtilities.currentCtxEdge;
+      var cxtRemoveBendPointFcn = function (event) {
+        var edge = event.cyTarget;
         
-        if(!edge.selected()) {
-          return;
-        }
-        
         var param = {
@@ -86,4 +61,38 @@ edge: edge,
         clearDraws(true);
-      });
+      };
       
+      if(cy.contextMenus == null) {
+        var exceptionStr = "To use cytoscape.js-edge-bend-editing extension you must include cytoscape.js-context-menus extension"
+          + "\n" + "Please see 'https://github.com/iVis-at-Bilkent/cytoscape.js-context-menus'";
+  
+        throw exceptionStr;
+      }
+      
+      var menuItems = [
+        {
+          id: addBendPointCxtMenuId,
+          title: 'Add Bend Point',
+          selector: 'edge:selected',
+          onClickFunction: cxtAddBendPointFcn
+        },
+        {
+          id: removeBendPointCxtMenuId,
+          title: 'Remove Bend Point',
+          selector: 'edge:selected',
+          onClickFunction: cxtRemoveBendPointFcn
+        }
+      ];
+      
+      // If context menus is active just append menu items else activate the extension
+      // with initial menu items
+      if (cy.isContextMenusActive()) {
+        cy.appendMenuItems(menuItems);
+      }
+      else {
+        cy.contextMenus({
+          menuItems: menuItems,
+          menuItemClasses: ['cy-edge-bend-editing-cxt-operation']
+        });
+      }
+      
       var _sizeCanvas = debounce(function () {
@@ -388,36 +397,16 @@ $canvas
           }
-          
-          var containerPos = $(cy.container()).position();
 
-          var left = containerPos.left + event.cyRenderedPosition.x;
-          left = left.toString() + 'px';
-
-          var top = containerPos.top + event.cyRenderedPosition.y;
-          top = top.toString() + 'px';
-
-          $('.cy-edge-bend-editing-ctx-operation').css('display', 'none');
-
           var selectedBendIndex = getContainingBendShapeIndex(event.cyPosition.x, event.cyPosition.y, edge);
           if (selectedBendIndex == -1) {
-            $ctxAddBendPoint.css('display', 'block');
+            $('#' + removeBendPointCxtMenuId).css('display', 'none');
             bendPointUtilities.currentCtxPos = event.cyPosition;
-            ctxMenu = document.getElementById("cy-edge-bend-editing-ctx-add-bend-point");
           }
           else {
-            $ctxRemoveBendPoint.css('display', 'block');
+            $('#' + addBendPointCxtMenuId).css('display', 'none');
             bendPointUtilities.currentBendIndex = selectedBendIndex;
-            ctxMenu = document.getElementById("cy-edge-bend-editing-ctx-remove-bend-point");
           }
 
-          ctxMenu.style.display = "block";
-          ctxMenu.style.left = left;
-          ctxMenu.style.top = top;
-
           bendPointUtilities.currentCtxEdge = edge;
         });
         
-        cy.on('tap', eTap = function(event) {
-          $('.cy-edge-bend-editing-ctx-operation').css('display', 'none');
-        });
-        
         cy.on('cyedgebendediting.changeBendPoints', 'edge', function() {
@@ -427,2 +416,3 @@ var edge = this;
           clearDraws(true);
+          
         });
@@ -442,4 +432,3 @@
           .off('tapend', eTapEnd)
-          .off('cxttap', eCxtTap)
-          .off('tap', eTap);
+          .off('cxttap', eCxtTap);
 
@@ -446,0 +435,0 @@ cy.unbind("zoom pan", eZoom);

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

89

increased by4.71%

Worsened metrics

Total package byte prevSize

169279

decreased by-1.77%

Lines of code

2726

decreased by-1.73%

No dependency changes