cwl-svg - npm Package Compare versions

Comparing version 0.0.19 to 0.0.20

graph/workflow.d.ts

@@ -32,6 +32,7 @@ /// <reference types="snapsvg" />
     private attachPortDragBehavior();
-    private findParent(el, parentClass);
+    static findParentNode(el: any): any;
     static setModelPosition(obj: any, x: any, y: any): void;
     private clearCanvas();
     private getOffsetFromCanvasCenter(x, y);
+    private activateSelection(el);
 }

graph/workflow.js

@@ -268,14 +268,4 @@ "use strict";
          */
-        this.domEvents.on("click", ".node", function (ev, el, root) {
-            _this.deselectEverything();
-            _this.workflow.classList.add("has-selection");
-            var nodeID = el.getAttribute("data-id");
-            Array.from(root.querySelectorAll(".edge." + nodeID)).forEach(function (edge) {
-                edge.classList.add("highlighted");
-                var sourceNodeID = edge.getAttribute("data-source-node");
-                var destinationNodeID = edge.getAttribute("data-destination-node");
-                Array.from(root.querySelectorAll(".node." + sourceNodeID + ", .node." + destinationNodeID))
-                    .forEach(function (el) { return el.classList.add("highlighted"); });
-            });
-            el.classList.add("selected");
+        this.domEvents.on("click", ".node", function (ev, el) {
+            _this.activateSelection(el);
         });
@@ -321,3 +311,3 @@ /**
             }, function (ev, target) {
-                var parentNode = _this.findParent(target, "node");
+                var parentNode = Workflow.findParentNode(target);
                 var model = _this.model.findById(parentNode.getAttribute("data-connection-id"));
@@ -466,4 +456,4 @@ Workflow.setModelPosition(model, newX_1, newY_1);
                     var destinationPort = _this.workflow.querySelector(".port[data-connection-id=\"" + destinationPortID + "\"]");
-                    var sourceNode = _this.findParent(sourcePort, "node");
-                    var destinationNode = _this.findParent(destinationPort, "node");
+                    var sourceNode = Workflow.findParentNode(sourcePort);
+                    var destinationNode = Workflow.findParentNode(destinationPort);
                     _this.model.disconnect(sourcePortID, destinationPortID);
@@ -481,3 +471,2 @@ _this.renderModel(_this.model);
             });
-            console.log("Delete something", selection);
         }, window);
@@ -512,3 +501,3 @@ };
             if (highlightedPort) {
-                var parentNode = _this.findParent(highlightedPort, "node");
+                var parentNode = Workflow.findParentNode(highlightedPort);
                 highlightedPort.classList.remove("highlighted", "preferred-port");
@@ -522,3 +511,3 @@ parentNode.classList.remove("highlighted", "preferred-node", edgeDirection);
                 highlightedPort.classList.add("highlighted", "preferred-port");
-                var parentNode = _this.findParent(highlightedPort, "node");
+                var parentNode = Workflow.findParentNode(highlightedPort);
                 _this.workflow.appendChild(parentNode);
@@ -531,3 +520,3 @@ parentNode.classList.add("highlighted", "preferred-node", edgeDirection);
                     ioNode.classList.remove("hidden");
-                    // Otherwise, we might create an input or an output node
+                    // Otherwise, we might create an input or an ooutput node
                     ioNode.transform.baseVal.getItem(0).setTranslate(coords.x, coords.y);
@@ -539,3 +528,3 @@ }
         }, function (ev, origin, root) {
-            var originNode = _this.findParent(origin, "node");
+            var originNode = Workflow.findParentNode(origin);
             var originNodeCTM = originNode.getScreenCTM();
@@ -557,3 +546,3 @@ originNodeCoords = _this.translateMouseCoords(originNodeCTM.e, originNodeCTM.f);
                 // Except the same node that we are dragging from
-                return _this.findParent(el, "node") !== originNode;
+                return Workflow.findParentNode(el) !== originNode;
             }).map(function (el) {
@@ -576,3 +565,3 @@ // Find the position of the port relative to the canvas origin
             preferredConnectionPorts.forEach(function (el) {
-                var parentNode = _this.findParent(el, "node");
+                var parentNode = Workflow.findParentNode(el);
                 parentNode.classList.add("highlighted", "connection-suggestion");
@@ -582,5 +571,6 @@ });
             _this.workflow.classList.add("has-suggestion", "edge-dragging");
-        }, function (ev, target) {
+        }, function (ev, origin) {
+            var parentNode = Workflow.findParentNode(origin);
             if (highlightedPort) {
-                var sourceID = target.getAttribute("data-connection-id");
+                var sourceID = origin.getAttribute("data-connection-id");
                 var destID = highlightedPort.getAttribute("data-connection-id");
@@ -605,3 +595,3 @@ if (sourceID.startsWith("in")) {
             else if (!ioNode.classList.contains("hidden")) {
-                var portID = target.getAttribute("data-connection-id");
+                var portID = origin.getAttribute("data-connection-id");
                 var newIO = graph_node_1.GraphNode.patchModelPorts(portID.startsWith("in")
@@ -622,2 +612,5 @@ ? _this.model.createInputFromPort(portID)
             });
+            if (parentNode.classList.contains("selected")) {
+                _this.activateSelection(parentNode);
+            }
             edge.remove();
@@ -632,6 +625,6 @@ ioNode.remove();
     };
-    Workflow.prototype.findParent = function (el, parentClass) {
+    Workflow.findParentNode = function (el) {
         var parentNode = el;
         while (parentNode) {
-            if (parentNode.classList.contains(parentClass)) {
+            if (parentNode.classList.contains("node")) {
                 return parentNode;
@@ -669,2 +662,16 @@ }
     };
+    Workflow.prototype.activateSelection = function (el) {
+        var _this = this;
+        this.deselectEverything();
+        this.workflow.classList.add("has-selection");
+        var nodeID = el.getAttribute("data-id");
+        Array.from(this.workflow.querySelectorAll(".edge." + nodeID)).forEach(function (edge) {
+            edge.classList.add("highlighted");
+            var sourceNodeID = edge.getAttribute("data-source-node");
+            var destinationNodeID = edge.getAttribute("data-destination-node");
+            Array.from(_this.workflow.querySelectorAll(".node." + sourceNodeID + ", .node." + destinationNodeID))
+                .forEach(function (el) { return el.classList.add("highlighted"); });
+        });
+        el.classList.add("selected");
+    };
     return Workflow;
@@ -671,0 +678,0 @@ }());

package.json

@@ -10,3 +10,3 @@ {
   "description": "A library for generating an interactive SVG visualization of CWL workflows",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "dependencies": {
@@ -33,2 +33,2 @@ "core-js": "^2.4.1",
   }
-}
+}

No alert changes

Improved metrics

Total package byte prevSize

133778

increased by0.29%

Lines of code

1593

increased by0.5%

No dependency changes