P42/P42_UI
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

graflow: autoplace attributes & better ICMP example

Browse Source
This commit is contained in:
STEINNI
2026-03-02 19:07:06 +00:00
parent f5fbdd6ccd
commit e46ff1a817
5 changed files with 56 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/html/bzGraflow/nodesEIC2.html
+20
View File
@@ -57,8 +57,28 @@
.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">
app/assets/html/test4.5.html
+1 -1
View File
@@ -76,7 +76,7 @@
</head>
<body>
<bz-graflow class="icmp" flow="/app/assets/json/bzGraflow/testFlowICMP2.json" tension="60">
<bz-graflow class="icmp" flow="/app/assets/json/bzGraflow/testFlowICMP2.json" tension="60" 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>
app/assets/json/bzGraflow/testFlowICMP2.json
+12 -12
View File
@@ -132,19 +132,19 @@
}
],
"links": [
{ "from": ["eval", "out1"], "to": ["gap", "in1"] },
{ "from": ["eval", "out1"], "to": ["cid", "in1"] },
{ "from": ["eval", "out1"], "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", "in1"] },
{ "from": ["allocation", "out1"], "to": ["kyc", "in1"] },
{ "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"] },
{ "from": ["aifm-advisory", "out1"], "to": ["aifm-investment", "in1"] },
{ "from": ["aifm-investment", "out1"], "to": ["agreement", "in1"] },
{ "from": ["gap", "out1"], "to": ["aifm-investment", "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}
]
}
}
app/thirdparty/buildoz/bzGraflow.js
Vendored
+9 -2
View File
@@ -431,7 +431,7 @@ class BZgraflow extends Buildoz{
if(bb.width > bb.height) this.currentOrientation = 'horizontal'
else this.currentOrientation = 'vertical'
}
if(forceAutoplace) this.autoPlace(this.currentOrientation, 60, 60)
if(forceAutoplace) this.autoPlace(this.currentOrientation)
}
// Convert viewport (client) coordinates to this instance's SVG local coordinates.
@@ -604,7 +604,14 @@ class BZgraflow extends Buildoz{
return(path)
}
autoPlace(orientation = 'horizontal', gapx = 80, gapy = 80, tween=500, align='center'){
autoPlace(orientation = 'horizontal', gapx = null, gapy = null, tween = null, align = null){
if(gapx == null) gapx = parseInt(this.getBZAttribute('gapx')) || 80
if(gapy == null) gapy = parseInt(this.getBZAttribute('gapy')) || 80
if(tween == null) tween = parseInt(this.getBZAttribute('tween')) || 500
if(align == null) align = this.getBZAttribute('align') || 'center'
console.log('autoPlace', orientation, gapx, gapy, tween, align)
this.currentOrientation = orientation
// Cancel any previous autoPlace() animations by bumping a token.
// moveNode() checks this token each frame and will no-op if superseded.