Update version 0.0.43

jerosoler · Jul 2, 2021 · 78393c2 · 78393c2
1 parent b00d67b
commit 78393c2
Show file tree

Hide file tree

Showing 3 changed files with 73 additions and 3 deletions.
diff --git a/dist/drawflow.min.js b/dist/drawflow.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "drawflow",
-  "version": "0.0.42",
+  "version": "0.0.43",
   "description": "Simple flow library",
   "main": "dist/drawflow.min.js",
   "scripts": {

diff --git a/test.html b/test.html
@@ -97,7 +97,46 @@
   <script>
 
   var id = document.getElementById("drawflow");
+
   const editor = new Drawflow(id);
+
+  const config = { attributes: true, childList: true, subtree: true };
+
+    const callback = function(mutationsList, observer) {
+      // Use traditional 'for loops' for IE 11
+      for(const mutation of mutationsList) {
+          if (mutation.type === 'childList') {
+              if(mutation.addedNodes[0]) {
+                if(mutation.addedNodes[0].nodeName === "svg" && mutation.addedNodes[0].classList[0] === "connection") {
+                  if(mutation.addedNodes[0].classList.length > 4) {
+                  console.log('A child node has been added or removed.');
+                    const node_id = parseInt(mutation.addedNodes[0].classList[2].slice(14));
+                    const info_node = editor.getNodeFromId(node_id);
+                    mutation.addedNodes[0].classList.add(info_node.class);
+                   //console.log(mutation);
+                  }
+                }
+
+              }
+          }
+          else if (mutation.type === 'attributes') {
+              if(mutation.attributeName === "class") {
+                if(mutation.target.nodeName === "svg" && mutation.target.classList[0] === "connection") {
+                  if(mutation.target.classList.length > 4 && mutation.target.classList.length < 6) {
+                      //console.log("add class");
+                      const node_id = parseInt(mutation.target.classList[2].slice(14));
+                      const info_node = editor.getNodeFromId(node_id);
+                      console.log(info_node);
+                      mutation.target.classList.add(info_node.class);
+                }
+              }
+          }
+      }
+    }
+  };
+  const observer = new MutationObserver(callback);
+  observer.observe(id, config);
+
   editor.reroute = true;
   editor.reroute_fix_curvature = true;
 
@@ -136,7 +175,7 @@
 
   //editor.addNode('github', 0, 1, 150, 300, 'github', data, html);
 
-  editor.addNode('github', 0, 1, 200, 250, 'github', data, "testNode", true);
+  editor.addNode('github', 0, 2, 200, 250, 'github', data, "testNode", true);
   /*setTimeout(function() {
     editor.addNode('github', 1, 1, 300, 350, 'github', data, "testNode", true);
       setTimeout(function() {
@@ -158,10 +197,32 @@
   editor.addNode('github', 1, 1, 300, 375, 'custom-node-3', data, "<b>Holaaa</b>");
   editor.addNode('github', 1, 1, 0, 375, 'custom-node-4', data, "<b>Holaaa</b>");
 
+  editor.addNodeInput(1);
+  editor.addNodeOutput(1);
+
+  editor.removeNodeOutput(1, 'output_2');
+  editor.removeNodeInput(1, 'input_2');
+
+
+  const datatest2 = {
+          level0: 'test0123132',
+          level1: {
+           name1: 'TEST 11231',
+           level2: {
+             name2: 'test 2211321',
+             level3: {
+               name3: "TESTTTTT 312313"
+             }
+           }
+          }
+         }
+editor.updateNodeDataFromId(1, datatest2);
   editor.addNode('github', 1, 3, 100, 50, 'romb', data, "<b>Hey</b>");
 
   editor.addConnection(6,7,'output_1', 'input_1');
 
+  editor.removeSingleConnection(6,7,'output_1', 'input_1');
+
     var exportvalue = null;
     function export2(){
       exportvalue = editor.export();
@@ -239,5 +300,14 @@
 
 
 
+<style>
+.connection.github.output_1 path {
+  stroke: red;
+}
+
+.connection.github.output_2 path {
+  stroke: green;
+}
+</style>
 </body>
 </html>