graflow: added icmp example & fixed grand-slam long-links
This commit is contained in:
STEINNI
@@ -161,14 +161,14 @@
|
||||
<template id="svg-arrows">
|
||||
<defs>
|
||||
<marker id="arrow"
|
||||
viewBox="0 0 15 15"
|
||||
refX="15"
|
||||
refY="7"
|
||||
markerWidth="15"
|
||||
markerHeight="15"
|
||||
viewBox="0 0 10 10"
|
||||
refX="10"
|
||||
refY="5"
|
||||
markerWidth="10"
|
||||
markerHeight="10"
|
||||
orient="auto-start-reverse"
|
||||
markerUnits="userSpaceOnUse">
|
||||
<path d="M0,0 L15,7 L0,15 Z" fill="#FF0"/>
|
||||
<path d="M0,0 L10,5 L0,10 Z" fill="#FF0"/>
|
||||
</marker>
|
||||
</defs>
|
||||
</template>
|
||||
|
||||
@@ -46,6 +46,7 @@
|
||||
}
|
||||
bz-graflow{
|
||||
overflow: scroll;
|
||||
border: 2px solid black;
|
||||
}
|
||||
bz-graflow.compunet{ grid-column: 1 / -1; width: 80vw; height: 40vh; background:black; }
|
||||
bz-graflow.eic{ grid-column: 1 / -1; width: 80vw; height: 30vh; background: var(--eicui-base-color-grey-10); }
|
||||
@@ -77,6 +78,14 @@
|
||||
(evt) => { grflw3.autoPlace('vertical', 80, 50, 1000) }
|
||||
)
|
||||
|
||||
const grflw4 = document.querySelector('bz-graflow.icmp')
|
||||
document.querySelector('[data-trigger="onAutoplace4H"]').addEventListener('click',
|
||||
(evt) => { grflw4.autoPlace('horizontal', 80, 80, 1000) }
|
||||
)
|
||||
document.querySelector('[data-trigger="onAutoplace4V"]').addEventListener('click',
|
||||
(evt) => { grflw4.autoPlace('vertical', 80, 80, 1000) }
|
||||
)
|
||||
|
||||
document.querySelector('[data-id="compunet"]').addEventListener('change',
|
||||
(evt) => { grflw1.setAttribute('tension', evt.target.value); grflw1.refresh() }
|
||||
)
|
||||
@@ -86,12 +95,16 @@
|
||||
document.querySelector('[data-id="organi"]').addEventListener('change',
|
||||
(evt) => { grflw3.setAttribute('tension', evt.target.value); grflw3.refresh() }
|
||||
)
|
||||
|
||||
document.querySelector('[data-id="icmp"]').addEventListener('change',
|
||||
(evt) => { grflw4.setAttribute('tension', evt.target.value); grflw4.refresh() }
|
||||
)
|
||||
})
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<bz-graflow class="compunet" flow="/app/assets/json/bzGraflow/testFlow1.json" tension="60">
|
||||
<bz-graflow class="compunet" flow="/app/assets/json/bzGraflow/testFlow1.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>
|
||||
@@ -99,7 +112,7 @@
|
||||
</div>
|
||||
</bz-graflow>
|
||||
|
||||
<bz-graflow class="eic" flow="/app/assets/json/bzGraflow/testFlowEic.json" tension="60">
|
||||
<bz-graflow class="eic" flow="/app/assets/json/bzGraflow/testFlowEic.json" tension="60" isolated>
|
||||
<div class="demooptions"> <!-- just for demo purposes -->
|
||||
<button data-trigger="onAutoplace2H">Auto-place Horizontal</button>
|
||||
<button data-trigger="onAutoplace2V">Auto-place Vertical</button>
|
||||
@@ -107,13 +120,22 @@
|
||||
</div>
|
||||
</bz-graflow>
|
||||
|
||||
<bz-graflow class="organi" flow="/app/assets/json/bzGraflow/testFlow2.json" tension="60">
|
||||
<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="onAutoplace3H">Auto-place Horizontal</button>
|
||||
<button data-trigger="onAutoplace3V">Auto-place Vertical</button>
|
||||
<div class-"cols-2"=""><label>tension</label><input data-id="organi" type="number" size="2" value="60"></div>
|
||||
</div>
|
||||
</bz-graflow>
|
||||
|
||||
|
||||
<bz-graflow class="icmp" flow="/app/assets/json/bzGraflow/testFlowICMP.json" tension="60" isolated>
|
||||
<div class="demooptions"> <!-- just for demo purposes -->
|
||||
<button data-trigger="onAutoplace4H">Auto-place Horizontal</button>
|
||||
<button data-trigger="onAutoplace4V">Auto-place Vertical</button>
|
||||
<div class-"cols-2"=""><label>tension</label><input data-id="icmp" type="number" size="2" value="60"></div>
|
||||
</div>
|
||||
</bz-graflow>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
"coords": { "x": 220, "y": 120}
|
||||
},
|
||||
{ "nodeType": "inc",
|
||||
"subflow": "/app/assets/json/bzGraflow/testSubFlow1.json",
|
||||
"subflow": "/app/assets/json/bzGraflow/testFlowEic.json",
|
||||
"portLinks": [
|
||||
{ "parentPort": ["in1"], "subflowPort": ["inp1"] },
|
||||
{ "parentPort": ["out1"], "subflowPort": ["out1"] }
|
||||
|
||||
@@ -2,36 +2,36 @@
|
||||
"nodesFile": "/app/assets/html/bzGraflow/nodesTest2.html",
|
||||
"flow": {
|
||||
"nodes":[
|
||||
{ "nodeType": "start",
|
||||
"id": "aze",
|
||||
"coords": { "x": 220, "y": 20},
|
||||
"markup": { "text": "Start" }
|
||||
},
|
||||
{ "nodeType": "process",
|
||||
"id": "aze2",
|
||||
"coords": { "x": 220, "y": 120},
|
||||
"xcoords": { "x": 220, "y": 120},
|
||||
"markup": { "text": "x = alph - 1" }
|
||||
},
|
||||
{ "nodeType": "condition",
|
||||
"id": "qsd",
|
||||
"coords": { "x": 250, "y": 270},
|
||||
"xcoords": { "x": 250, "y": 270},
|
||||
"markup": { "text": "x > 0" }
|
||||
},
|
||||
{ "nodeType": "preparation",
|
||||
"id": "qsd2",
|
||||
"coords": { "x": 250, "y": 470},
|
||||
"xcoords": { "x": 250, "y": 470},
|
||||
"markup": { "text": "prepare SQL" }
|
||||
},
|
||||
{ "nodeType": "database",
|
||||
"id": "wcx",
|
||||
"coords": { "x": 500, "y": 450},
|
||||
"xcoords": { "x": 500, "y": 450},
|
||||
"markup": { "text": "MySQL<br>Store" }
|
||||
},
|
||||
{ "nodeType": "end",
|
||||
"id": "ert",
|
||||
"coords": { "x": 250, "y": 650},
|
||||
"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 },
|
||||
|
||||
@@ -0,0 +1,150 @@
|
||||
{
|
||||
"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"] }
|
||||
]
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user