@kumologica/sdk 3.0.7 → 3.0.10

package/src/app/ui/editor-client/src/js/ui/tab-kumohub.js

@@ -308,11 +308,11 @@ RED.sidebar.kumohub = (function () {
     }
     if (params.account) {
       $('#kumohub-fn-workspace').val(params.workspace || params.account);
-      fillStages('#kumohub-fn-workspace').val();
+      fillStages(params.workspace || params.account);
     }
     if (params.workspace) {
       $('#kumohub-fn-workspace').val(params.workspace);
-      fillStages('#kumohub-fn-workspace').val();
+      fillStages(params.workspace);
     }
 
     if (params.stage) {
@@ -395,8 +395,12 @@ RED.sidebar.kumohub = (function () {
       //dropdown.append($('<option></option>').val("UNDEFINED").text("Undefined"));
       return;
     }
-    let ws = workspaces.find(w => w.name === fnWorkspace);
-  
+    let ws;
+    
+    if (workspaces) {
+      ws = workspaces.find(w => w.name === fnWorkspace);
+    }
+
     if (ws) {
       dropdown.empty();
       if (ws.stages && ws.stages.length > 0) {
@@ -421,8 +425,12 @@ RED.sidebar.kumohub = (function () {
       //dropdown.append($('<option></option>').val("UNDEFINED").text("Undefined"));
       return;
     }
-    let ws = workspaces.find(w => w.name === workspace);
-  
+    let ws;
+    
+    if (workspaces) {
+      ws = workspaces.find(w => w.name === workspace);
+    }
+
     if (ws) {
       let st = ws.stages.find(s => s.name === stage);
       if (st && st.policies) {

package/src/app/ui/editor-client/src/js/ui/view.js

@@ -1,4 +1,8 @@
 RED.view = (function () {
+  let drag = false;
+  let dragging = false;
+  let draggingPos = { top: 0, left: 0, x: 0, y: 0 };
+
   var space_width = 5000,
     space_height = 5000,
     lineCurveScale = 0.75,
@@ -70,7 +74,7 @@ RED.view = (function () {
     .attr('width', space_width)
     .attr('height', space_height)
     .attr('pointer-events', 'all')
-    .style('cursor', 'crosshair')
+    // .style('cursor', 'crosshair')
     .on('mousedown', function () {
       focusView();
     })
@@ -532,6 +536,65 @@ RED.view = (function () {
       }
     });
 
+    // Handle dragging the workspace
+    $('#chart')
+      .keydown(function(e){
+        if(e.keyCode == 32) {
+          e.preventDefault();
+          if (!drag) {
+            drag = true;
+            $('#chart').attr('style','cursor: grab !important')    
+          }
+        }
+      })
+      .keyup(function(e){
+      if(e.keyCode == 32 && drag){
+        e.preventDefault();
+        drag = false;
+        dragging = false;
+        $('#chart').attr('style','cursor: default !important')
+      }
+      })
+      .on("mousedown", function(e) {
+        if (drag && !dragging) {
+          e.preventDefault();
+          
+          $('#chart').attr('style','cursor: grabbing !important')
+          dragging = true;
+          draggingPos = {
+            // The current scroll
+            left: $('#chart').scrollLeft(),
+            top: $('#chart').scrollTop(),
+            x: e.clientX,
+            y: e.clientY
+          }
+        }
+      })
+
+      .on("mouseup", function(e) {
+        if (drag && dragging){
+          e.preventDefault();
+          dragging = false;
+          // console.log('Dragging off')
+          $('#chart').attr('style','cursor: grab !important')
+        }
+      
+      })
+
+      .on("mousemove", function(e) {
+          if (drag && dragging){
+            e.preventDefault();
+            
+            // How far the mouse has been moved
+            const dx = e.clientX - draggingPos.x;
+            const dy = e.clientY - draggingPos.y;
+            
+            $("#chart").scrollLeft(draggingPos.left - dx);
+            $("#chart").scrollTop(draggingPos.top - dy);
+          }
+      });
+
+
     // Handle nodes dragged from the palette
     $('#chart').droppable({
       accept: '.palette_node',
@@ -1257,7 +1320,7 @@ RED.view = (function () {
     // console.log('[view] Create a lasso....d3.event.ctrlKey = ', d3.event.ctrlKey);
 
     if (mouse_mode === 0 && !(d3.event.metaKey || d3.event.ctrlKey)) {
-      if (!touchStartTime) {
+      if (!touchStartTime && !drag) {
 
         point = d3.mouse(this);
         lasso = vis