Merge branch 'jri-master' #77 #67

cytoscape · Apr 2, 2019 · d115d2c · d115d2c
2 parents 74fb3a3 + 8b4fab0
commit d115d2c
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 39 deletions.
diff --git a/README.md b/README.md
@@ -86,7 +86,7 @@ let defaults = {
       enabled: true // whether the command is selectable
     }
     */
-  ], // function( ele ){ return [ /*...*/ ] }, // example function for commands
+  ], // function( ele ){ return [ /*...*/ ] }, // a function that returns commands or a promise of commands
   fillColor: 'rgba(0, 0, 0, 0.75)', // the background colour of the menu
   activeFillColor: 'rgba(1, 105, 217, 0.75)', // the colour used to indicate the selected command
   activePadding: 20, // additional size in pixels for the active command

diff --git a/src/cxtmenu.js b/src/cxtmenu.js
@@ -372,61 +372,73 @@ let cxtmenu = function(params){
         }
 
         if( typeof options.commands === 'function' ){
-          commands = options.commands(target);
+          const res = options.commands(target);
+          if( res.then ){
+            res.then(_commands => {
+              commands = _commands;
+              openMenu();
+            })
+          } else {
+            commands = res;
+            openMenu();
+          }
         } else {
           commands = options.commands;
+          openMenu();
         }
 
-        if( !commands || commands.length === 0 ){ return; }
+        function openMenu(){
+          if( !commands || commands.length === 0 ){ return; }
 
-        zoomEnabled = cy.userZoomingEnabled();
-        cy.userZoomingEnabled( false );
+          zoomEnabled = cy.userZoomingEnabled();
+          cy.userZoomingEnabled( false );
 
-        panEnabled = cy.userPanningEnabled();
-        cy.userPanningEnabled( false );
+          panEnabled = cy.userPanningEnabled();
+          cy.userPanningEnabled( false );
 
-        boxEnabled = cy.boxSelectionEnabled();
-        cy.boxSelectionEnabled( false );
+          boxEnabled = cy.boxSelectionEnabled();
+          cy.boxSelectionEnabled( false );
 
-        grabbable = target.grabbable &&  target.grabbable();
-        if( grabbable ){
-          target.ungrabify();
-        }
+          grabbable = target.grabbable &&  target.grabbable();
+          if( grabbable ){
+            target.ungrabify();
+          }
 
-        let rp, rw, rh;
-        if( !isCy && ele.isNode() && !ele.isParent() && !options.atMouse ){
-          rp = ele.renderedPosition();
-          rw = ele.renderedWidth();
-          rh = ele.renderedHeight();
-        } else {
-          rp = e.renderedPosition || e.cyRenderedPosition;
-          rw = 1;
-          rh = 1;
-        }
+          let rp, rw, rh;
+          if( !isCy && ele.isNode() && !ele.isParent() && !options.atMouse ){
+            rp = ele.renderedPosition();
+            rw = ele.renderedWidth();
+            rh = ele.renderedHeight();
+          } else {
+            rp = e.renderedPosition || e.cyRenderedPosition;
+            rw = 1;
+            rh = 1;
+          }
 
-        offset = getOffset(container);
+          offset = getOffset(container);
 
-        ctrx = rp.x;
-        ctry = rp.y;
+          ctrx = rp.x;
+          ctry = rp.y;
 
-        createMenuItems();
+          createMenuItems();
 
-        setStyles(parent, {
-          display: 'block',
-          left: (rp.x - r) + 'px',
-          top: (rp.y - r) + 'px'
-        });
+          setStyles(parent, {
+            display: 'block',
+            left: (rp.x - r) + 'px',
+            top: (rp.y - r) + 'px'
+          });
 
-        rs = Math.max(rw, rh)/2;
-        rs = Math.max(rs, options.minSpotlightRadius);
-        rs = Math.min(rs, options.maxSpotlightRadius);
+          rs = Math.max(rw, rh)/2;
+          rs = Math.max(rs, options.minSpotlightRadius);
+          rs = Math.min(rs, options.maxSpotlightRadius);
 
-        queueDrawBg();
+          queueDrawBg();
 
-        activeCommandI = undefined;
+          activeCommandI = undefined;
 
-        inGesture = true;
-        gestureStartEvent = e;
+          inGesture = true;
+          gestureStartEvent = e;
+        }
       })
 
       .on('cxtdrag tapdrag', options.selector, dragHandler = function(e){