diff --git a/app/assets/html/bzGraflow/nodes16ports.html b/app/assets/html/bzGraflow/nodes16ports.html
deleted file mode 100644
index cab951a..0000000
--- a/app/assets/html/bzGraflow/nodes16ports.html
+++ /dev/null
@@ -1,59 +0,0 @@
-<style>
-    .bzgf-node {
-        font-family: Arial, Helvetica, sans-serif;
-        width: 50px;
-        height: 50px;
-        color: black;
-        text-align: center;
-        position: absolute;
-        padding: .5em;
-    }    
-    .bzgf-node .body{
-        z-index: 1;
-        position: absolute;
-        inset: 0;
-        background: var(--eicui-base-color-grey-25);
-        border:2px solid var(--eicui-base-color-grey-50);
-        border-radius: 6px;
-    }
-    .bzgf-node .title {
-        font-weight: bold;
-        color: var(--app-color-black);
-        margin: .5em auto .2em auto;    
-    }
-    .bzgf-node .subtitle {        
-        font-size: .9em;
-        color: var(--eicui-base-color-primary-100);
-        width: 90%;
-        margin: auto;        
-    }
-    .bzgf-node .port{
-        position: absolute;
-        height: 10px;
-        width: 10px;
-        background: var(--eicui-base-color-info-25);
-        border-radius: 10px;
-    }
-
-    .bzgf-node [data-direction="n"]{ top: -4px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="s"]{ bottom: -4px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="w"]{ left: -4px; top: 50%; transform: translateY(-50%);}
-    .bzgf-node [data-direction="e"]{ right: -4px; top: 50%; transform: translateY(-50%);}
-
-    .bzgf-wire{ stroke: var(--eicui-base-color-info); stroke-width: 4px; stroke-dasharray: 10,5; }
-</style>
-
-<template>
-    <div class="bzgf-node" data-nodetype="square">
-        <div class="body">
-            <div class="title">{title}</div>
-            <div class="subtitle">{subtitle}</div>
-        </div>
-        <div class="port" data-id="w" data-direction="w"></div>
-        <div class="port" data-id="n" data-direction="n"></div>
-        <div class="port" data-id="e" data-direction="e"></div>
-        <div class="port" data-id="s" data-direction="s"></div>
-
-    </div>
-</template>
-
diff --git a/app/assets/html/bzGraflow/nodesEIC.html b/app/assets/html/bzGraflow/nodesEIC.html
deleted file mode 100644
index ea17fc3..0000000
--- a/app/assets/html/bzGraflow/nodesEIC.html
+++ /dev/null
@@ -1,97 +0,0 @@
-<style>
-    .bzgf-node {
-        font-family: Arial, Helvetica, sans-serif;
-        width: 160px;
-        height: 80px;
-        color: black;
-        text-align: center;
-        position: absolute;
-        padding: .5em;
-    }    
-    .bzgf-node .body{
-        z-index: 1;
-        position: absolute;
-        inset: 0;
-        background: var(--eicui-base-color-grey-25);
-        border:2px solid var(--eicui-base-color-grey-50);
-        border-radius: 6px;
-    }
-    .bzgf-node .title {
-        font-weight: bold;
-        color: var(--app-color-black);
-        margin: .5em auto .2em auto;    
-    }
-    .bzgf-node .subtitle {
-        
-        font-size: .9em;
-        color: var(--eicui-base-color-primary-100);
-        width: 90%;
-        margin: auto;        
-    }
-    .bzgf-node .port{
-        position: absolute;
-        height: 10px;
-        width: 10px;
-        background: var(--eicui-base-color-info-25);
-        border-radius: 10px;
-    }
-
-    .bzgf-node [data-direction="n"]{ top: -4px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="s"]{ bottom: -4px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="w"]{ left: -4px; top: 50%; transform: translateY(-50%);}
-    .bzgf-node [data-direction="e"]{ right: -4px; top: 50%; transform: translateY(-50%);}
-
-
-    .bzgf-node [data-id="in2"]{ top: 25%; }
-    .bzgf-node [data-id="in3"]{ top: 75%; }
-
-    .bzgf-node [data-id="out2"]{ top: 25%; }
-    .bzgf-node [data-id="out3"]{ top: 75%; }
-
-    .bzgf-node[data-nodetype="refnodein"], .bzgf-node[data-nodetype="refnodeout"] {
-        width:3em;
-        height:3em;
-        padding: 2px;
-    }
-    .bzgf-node[data-nodetype="refnodein"] .body, .bzgf-node[data-nodetype="refnodeout"] .body{ 
-        border-radius: 50%;
-        width: 3em;
-        height: 3em;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-    .bzgf-node[data-nodetype="refnodein"] .body, .bzgf-node[data-nodetype="refnodeout"] .body{ background: var(--eicui-base-color-grey-25); }
-
-    .bzgf-wire{ stroke: var(--eicui-base-color-info); stroke-width: 4px; stroke-dasharray: 10,5; }
-</style>
-
-<template>
-    <div class="bzgf-node" data-nodetype="eicBasic">
-        <div class="body">
-            <div class="title">{title}</div>
-            <div class="subtitle">{subtitle}</div>
-        </div>
-        <div class="port" data-type="in" data-id="in1" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="in2" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="in3" data-direction="w"></div>
-
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        <div class="port" data-type="out" data-id="out2" data-direction="e"></div>
-        <div class="port" data-type="out" data-id="out3" data-direction="e"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="refnodein">
-            <div class="body">{parentport}</div>
-            <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="refnodeout">
-        <div class="body">{parentport}</div>
-        <div class="port" data-type="in" data-id="in1" data-direction="w"></div>
-    </div>
-</template>
\ No newline at end of file
diff --git a/app/assets/html/bzGraflow/nodesEIC2.html b/app/assets/html/bzGraflow/nodesEIC2.html
deleted file mode 100644
index 8f4fe9d..0000000
--- a/app/assets/html/bzGraflow/nodesEIC2.html
+++ /dev/null
@@ -1,105 +0,0 @@
-<style>
-    .bzgf-node {
-        font-family: Arial, Helvetica, sans-serif;
-        width: 160px;
-        height: 80px;
-        color: black;
-        text-align: center;
-        position: absolute;
-        padding: .5em;
-    }    
-    .bzgf-node .body{
-        z-index: 1;
-        position: absolute;
-        inset: 0;
-        background: var(--eicui-base-color-grey-25);
-        border:2px solid var(--eicui-base-color-grey-50);
-        border-radius: 6px;
-    }
-    .bzgf-node .title {
-        font-weight: bold;
-        color: var(--app-color-black);
-        margin: .5em auto .2em auto;    
-    }
-    .bzgf-node .subtitle {        
-        font-size: .9em;
-        color: var(--eicui-base-color-primary-100);
-        width: 90%;
-        margin: auto;        
-    }
-    .bzgf-node .port{
-        position: absolute;
-        height: 10px;
-        width: 10px;
-        background: var(--eicui-base-color-info-25);
-        opacity: 0;
-        border-radius: 10px;
-    }
-
-    .bzgf-node [data-direction="n"]{ top: -4px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="s"]{ bottom: -4px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="w"]{ left: -4px; top: 50%; transform: translateY(-50%);}
-    .bzgf-node [data-direction="e"]{ right: -4px; top: 50%; transform: translateY(-50%);}
-
-    .bzgf-node[data-nodetype="refnodein"], .bzgf-node[data-nodetype="refnodeout"] {
-        width:3em;
-        height:3em;
-        padding: 2px;
-    }
-    .bzgf-node[data-nodetype="refnodein"] .body, .bzgf-node[data-nodetype="refnodeout"] .body{ 
-        border-radius: 50%;
-        width: 3em;
-        height: 3em;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-    .bzgf-node[data-nodetype="refnodein"] .body, .bzgf-node[data-nodetype="refnodeout"] .body{ background: var(--eicui-base-color-grey-25); }
-
-    .bzgf-wire{ stroke: var(--eicui-base-color-info); stroke-width: 4px; stroke-dasharray: 10,5; }
-
-    path.arrow-head{ fill: var(--eicui-base-color-info); }
-</style>
-
-<svg style="display:none" aria-hidden="true">
-    <template id="svg-arrows">
-        <defs>
-            <marker id="arrow"
-                viewBox="0 0 16 16"
-                refX="16"
-                refY="8"
-                markerWidth="16"
-                markerHeight="16"
-                orient="auto-start-reverse"
-                markerUnits="userSpaceOnUse">
-                <path d="M0,0 L16,8 L0,16 Z"  class="arrow-head"/>
-            </marker>
-        </defs>
-    </template>
-</svg>
-
-
-<template>
-    <div class="bzgf-node" data-nodetype="eicBasic">
-        <div class="body">
-            <div class="title">{title}</div>
-            <div class="subtitle">{subtitle}</div>
-        </div>
-        <div class="port" data-type="in" data-id="in1" data-direction="w"></div>
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="refnodein">
-            <div class="body">{parentport}</div>
-            <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="refnodeout">
-        <div class="body">{parentport}</div>
-        <div class="port" data-type="in" data-id="in1" data-direction="w"></div>
-    </div>
-</template>
\ No newline at end of file
diff --git a/app/assets/html/bzGraflow/nodesTest1.html b/app/assets/html/bzGraflow/nodesTest1.html
deleted file mode 100644
index 07533b6..0000000
--- a/app/assets/html/bzGraflow/nodesTest1.html
+++ /dev/null
@@ -1,203 +0,0 @@
-<style>
-    .bzgf-node {
-        font-family: Arial, Helvetica, sans-serif;
-        border-width:2px;
-        border-style: solid;
-        border-radius: 6px;
-        width: 160px;
-        height: 80px;
-        color: black;
-        text-align: center;
-        position: absolute;
-        padding: .5em;
-    }    
-    
-    .bzgf-node .title {
-        font-weight: bold;
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 2em;
-        color: white;
-    }
-    .bzgf-node .body { margin-top: 2em; }
-    .bzgf-node .body input {
-        width:4em;
-        font-size: .9em;
-        border-radius: 6px;
-        border: 1px solid #CCC;
-    }
-    .bzgf-node .body div{ font-size: 12px; text-align: left; line-height: 24px; }
-    .bzgf-node .port{
-        position: absolute;
-        height: 10px;
-        width: 10px;
-        border: 1px solid black;
-        border-radius: 10px;
-    }
-    .bzgf-node .port[data-type="in"] { background: #0F0; }
-    .bzgf-node .port[data-type="out"] { background: #FF0; }
-
-    .bzgf-node [data-direction="w"]{ left: -7px; top: calc(50% + 1em); transform: translateY(-50%);}
-    .bzgf-node [data-direction="e"]{ right: -7px; top: calc(50% + 1em); transform: translateY(-50%);}
-    .bzgf-node [data-direction="n"]{ top: -7px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="s"]{ bottom: -7px; left: 50%; transform: translateX(-50%);}
-
-    .bzgf-node[data-nodetype="inc"]{
-        background: #DFD;
-        border-color: #090;
-    }
-    .bzgf-node[data-nodetype="inc"] .title{ background: #090; }
-
-
-    .bzgf-node[data-nodetype="wadder"]{
-        background: #DFD;
-        border-color: #090;
-        height:150px
-    }
-    .bzgf-node[data-nodetype="wadder"] .body{ display: grid; grid-gap: 4px; margin-left:0.5em; grid-template-columns: 1fr 1fr; align-items: center; }
-    .bzgf-node[data-nodetype="wadder"] .title{ background: #090; }
-    .bzgf-node[data-nodetype="wadder"] .port[data-id="inp1"] { top:51px; }
-    .bzgf-node[data-nodetype="wadder"] .port[data-id="inp2"] { top:75px; }
-    .bzgf-node[data-nodetype="wadder"] .port[data-id="inp3"] { top:99px; }
-    .bzgf-node[data-nodetype="wadder"] .port[data-id="inp4"] { top:123px; }
-    .bzgf-node[data-nodetype="wadder"] .port[data-id="inp5"] { top:147px; }
-        
-    .bzgf-node[data-nodetype="factor"]{
-        background: #DDF;
-        border-color: #009;
-    }
-    .bzgf-node[data-nodetype="factor"] .title{ background: #009; }
-
-    .bzgf-node[data-nodetype="multiplier"]{
-        background: #DDF;
-        border-color: #009;
-        height:110px
-    }
-    .bzgf-node[data-nodetype="multiplier"] .body{
-        font-size:40px;
-        font-weight: bold;
-        align-items: center;
-        display: flex;
-        justify-content: center;
-        margin-top: 1em;
-    }
-    .bzgf-node[data-nodetype="multiplier"] .title{ background: #009; }
-    .bzgf-node[data-nodetype="multiplier"] .port[data-id="inp1"] { top:37px; }
-    .bzgf-node[data-nodetype="multiplier"] .port[data-id="inp2"] { top:63px; }
-    .bzgf-node[data-nodetype="multiplier"] .port[data-id="inp3"] { top:89px; }
-    
-    .bzgf-node[data-nodetype="input"],
-    .bzgf-node[data-nodetype="console"]{
-        background: #CCC;
-        border-color: #555;
-    }
-    .bzgf-node[data-nodetype="input"] .title,
-    .bzgf-node[data-nodetype="console"] .title{ background: #555; }
-
-    .bzgf-node[data-nodetype="refnodein"], .bzgf-node[data-nodetype="refnodeout"] {
-        width:3em;
-        height:3em;
-        padding: 2px;
-    }
-    .bzgf-node[data-nodetype="refnodein"] .body, .bzgf-node[data-nodetype="refnodeout"] .body{ 
-        border-radius: 50%;
-        width: 3em;
-        height: 3em;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-    .bzgf-node[data-nodetype="refnodein"] .body{ background: #0F0; }
-    .bzgf-node[data-nodetype="refnodeout"] .body{ background: #FF0; }
-
-    .bzgf-wire{ stroke: #0AF; stroke-width: 2; }
-</style>
-
-<template>
-    <div class="bzgf-node" data-nodetype="inc">
-        <div class="title">Fixed Increment</div>
-        <div class="port" data-type="in" data-id="inp1" data-direction="w"></div>
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        <div class="body">
-            <label>Increment:</label><input name="incvalue" type="text" value="1">
-        </div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="factor">
-        <div class="title">Fixed factor</div>
-        <div class="port" data-type="in" data-id="inp1" data-direction="w"></div>
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        <div class="body">
-            <label>Factor:</label><input name="factvalue" type="text" value="0.5">
-        </div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="wadder">
-        <div class="title">Adder</div>
-        <div class="port" data-type="in" data-id="inp1" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="inp2" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="inp3" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="inp4" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="inp5" data-direction="w"></div>
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        <div class="body">
-            <div>
-                <div>x <input type="text" name="weight1" value="1"></div>
-                <div>x <input type="text" name="weight2" value="1"></div>
-                <div>x <input type="text" name="weight3" value="1"></div>
-                <div>x <input type="text" name="weight4" value="1"></div>
-                <div>x <input type="text" name="weight5" value="1"></div>
-            </div>
-            <div style="font-size:40px;font-weight: bold;transform: translateY(-50%);">&sum;</div>
-        </div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="multiplier">
-        <div class="title">Multiply</div>
-        <div class="port" data-type="in" data-id="inp1" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="inp2" data-direction="w"></div>
-        <div class="port" data-type="in" data-id="inp3" data-direction="w"></div>
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        <div class="body">x</div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="console">
-        <div class="title">Console</div>
-        <div class="port" data-type="in" data-id="inp1" data-direction="w"></div>
-        <div class="body"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="input">
-        <div class="title">input</div>
-        <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        <div class="body">
-            <label>Value:</label><input name="value" type="text" value="1">
-        </div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="refnodein">
-            <div class="body">{parentport}</div>
-            <div class="port" data-type="out" data-id="out1" data-direction="e"></div>
-        </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="refnodeout">
-        <div class="body">{parentport}</div>
-        <div class="port" data-type="in" data-id="in1" data-direction="w"></div>
-    </div>
-</template>
\ No newline at end of file
diff --git a/app/assets/html/bzGraflow/nodesTest2.html b/app/assets/html/bzGraflow/nodesTest2.html
deleted file mode 100644
index 5e59449..0000000
--- a/app/assets/html/bzGraflow/nodesTest2.html
+++ /dev/null
@@ -1,237 +0,0 @@
-<style>
-    .bzgf-node {
-        font-family: Arial, Helvetica, sans-serif;
-        border-width:2px;
-        border-style: solid;
-        border-radius: 6px;
-        width: 160px;
-        height: 80px;
-        color: black;
-        text-align: center;
-        position: absolute;
-        padding: .5em;
-        background: black;
-    }    
-    
-    .bzgf-node .text {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translateX(-50%) translateY(-50%);
-        width: 100%;
-        height: 2em;
-        color: white;
-        transform: translateX(-50%), translateY(-50%);
-    }
-
-    .bzgf-node .port{
-        position: absolute;
-        height: 6px;
-        width: 6px;
-        background: #FFF; 
-        z-index: 99;
-        opacity: 0.3;
-    }
-
-    .bzgf-node [data-direction="w"]{ left: -7px; top: 50%; transform: translateY(-50%);}
-    .bzgf-node [data-direction="e"]{ right: -7px; top: 50%; transform: translateY(-50%);}
-    .bzgf-node [data-direction="n"]{ top: -7px; left: 50%; transform: translateX(-50%);}
-    .bzgf-node [data-direction="s"]{ bottom: -7px; left: 50%; transform: translateX(-50%);}
-
-    .bzgf-node[data-nodetype="start"],
-    .bzgf-node[data-nodetype="end"]{
-        border: 1px solid white;
-        width: 100px;
-        height: 30px;
-        border-radius: 50%;
-    }
-    .bzgf-node[data-nodetype="start"] .text,
-    .bzgf-node[data-nodetype="end"] .text{ width: 80%; }
-
-    .bzgf-node[data-nodetype="condition"]{
-        border: none;
-        width: 100px;
-        height: 100px;
-
-    }
-    .bzgf-node[data-nodetype="condition"] .frame{
-        border: 1px solid white;
-        transform: rotate(-45deg) scale(0.7071);
-        position: absolute;
-        inset: 0;
-    }
-    .bzgf-node[data-nodetype="condition"] .port[data-direction="w"]{ left: -5px; }
-    .bzgf-node[data-nodetype="condition"] [data-direction="e"]{ right: -5px; }
-    .bzgf-node[data-nodetype="condition"] [data-direction="n"]{ top: -5px; }
-    .bzgf-node[data-nodetype="condition"] [data-direction="s"]{ bottom: -5px; }
-
-    .bzgf-node[data-nodetype="process"]{
-            border: 1px solid white;
-            width: 150px;
-            height: 70px;
-            padding: 0;
-    }
-    .bzgf-node[data-nodetype="process"] .text{ width: 80%; }    
-    .bzgf-node[data-nodetype="process"] .dbline{
-            border: 1px solid white;
-            width: 75%;
-            height: 100%;
-            position: absolute;
-            top: -1px;
-            left: 10%;
-    }
-
-    .bzgf-node[data-nodetype="database"]{
-        border: 1px solid white;
-        width: 100px;
-        height: 100px;
-        isolation: isolate;
-    }
-    .bzgf-node[data-nodetype="database"] .top{
-        z-index: 2;
-        height: 20%;
-        border: 1px solid white;
-        border-radius: 50%;
-        position: absolute;
-        top: -10%;
-        left: 0;
-        width: 100%;
-        background: black;
-    }
-    .bzgf-node[data-nodetype="database"] .text{
-        background: black;
-        width: 87%;
-        z-index: 1;
-    }
-    .bzgf-node[data-nodetype="database"] .bottom{
-        z-index: 0;
-        height: 20%;
-        border: 1px solid white;
-        border-radius: 50%;
-        position: absolute;
-        bottom: -10%;
-        left: 0;
-        width: 99%;
-        background: black;
-        clip-path: polygon( 0% 110%, 100% 110%, 100% 50%, 0% 50%);
-    }
-    .bzgf-node[data-nodetype="database"] [data-direction="n"]{ top: -17px; }
-    .bzgf-node[data-nodetype="database"] [data-direction="s"]{ bottom: -17px; }
-
-    .bzgf-node[data-nodetype="preparation"]{
-        width: 150px;
-        height: 80px;
-        padding: 0;
-        border: none;
-    }
-    .bzgf-node[data-nodetype="preparation"] .text{ width: 85%; }
-    .bzgf-node[data-nodetype="preparation"] .outerframe{
-        width: 100%;
-        height: 100%;
-        position: absolute;
-        background: white;
-        border: none;
-        padding: 0;
-        place-items: center;
-        clip-path: polygon(
-            10% 0%,
-            90% 0%,
-            100% 50%,
-            90% 100%,
-            10% 100%,
-            0% 50%
-        );
-    }
-    .bzgf-node[data-nodetype="preparation"] .innerframe{
-        width: calc(100% - 2px);
-        height: calc(100% - 2px);
-        position: absolute;
-        top: 1px;
-        left: 1px;
-        background: black;
-        clip-path: inherit;
-        display: grid;
-        place-items: center;
-        color: white;
-    }
-    .bzgf-wire{ stroke: #FF0; stroke-width: 2; }
-</style>
-
-<svg style="display:none" aria-hidden="true">
-    <template id="svg-arrows">
-        <defs>
-            <marker id="arrow"
-                viewBox="0 0 10 10"
-                refX="10"
-                refY="5"
-                markerWidth="10"
-                markerHeight="10"
-                orient="auto-start-reverse"
-                markerUnits="userSpaceOnUse">
-                <path d="M0,0 L10,5 L0,10 Z" fill="#FF0"/>
-            </marker>
-        </defs>
-    </template>
-</svg>
-
-<template>
-    <div class="bzgf-node" data-nodetype="start">
-        <div class="text">{text}</div>
-        <div class="port" data-id="out1" data-direction="s"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="end">
-        <div class="text">{text}</div>
-        <div class="port" data-id="inp1" data-direction="n"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="condition">
-        <div class="frame"></div>
-        <div class="text">{text}</div>
-        <div class="port" data-id="inp1" data-direction="n"></div>
-        <div class="port" data-id="out1" data-direction="w"></div>
-        <div class="port" data-id="out2" data-direction="s"></div>
-        <div class="port" data-id="out3" data-direction="e"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="process">
-        <div class="dbline"></div>
-        <div class="text">{text}</div>
-        <div class="port" data-id="inout1" data-direction="n"></div>
-        <div class="port" data-id="inout2" data-direction="s"></div>
-        <div class="port" data-id="inout3" data-direction="w"></div>
-        <div class="port" data-id="inout4" data-direction="e"></div>        
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="database">
-        <div class="top"></div>
-        <div class="bottom"></div>
-        <div class="text">{text}</div>
-        <div class="port" data-id="inout1" data-direction="n"></div>
-        <div class="port" data-id="inout2" data-direction="s"></div>
-        <div class="port" data-id="inout3" data-direction="w"></div>
-        <div class="port" data-id="inout4" data-direction="e"></div>
-    </div>
-</template>
-
-<template>
-    <div class="bzgf-node" data-nodetype="preparation">
-        <div class="outerframe">
-            <div class="innerframe">
-                <div class="text">{text}</div>
-            </div>
-        </div>
-        <div class="port" data-id="inp1" data-direction="n"></div>
-        <div class="port" data-id="out1" data-direction="s"></div>
-        <div class="port" data-id="inout1" data-direction="w"></div>
-        <div class="port" data-id="inout2" data-direction="e"></div>
-    </div>
-</template>
\ No newline at end of file
diff --git a/app/assets/html/test.html b/app/assets/html/test.html
deleted file mode 100644
index d6f5073..0000000
--- a/app/assets/html/test.html
+++ /dev/null
@@ -1,21 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-	</head>
-
-	<body>
-        <ul>
-            <li><a target="test1" href="./test1.html">test1 (P42 graph + ISOLATED + 2 depths subflows)</a></li>
-            <li><a target="test2" href="./test2.html">test2 (organigram) + ISOLATED</a></li>
-            <li><a target="test3" href="./test3.html">test3 (EIC simple + subflow + NON-ISOLATED)</a></li>
-            <li><a target="test4" href="./test4.html">test4 (EIC-ICMP + NON-ISOLATED + AUTOFIT with ResizeObserver on container)</a></li>
-            <li><a target="test4.5" href="./test4.5.html">test4.5 (EIC-ICMP + NON-ISOLATED + single-port, ortho, oriented, aligned top)</a></li>
-            <li><a target="test5" href="./test5.html">test5 (P42 graph + ISOLATED + EDITABLE)</a></li>
-            <li><a target="test6" href="./test6.html">test6 (16 port combinations)</a></li>
-
-        </ul>
-	</body>
-</html>
diff --git a/app/assets/html/test1.html b/app/assets/html/test1.html
deleted file mode 100644
index 0af2a24..0000000
--- a/app/assets/html/test1.html
+++ /dev/null
@@ -1,99 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:99999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.compunet{ grid-column: 1 / -1; width: 100vw; height: 60vh; background:black; }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw1 = document.querySelector('bz-graflow.compunet')
-                grflw1.addEventListener('subflowLoaded',
-                    (evt) => { grflw1 = evt.detail.subflow }
-                )
-                grflw1.addEventListener('subflowExited',
-                    (evt) => { grflw1 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace1H"]').addEventListener('click',
-                    (evt) => { grflw1.autoPlace('horizontal', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace1V"]').addEventListener('click',
-                    (evt) => { grflw1.autoPlace('vertical', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
-                )
-                document.querySelector('input[data-id="compunet"]').addEventListener('change',
-                    (evt) => { grflw1.setAttribute('tension', evt.target.value); grflw1.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw1.setAttribute('wiretype', evt.target.value); grflw1.refresh() }
-                )
-            })
-        </script>
-	</head>
-
-	<body>
-        <bz-graflow class="compunet" flow="/app/assets/json/bzGraflow/testFlow1.1.json" tension="60" isolated>
-            <div class="demooptions"> <!-- just for demo purposes -->
-                <button data-trigger="onAutoplace1H">Auto-place Horizontal</button>
-                <button data-trigger="onAutoplace1V">Auto-place Vertical</button>
-                <select name="align" data-id="compunet">
-                    <option value="center">Center</option>
-                    <option value="first">First</option>
-                    <option value="last">Last</option>
-                    <option value="parent">Parent</option>
-                </select>
-                <select name="wiretype">
-                    <option value="ortho">Ortho</option>
-                    <option value="straight">Straight</option>
-                    <option value="bezier" selected>Bezier</option>
-                </select>                
-                <div class-"cols-2"=""><label>tension</label><input data-id="compunet" type="number" size="2" value="60"></div>
-            </div>
-        </bz-graflow>
-
-	</body>
-</html>
diff --git a/app/assets/html/test2.html b/app/assets/html/test2.html
deleted file mode 100644
index 1efde5e..0000000
--- a/app/assets/html/test2.html
+++ /dev/null
@@ -1,100 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:99999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.organi{ width: 40vw; height: 100vh; background:black; }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw3 = document.querySelector('bz-graflow.organi')
-                grflw3.addEventListener('subflowLoaded',
-                    (evt) => { grflw3 = evt.detail.subflow }
-                )
-                grflw3.addEventListener('subflowExited',
-                    (evt) => { grflw3 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace3H"]').addEventListener('click',
-                    (evt) => { grflw3.autoPlace('horizontal', 80, 80, 1000, document.querySelector('[data-id="organi"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace3V"]').addEventListener('click',
-                    (evt) => { grflw3.autoPlace('vertical', 80, 30, 1000, document.querySelector('[data-id="organi"]').value) }
-                )                
-                document.querySelector('input[data-id="organi"]').addEventListener('change',
-                    (evt) => { grflw3.setAttribute('tension', evt.target.value); grflw3.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw3.setAttribute('wiretype', evt.target.value); grflw3.refresh() }
-                )
-            })
-        </script>
-	</head>
-
-	<body>
-        <bz-graflow class="organi" flow="/app/assets/json/bzGraflow/testFlow2.json" tension="60" isolated>
-            <div class="demooptions">
-                <button data-trigger="onAutoplace3H">Auto-place Horizontal</button> 
-                <button data-trigger="onAutoplace3V">Auto-place Vertical</button>
-                <select name="align" data-id="organi">
-                    <option value="center">Center</option>
-                    <option value="first">First</option>
-                    <option value="last">Last</option>
-                    <option value="parent">Parent</option>
-                </select>
-                <select name="wiretype">
-                    <option value="ortho">Ortho</option>
-                    <option value="straight">Straight</option>
-                    <option value="bezier" selected>Bezier</option>
-                    <option value="parent">Parent</option>
-                </select>                
-                <div class-"cols-2"=""><label>tension</label><input data-id="organi" type="number" size="2" value="60"></div>
-            </div>
-        </bz-graflow>
-
-	</body>
-</html>
diff --git a/app/assets/html/test3.html b/app/assets/html/test3.html
deleted file mode 100644
index 24f9c59..0000000
--- a/app/assets/html/test3.html
+++ /dev/null
@@ -1,98 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:99999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.eic{ grid-column: 1 / -1; width: 80vw; height: 60vh; background: var(--eicui-base-color-grey-10); }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw2 = document.querySelector('bz-graflow.eic')
-                grflw2.addEventListener('subflowLoaded',
-                    (evt) => { grflw2 = evt.detail.subflow }
-                )
-                grflw2.addEventListener('subflowExited',
-                    (evt) => { grflw2 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace2H"]').addEventListener('click',
-                    (evt) => { grflw2.autoPlace('horizontal', 100, 30, 1000, document.querySelector('[data-id="eic"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace2V"]').addEventListener('click',
-                    (evt) => { grflw2.autoPlace('vertical', 80, 80, 1000, document.querySelector('[data-id="eic"]').value) }
-                )         
-                document.querySelector('input[data-id="eic"]').addEventListener('change',
-                    (evt) => { grflw2.setAttribute('tension', evt.target.value); grflw2.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw2.setAttribute('wiretype', evt.target.value); grflw2.refresh() }
-                )
-            })
-        </script>
-	</head>
-
-	<body>
-        <bz-graflow class="eic" flow="/app/assets/json/bzGraflow/testFlowEic.json" tension="60">
-            <div class="demooptions"> <!-- just for demo purposes -->
-                <button data-trigger="onAutoplace2H">Auto-place Horizontal</button>
-                <button data-trigger="onAutoplace2V">Auto-place Vertical</button>
-                <select name="align" data-id="eic">
-                    <option value="center">Center</option>
-                    <option value="first">First</option>
-                    <option value="last">Last</option>
-                    <option value="parent">Parent</option>
-                </select>
-                <select name="wiretype">
-                    <option value="ortho">Ortho</option>
-                    <option value="straight">Straight</option>
-                    <option value="bezier" selected>Bezier</option>
-                </select>                
-                <div class-"cols-2"=""><label>tension</label><input data-id="eic" type="number" size="2" value="60"></div>
-            </div>
-        </bz-graflow>
-	</body>
-</html>
diff --git a/app/assets/html/test4.5.html b/app/assets/html/test4.5.html
deleted file mode 100644
index adb9835..0000000
--- a/app/assets/html/test4.5.html
+++ /dev/null
@@ -1,98 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:999999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.icmp{ grid-column: 1 / -1; width: 100vw; height: 80vh; background: var(--eicui-base-color-grey-10); }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw4 = document.querySelector('bz-graflow.icmp')
-                grflw4.addEventListener('subflowLoaded',
-                    (evt) => { grflw4 = evt.detail.subflow }
-                )
-                grflw4.addEventListener('subflowExited',
-                    (evt) => { grflw4 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace4H"]').addEventListener('click',
-                    (evt) => { grflw4.autoPlace('horizontal', 100, 30, 1000, document.querySelector('[data-id="icmp"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace4V"]').addEventListener('click',
-                    (evt) => { grflw4.autoPlace('vertical', 80, 80, 1000, document.querySelector('[data-id="icmp"]').value) }
-                )
-                document.querySelector('input[data-id="icmp"]').addEventListener('change',
-                    (evt) => { grflw4.setAttribute('tension', evt.target.value); grflw4.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw4.setAttribute('wiretype', evt.target.value); grflw4.refresh() }
-                )                
-            })
-        </script>
-	</head>
-
-	<body>
-        <bz-graflow class="icmp" flow="/app/assets/json/bzGraflow/testFlowICMP2.json" tension="20" align="first" wiretype="ortho" gapx="100" gapy="30">
-            <div class="demooptions"> <!-- just for demo purposes -->
-                <button data-trigger="onAutoplace4H">Auto-place Horizontal</button>
-                <button data-trigger="onAutoplace4V">Auto-place Vertical</button>
-                <select name="align" data-id="icmp">
-                    <option value="center">Center</option>
-                    <option value="first" selected>First</option>
-                    <option value="last">Last</option>
-                    <option value="parent">Parent</option>
-                </select>
-                <select name="wiretype">
-                    <option value="ortho" selected>Ortho</option>
-                    <option value="straight">Straight</option>
-                    <option value="bezier">Bezier</option>
-                </select>                
-                <div class-"cols-2"=""><label>tension</label><input data-id="icmp" type="number" size="2" value="20"></div>
-            </div>
-        </bz-graflow>
-	</body>
-</html>
diff --git a/app/assets/html/test4.html b/app/assets/html/test4.html
deleted file mode 100644
index ee7fa58..0000000
--- a/app/assets/html/test4.html
+++ /dev/null
@@ -1,120 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:999999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.icmp{ grid-column: 1 / -1; width: 100vw; height: 80vh; background: var(--eicui-base-color-grey-10); }
-            .container {
-                resize: both;
-                overflow: auto;   /* required in practice */
-                min-width: 800px;
-                min-height: 300px;
-                border: 1px solid #999;
-                padding: 1rem;
-            }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw4 = document.querySelector('bz-graflow.icmp')
-                grflw4.addEventListener('subflowLoaded',
-                    (evt) => { grflw4 = evt.detail.subflow }
-                )
-                grflw4.addEventListener('subflowExited',
-                    (evt) => { grflw4 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace4H"]').addEventListener('click',
-                    (evt) => { grflw4.autoPlace('horizontal', 100, 30, 1000, document.querySelector('[data-id="icmp"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace4V"]').addEventListener('click',
-                    (evt) => { grflw4.autoPlace('vertical', 80, 80, 1000, document.querySelector('[data-id="icmp"]').value) }
-                )
-                document.querySelector('input[data-id="icmp"]').addEventListener('change',
-                    (evt) => { grflw4.setAttribute('tension', evt.target.value); grflw4.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw4.setAttribute('wiretype', evt.target.value); grflw4.refresh() }
-                )
-                
-                const el = document.querySelector('.container')
-                let timer = null // debounce
-                const ro = new ResizeObserver(([entry]) => {
-                    clearTimeout(timer)
-                    timer = setTimeout(() => {
-                        const grfl = entry.target.querySelector('bz-graflow')
-                        grfl.autofit()
-                    }, 200)
-                })
-                
-                ro.observe(el)
-            })
-        </script>
-	</head>
-
-	<body>
-        <div class="container" style="padding:0;"">
-            <bz-graflow class="icmp" flow="/app/assets/json/bzGraflow/testFlowICMP.json" tension="60">
-                <div class="demooptions">
-                    <button data-trigger="onAutoplace4H">Auto-place Horizontal</button>
-                    <button data-trigger="onAutoplace4V">Auto-place Vertical</button>
-                    <select name="align" data-id="icmp">
-                        <option value="center">Center</option>
-                        <option value="first">First</option>
-                        <option value="last">Last</option>
-                        <option value="parent">Parent</option>
-                    </select>
-                    <select name="wiretype">
-                        <option value="ortho">Ortho</option>
-                        <option value="straight">Straight</option>
-                        <option value="bezier" selected>Bezier</option>
-                    </select>                
-                    <div class-"cols-2"=""><label>tension</label><input data-id="icmp" type="number" size="2" value="60"></div>
-                </div>
-            </bz-graflow>
-        </div>
-	</body>
-</html>
diff --git a/app/assets/html/test5.html b/app/assets/html/test5.html
deleted file mode 100644
index 85fb9be..0000000
--- a/app/assets/html/test5.html
+++ /dev/null
@@ -1,99 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:999999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.compunet{ grid-column: 1 / -1; width: 100vw; height: 60vh; background:black; }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw1 = document.querySelector('bz-graflow.compunet')
-                grflw1.addEventListener('subflowLoaded',
-                    (evt) => { grflw1 = evt.detail.subflow }
-                )
-                grflw1.addEventListener('subflowExited',
-                    (evt) => { grflw1 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace1H"]').addEventListener('click',
-                    (evt) => { grflw1.autoPlace('horizontal', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace1V"]').addEventListener('click',
-                    (evt) => { grflw1.autoPlace('vertical', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
-                )
-                document.querySelector('input[data-id="compunet"]').addEventListener('change',
-                    (evt) => { grflw1.setAttribute('tension', evt.target.value); grflw1.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw1.setAttribute('wiretype', evt.target.value); grflw1.refresh() }
-                )
-            })
-        </script>
-	</head>
-
-	<body>
-        <bz-graflow class="compunet" flow="/app/assets/json/bzGraflow/testFlow1.json" tension="60" isolated edit="nodesmove,wires,dropnodes" >
-            <div class="demooptions"> <!-- just for demo purposes -->
-                <button data-trigger="onAutoplace1H">Auto-place Horizontal</button>
-                <button data-trigger="onAutoplace1V">Auto-place Vertical</button>
-                <select name="align" data-id="compunet">
-                    <option value="center">Center</option>
-                    <option value="first">First</option>
-                    <option value="last">Last</option>
-                    <option value="parent">Parent</option>
-                </select>
-                <select name="wiretype">
-                    <option value="ortho">Ortho</option>
-                    <option value="straight">Straight</option>
-                    <option value="bezier" selected>Bezier</option>
-                </select>
-                <div class-"cols-2"=""><label>tension</label><input data-id="compunet" type="number" size="2" value="60"></div>
-            </div>
-        </bz-graflow>
-
-	</body>
-</html>
diff --git a/app/assets/html/test6.html b/app/assets/html/test6.html
deleted file mode 100644
index 60dfa9c..0000000
--- a/app/assets/html/test6.html
+++ /dev/null
@@ -1,101 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>graflow</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="/app/thirdparty/eicui/eicui-2.0.css">
-        <link type="text/css" rel="stylesheet" href="../../thirdparty/buildoz/buildoz.css">
-        <script src="../../thirdparty/buildoz/buildoz.js"></script>      
-        <script src="../../thirdparty/buildoz/bzGraflow.js"></script>
-        <style>
-            @font-face { /*FF does not indirectly load if inside a shawdow-dom */
-                font-family: 'glyphs';
-                src:  url('/app/assets/styles/fonts/glyphs.eot');
-                src:  url('/app/assets/styles/fonts/glyphs.eot') format('embedded-opentype'),
-                    url('/app/assets/styles/fonts/glyphs.ttf') format('truetype'),
-                    url('/app/assets/styles/fonts/glyphs.woff') format('woff'),
-                    url('/app/assets/styles/fonts/glyphs.svg') format('svg');
-                font-weight: normal;
-                font-style: normal;
-                font-display: block;
-            }
-            body{
-                display: grid;
-                grid-gap: 5px;
-                background:#888; 
-                font-size: 16px;
-            }
-            .demooptions{
-                padding: 2px;
-                position: absolute;
-                top: 2px;
-                right: 2px;
-                width: 10em;
-                background: #FFFB;
-                border-radius: 5px;
-                text-align: center;
-                z-index:999999;
-                font-size: .7em;
-                border: 1px solid #999;
-            }
-            .demooptions button{
-                text-transform: none;
-                margin: 2px;
-                font-size: 1em;
-            }            
-            bz-graflow{
-                overflow: scroll;
-                border: 2px solid black;
-            }
-            bz-graflow.compunet{ grid-column: 1 / -1; width: 100vw; height: 100vh; background:black; }
-          </style>
-        <script>
-            window.addEventListener('load',()=>{
-                let grflw1 = document.querySelector('bz-graflow.compunet')
-                grflw1.setAttribute('tension', document.querySelector('input[data-id="compunet"]').value)
-                grflw1.setAttribute('wiretype', document.querySelector('select[name="wiretype"]').value)
-                grflw1.addEventListener('subflowLoaded',
-                    (evt) => { grflw1 = evt.detail.subflow }
-                )
-                grflw1.addEventListener('subflowExited',
-                    (evt) => { grflw1 = evt.target }
-                )
-                document.querySelector('[data-trigger="onAutoplace1H"]').addEventListener('click',
-                    (evt) => { grflw1.autoPlace('horizontal', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
-                )
-                document.querySelector('[data-trigger="onAutoplace1V"]').addEventListener('click',
-                    (evt) => { grflw1.autoPlace('vertical', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
-                )
-                document.querySelector('input[data-id="compunet"]').addEventListener('change',
-                    (evt) => { grflw1.setAttribute('tension', evt.target.value); grflw1.refresh() }
-                )
-                document.querySelector('select[name="wiretype"]').addEventListener('change',
-                    (evt) => { grflw1.setAttribute('wiretype', evt.target.value); grflw1.refresh() }
-                )
-            })
-        </script>
-	</head>
-
-	<body>
-        <bz-graflow class="compunet" flow="/app/assets/json/bzGraflow/testFlow16ports.json" tension="60" isolated edit="nodesmove" >
-            <div class="demooptions"> <!-- just for demo purposes -->
-                <button data-trigger="onAutoplace1H">Auto-place Horizontal</button>
-                <button data-trigger="onAutoplace1V">Auto-place Vertical</button>
-                <select name="align" data-id="compunet">
-                    <option value="center">Center</option>
-                    <option value="first">First</option>
-                    <option value="last">Last</option>
-                    <option value="parent">Parent</option>
-                </select>
-                <select name="wiretype">
-                    <option value="ortho">Ortho</option>
-                    <option value="straight">Straight</option>
-                    <option value="bezier" selected>Bezier</option>
-                </select>
-                <div class-"cols-2"=""><label>tension</label><input data-id="compunet" type="number" size="2" value="20"></div>
-            </div>
-        </bz-graflow>
-
-	</body>
-</html>
diff --git a/app/assets/json/bzGraflow/testFlow1.1.json b/app/assets/json/bzGraflow/testFlow1.1.json
deleted file mode 100644
index eb8c1fe..0000000
--- a/app/assets/json/bzGraflow/testFlow1.1.json
+++ /dev/null
@@ -1,65 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodesTest1.html",
-    "flow": {
-        "nodes":[
-            {   "nodeType": "inc",
-                "id": "aze",
-                "coords": { "x": 220, "y": 120}
-            },
-            {   "nodeType": "inc",
-                "subflow": { 
-                    "url": "/app/assets/json/bzGraflow/testFlowEic.json", 
-                    "portLinks": [
-                        {   "refNodeType": "refnodein", "refnodePort": "out1",
-                            "parentPort": "in1", 
-                            "subflowNode":"aze2", "subflowPort": "in1",
-                            "direction": "in"
-                        },
-                        {   "refNodeType": "refnodeout", "refnodePort": "in1", 
-                            "parentPort": "out1", 
-                            "subflowNode":"aze5", "subflowPort": "out1",
-                            "direction": "out" 
-                        }
-                    ]
-                },
-                "id": "aze2",
-                "coords": { "x": 220, "y": 10}
-            },
-            {   "nodeType": "factor",
-                "id": "qsd",
-                "coords": { "x": 470, "y": 170}
-            }, 
-            {   "nodeType": "factor",
-                "id": "qsd2",
-                "coords": { "x": 470, "y": 50}
-            },           
-            {   "nodeType": "wadder",
-                "id": "wcx",
-                "coords": { "x": 720, "y": 50}
-            },
-            {   "nodeType": "multiplier",
-                "id": "ert",
-                "coords": { "x": 550, "y": 350}
-            },
-            {   "nodeType": "input",
-                "id": "0000",
-                "coords": { "x": 20, "y": 350}
-            },
-            {   "nodeType": "console",
-                "id": "9999",
-                "coords": { "x": 800, "y": 350}
-            }
-        ],
-        "links": [
-            { "from": ["0000", "out1"], "to": ["aze", "inp1"] },
-            { "from": ["aze2", "out1"], "to": ["qsd2", "inp1"] },
-            { "from": ["aze", "out1"], "to": ["qsd", "inp1"] },
-            { "from": ["qsd2", "out1"], "to": ["ert", "inp2"] },
-            { "from": ["0000", "out1"], "to": ["aze2", "inp1"] },
-            { "from": ["qsd2", "out1"], "to": ["wcx", "inp2"] },
-            { "from": ["wcx", "out1"], "to": ["ert", "inp1"] },
-            { "from": ["qsd", "out1"], "to": ["wcx", "inp1"] },
-            { "from": ["ert", "out1"], "to": ["9999", "inp1"] }
-        ]
-    }
-}
\ No newline at end of file
diff --git a/app/assets/json/bzGraflow/testFlow1.json b/app/assets/json/bzGraflow/testFlow1.json
deleted file mode 100644
index 8c8968b..0000000
--- a/app/assets/json/bzGraflow/testFlow1.json
+++ /dev/null
@@ -1,50 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodesTest1.html",
-    "flow": {
-        "nodes":[
-            {   "nodeType": "inc",
-                "id": "aze",
-                "coords": { "x": 220, "y": 120}
-            },
-            {   "nodeType": "inc",
-                "id": "aze2",
-                "coords": { "x": 220, "y": 10}
-            },
-            {   "nodeType": "factor",
-                "id": "qsd",
-                "coords": { "x": 470, "y": 170}
-            }, 
-            {   "nodeType": "factor",
-                "id": "qsd2",
-                "coords": { "x": 470, "y": 50}
-            },           
-            {   "nodeType": "wadder",
-                "id": "wcx",
-                "coords": { "x": 720, "y": 50}
-            },
-            {   "nodeType": "multiplier",
-                "id": "ert",
-                "coords": { "x": 550, "y": 350}
-            },
-            {   "nodeType": "input",
-                "id": "0000",
-                "coords": { "x": 20, "y": 350}
-            },
-            {   "nodeType": "console",
-                "id": "9999",
-                "coords": { "x": 800, "y": 350}
-            }
-        ],
-        "links": [
-            { "from": ["0000", "out1"], "to": ["aze", "inp1"] },
-            { "from": ["aze2", "out1"], "to": ["qsd2", "inp1"] },
-            { "from": ["aze", "out1"], "to": ["qsd", "inp1"] },
-            { "from": ["qsd2", "out1"], "to": ["ert", "inp2"] },
-            { "from": ["0000", "out1"], "to": ["aze2", "inp1"] },
-            { "from": ["qsd2", "out1"], "to": ["wcx", "inp2"] },
-            { "from": ["wcx", "out1"], "to": ["ert", "inp1"] },
-            { "from": ["qsd", "out1"], "to": ["wcx", "inp1"] },
-            { "from": ["ert", "out1"], "to": ["9999", "inp1"] }
-        ]
-    }
-}
\ No newline at end of file
diff --git a/app/assets/json/bzGraflow/testFlow16ports.json b/app/assets/json/bzGraflow/testFlow16ports.json
deleted file mode 100644
index 568b1b0..0000000
--- a/app/assets/json/bzGraflow/testFlow16ports.json
+++ /dev/null
@@ -1,271 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodes16ports.html",
-    "flow": {
-        "nodes": [
-            {
-                "nodeType": "square",
-                "id": "p1center",
-                "coords": {
-                    "x": 300,
-                    "y": 200
-                },
-                "markup": {
-                    "title": "Center",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p1west",
-                "coords": {
-                    "x": 200,
-                    "y": 200
-                },
-                "markup": {
-                    "title": "West",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p1north",
-                "coords": {
-                    "x": 300,
-                    "y": 100
-                },
-                "markup": {
-                    "title": "North",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p1east",
-                "coords": {
-                    "x": 400,
-                    "y": 200
-                },
-                "markup": {
-                    "title": "East",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p1south",
-                "coords": {
-                    "x": 300,
-                    "y": 300
-                },
-                "markup": {
-                    "title": "South",
-                    "subtitle": "."
-                }
-            },
-            
-            {
-                "nodeType": "square",
-                "id": "p2center",
-                "coords": {
-                    "x": 800,
-                    "y": 200
-                },
-                "markup": {
-                    "title": "Center",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p2west",
-                "coords": {
-                    "x": 700,
-                    "y": 200
-                },
-                "markup": {
-                    "title": "West",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p2north",
-                "coords": {
-                    "x": 800,
-                    "y": 100
-                },
-                "markup": {
-                    "title": "North",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p2east",
-                "coords": {
-                    "x": 900,
-                    "y": 200
-                },
-                "markup": {
-                    "title": "East",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p2south",
-                "coords": {
-                    "x": 800,
-                    "y": 300
-                },
-                "markup": {
-                    "title": "South",
-                    "subtitle": "."
-                }
-            },
-
-            {
-                "nodeType": "square",
-                "id": "p3center",
-                "coords": {
-                    "x": 300,
-                    "y": 600
-                },
-                "markup": {
-                    "title": "Center",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p3west",
-                "coords": {
-                    "x": 200,
-                    "y": 600
-                },
-                "markup": {
-                    "title": "West",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p3north",
-                "coords": {
-                    "x": 300,
-                    "y": 500
-                },
-                "markup": {
-                    "title": "North",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p3east",
-                "coords": {
-                    "x": 400,
-                    "y": 600
-                },
-                "markup": {
-                    "title": "East",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p3south",
-                "coords": {
-                    "x": 300,
-                    "y": 700
-                },
-                "markup": {
-                    "title": "South",
-                    "subtitle": "."
-                }
-            },
-
-            {
-                "nodeType": "square",
-                "id": "p4center",
-                "coords": {
-                    "x": 800,
-                    "y": 600
-                },
-                "markup": {
-                    "title": "Center",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p4west",
-                "coords": {
-                    "x": 700,
-                    "y": 600
-                },
-                "markup": {
-                    "title": "West",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p4north",
-                "coords": {
-                    "x": 800,
-                    "y": 500
-                },
-                "markup": {
-                    "title": "North",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p4east",
-                "coords": {
-                    "x": 900,
-                    "y": 600
-                },
-                "markup": {
-                    "title": "East",
-                    "subtitle": "."
-                }
-            },
-            {
-                "nodeType": "square",
-                "id": "p4south",
-                "coords": {
-                    "x": 800,
-                    "y": 700
-                },
-                "markup": {
-                    "title": "South",
-                    "subtitle": "."
-                }
-            }
-        ],
-        "links": [
-            { "from": ["p1center", "s"], "to": ["p1south", "n"] },
-            { "from": ["p1center", "e"], "to": ["p1east", "w"] },
-            { "from": ["p1center", "n"], "to": ["p1north", "s"] },
-            { "from": ["p1center", "w"], "to": ["p1west", "e"] },
-
-            { "from": ["p2center", "s"], "to": ["p2south", "e"] },
-            { "from": ["p2center", "e"], "to": ["p2east", "n"] },
-            { "from": ["p2center", "n"], "to": ["p2north", "w"] },
-            { "from": ["p2center", "w"], "to": ["p2west", "s"] },
-
-            { "from": ["p3center", "s"], "to": ["p3south", "s"] },
-            { "from": ["p3center", "e"], "to": ["p3east", "e"] },
-            { "from": ["p3center", "n"], "to": ["p3north", "n"] },
-            { "from": ["p3center", "w"], "to": ["p3west", "w"] },
-
-            { "from": ["p4center", "s"], "to": ["p4south", "w"] },
-            { "from": ["p4center", "e"], "to": ["p4east", "s"] },
-            { "from": ["p4center", "n"], "to": ["p4north", "e"] },
-            { "from": ["p4center", "w"], "to": ["p4west", "n"] }
-        ]
-    }
-}
\ No newline at end of file
diff --git a/app/assets/json/bzGraflow/testFlow2.json b/app/assets/json/bzGraflow/testFlow2.json
deleted file mode 100644
index f086855..0000000
--- a/app/assets/json/bzGraflow/testFlow2.json
+++ /dev/null
@@ -1,47 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodesTest2.html",
-    "flow": {
-        "nodes":[
-            {   "nodeType": "process",
-                "id": "aze2",
-                "xcoords": { "x": 220, "y": 120},
-                "markup": { "text": "x = alph - 1" }
-            },
-            {   "nodeType": "condition",
-                "id": "qsd",
-                "xcoords": { "x": 250, "y": 270},
-                "markup": { "text": "x > 0" }
-            }, 
-            {   "nodeType": "preparation",
-                "id": "qsd2",
-                "xcoords": { "x": 250, "y": 470},
-                "markup": { "text": "prepare SQL" }
-            },           
-            {   "nodeType": "database",
-                "id": "wcx",
-                "xcoords": { "x": 500, "y": 450},
-                "markup": { "text": "MySQL<br>Store" }
-            },
-            {   "nodeType": "end",
-                "id": "ert",
-                "xcoords": { "x": 250, "y": 650},
-                "markup": { "text": "End" }
-            },
-            {   "nodeType": "start",
-                "id": "aze",
-                "xcoords": { "x": 220, "y": 20},
-                "markup": { "text": "StartMike" }
-            }            
-        ],
-        "links": [
-            { "from": ["aze", "out1"], "to": ["aze2", "inout1"], "endArrow":true },
-            { "from": ["aze2", "inout2"], "to": ["qsd", "inp1"], "endArrow":true  },
-            { "from": ["qsd", "out1"], "to": ["aze2", "inout3"], "endArrow":true  },
-            { "from": ["qsd", "out2"], "to": ["qsd2", "inp1"], "endArrow":true  },
-            { "from": ["qsd2", "inout2"], "to": ["wcx", "inout1"], "startArrow":true , "endArrow":true  },
-            { "from": ["qsd2", "out1"], "to": ["ert", "inp1"], "endArrow":true  },
-            { "from": ["qsd2", "inout1"], "to": ["qsd2", "inout1"], "endArrow":true  },
-            { "from": ["aze2", "inout4"], "to": ["wcx", "inout1"], "endArrow":true  }
-        ]        
-    }
-}
\ No newline at end of file
diff --git a/app/assets/json/bzGraflow/testFlowEic.json b/app/assets/json/bzGraflow/testFlowEic.json
deleted file mode 100644
index 3f5058c..0000000
--- a/app/assets/json/bzGraflow/testFlowEic.json
+++ /dev/null
@@ -1,74 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodesEIC.html",
-    "flow": {
-        "nodes":[
-            {   "nodeType": "eicBasic",
-                "id": "aze",
-                "ncoords": { "x": 50, "y": 120},
-                "markup": { 
-                    "title": "Build attendees list",
-                    "subtitle": "Build an attendees list to email"
-                },
-                "data": { "a": "a1", "b":"b1"}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "aze2",
-                "ncoords": { "x": 100, "y": 220},
-                "markup": { 
-                    "title": "Select message",
-                    "subtitle": "Select an email template"
-                },
-                "data": { "a": "a2", "b":"b2"}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "aze3",
-                "ncoords": { "x": 150, "y": 320},
-                "markup": { 
-                    "title": "Data mapping",
-                    "subtitle": "Associate content variables with attendees data"
-                },
-                "data": { "a": "a3", "b":"b3"},
-                "subflow": { 
-                    "url": "/app/assets/json/bzGraflow/testFlowICMP.json", 
-                    "portLinks": [
-                        {   "refNodeType": "refnodein", "refnodePort": "out1",
-                            "parentPort": "in1", 
-                            "subflowNode":"cid", "subflowPort": "in3",
-                            "direction": "in"
-                        },
-                        {   "refNodeType": "refnodeout", "refnodePort": "in1", 
-                            "parentPort": "out1", 
-                            "subflowNode":"signature", "subflowPort": "out2",
-                            "direction": "out" 
-                        }
-                    ]
-                }
-            },
-            {   "nodeType": "eicBasic",
-                "id": "aze4",
-                "ncoords": { "x": 150, "y": 320},
-                "markup": { 
-                    "title": "Schedule mailing",
-                    "subtitle": "Choose time to send the mail"
-                },
-                "data": { "a": "a3", "b":"b3"}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "aze5",
-                "ncoords": { "x": 150, "y": 320},
-                "markup": { 
-                    "title": "Stats",
-                    "subtitle": "Access mailing statistics"
-                },
-                "data": { "a": "a3", "b":"b3"}
-            }             
-        ],
-        "links": [
-            { "from": ["aze2", "out1"], "to": ["aze", "in1"] },
-            { "from": ["aze2", "out2"], "to": ["aze3", "in1"] },
-            { "from": ["aze", "out1"], "to": ["aze4", "in1"] },
-            { "from": ["aze3", "out1"], "to": ["aze4", "in2"] },
-            { "from": ["aze4", "out1"], "to": ["aze5", "in1"] }
-        ]
-    }
-}
\ No newline at end of file
diff --git a/app/assets/json/bzGraflow/testFlowICMP.json b/app/assets/json/bzGraflow/testFlowICMP.json
deleted file mode 100644
index bd16d4d..0000000
--- a/app/assets/json/bzGraflow/testFlowICMP.json
+++ /dev/null
@@ -1,150 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodesEIC.html",
-    "flow": {
-        "nodes":[
-            {   "nodeType": "eicBasic",
-                "id": "eval",
-                "markup": { 
-                    "title": "Evaluations",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": { "node": "eval", "nodeId":null}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "gap",
-                "ncoords": { "x": 100, "y": 220},
-                "markup": { 
-                    "title": "GAP",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": { "a": "a2", "b":"b2"}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "cid",
-                "ncoords": { "x": 150, "y": 320},
-                "markup": { 
-                    "title": "CID",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": { "a": "a3", "b":"b3"}
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "allocation",
-                "markup": { 
-                    "title": "Case Allocation",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "signature",
-                "markup": { 
-                    "title": "Grant Signature",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "grant"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "progress-meeting",
-                "markup": { 
-                    "title": "Progress Meetings",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "grant",
-                    "instanciable": true
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "techdd",
-                "markup": { 
-                    "title": "Tech Due Diligences",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "kyc",
-                "markup": { 
-                    "title": "KYC",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "aifm-advisory",
-                "markup": { 
-                    "title": "AIFM Advisory Commitee",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "aifm-investment",
-                "markup": { 
-                    "title": "AIFM Investment Commitee",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity",
-                    "parent": "aifm-advisory"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "agreement",
-                "markup": { 
-                    "title": "Investment Agreement",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity",
-                    "parent": "aifm-investment"
-                }
-            }        
-        ],
-        "links": [
-            { "from": ["eval", "out2"], "to": ["gap", "in1"] },
-            { "from": ["eval", "out1"], "to": ["cid", "in1"] },
-            { "from": ["eval", "out3"], "to": ["allocation", "in1"] },
-            { "from": ["gap", "out1"], "to": ["signature", "in1"] },
-            { "from": ["signature", "out1"], "to": ["progress-meeting", "in1"] },
-            { "from": ["cid", "out1"], "to": ["techdd", "in1"] },
-            { "from": ["allocation", "out1"], "to": ["techdd", "in3"] },
-            { "from": ["allocation", "out2"], "to": ["kyc", "in2"] },
-            { "from": ["techdd", "out1"], "to": ["aifm-advisory", "in1"] },
-            { "from": ["kyc", "out1"], "to": ["aifm-advisory", "in3"] },
-            { "from": ["aifm-advisory", "out1"], "to": ["aifm-investment", "in1"] },
-            { "from": ["aifm-investment", "out1"], "to": ["agreement", "in1"] },
-            { "from": ["gap", "out3"], "to": ["aifm-investment", "in1"] }
-        ]
-    }
-}
\ No newline at end of file
diff --git a/app/assets/json/bzGraflow/testFlowICMP2.json b/app/assets/json/bzGraflow/testFlowICMP2.json
deleted file mode 100644
index 2dea84b..0000000
--- a/app/assets/json/bzGraflow/testFlowICMP2.json
+++ /dev/null
@@ -1,150 +0,0 @@
-{
-    "nodesFile": "/app/assets/html/bzGraflow/nodesEIC2.html",
-    "flow": {
-        "nodes":[
-            {   "nodeType": "eicBasic",
-                "id": "eval",
-                "markup": { 
-                    "title": "Evaluations",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": { "node": "eval", "nodeId":null}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "gap",
-                "ncoords": { "x": 100, "y": 220},
-                "markup": { 
-                    "title": "GAP",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": { "a": "a2", "b":"b2"}
-            },
-            {   "nodeType": "eicBasic",
-                "id": "cid",
-                "ncoords": { "x": 150, "y": 320},
-                "markup": { 
-                    "title": "CID",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": { "a": "a3", "b":"b3"}
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "allocation",
-                "markup": { 
-                    "title": "Case Allocation",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "signature",
-                "markup": { 
-                    "title": "Grant Signature",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "grant"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "progress-meeting",
-                "markup": { 
-                    "title": "Progress Meetings",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "grant",
-                    "instanciable": true
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "techdd",
-                "markup": { 
-                    "title": "Tech Due Diligences",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "kyc",
-                "markup": { 
-                    "title": "KYC",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "aifm-advisory",
-                "markup": { 
-                    "title": "AIFM Advisory Commitee",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "aifm-investment",
-                "markup": { 
-                    "title": "AIFM Investment Commitee",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity",
-                    "parent": "aifm-advisory"
-                }
-            },
-            {
-                "nodeType": "eicBasic",
-                "id": "agreement",
-                "markup": { 
-                    "title": "Investment Agreement",
-                    "subtitle": "...",
-                    "severity": "secondary"
-                },
-                "data": {
-                    "track": "equity",
-                    "parent": "aifm-investment"
-                }
-            }        
-        ],
-        "links": [
-            { "from": ["eval", "out1"], "to": ["gap", "in1"] , "endArrow":true},
-            { "from": ["eval", "out1"], "to": ["cid", "in1"] , "endArrow":true},
-            { "from": ["eval", "out1"], "to": ["allocation", "in1"] , "endArrow":true},
-            { "from": ["gap", "out1"], "to": ["signature", "in1"] , "endArrow":true},
-            { "from": ["signature", "out1"], "to": ["progress-meeting", "in1"] , "endArrow":true},
-            { "from": ["cid", "out1"], "to": ["techdd", "in1"] , "endArrow":true, "startArrow":true},
-            { "from": ["allocation", "out1"], "to": ["techdd", "in1"] , "endArrow":true, "startArrow":true},
-            { "from": ["allocation", "out1"], "to": ["kyc", "in1"] , "endArrow":true, "startArrow":true},
-            { "from": ["techdd", "out1"], "to": ["aifm-advisory", "in1"] },
-            { "from": ["kyc", "out1"], "to": ["aifm-advisory", "in1"] , "endArrow":true},
-            { "from": ["aifm-advisory", "out1"], "to": ["aifm-investment", "in1"] , "endArrow":true},
-            { "from": ["aifm-investment", "out1"], "to": ["agreement", "in1"] , "endArrow":true},
-            { "from": ["gap", "out1"], "to": ["aifm-investment", "in1"] , "endArrow":true}
-        ]
-    }
-}
\ No newline at end of file