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

graflow: source grooming + demo panels subflow compatible

Browse Source
This commit is contained in:
STEINNI
2026-02-28 11:14:04 +00:00
parent 3e0faa4866
commit 8be5751107
2 changed files with 41 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/html/test.html
+25 -13
View File
@@ -49,23 +49,17 @@
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); }
bz-graflow.eic{ grid-column: 1 / -1; width: 80vw; height: 50vh; background: var(--eicui-base-color-grey-10); }
bz-graflow.organi{ width: 40vw; height: 100vh; background:black; }
</style>
<script>
window.addEventListener('load',()=>{
const grflw1 = document.querySelector('bz-graflow.compunet')
let grflw1 = document.querySelector('bz-graflow.compunet')
grflw1.addEventListener('subflowLoaded',
(evt) => {
const demoPanel = evt.target.querySelector('.demooptions')
if(demoPanel) demoPanel.style.display = 'none';
}
(evt) => { grflw1 = evt.detail.subflow }
)
grflw1.addEventListener('subflowExited',
(evt) => {
const demoPanel = evt.target.querySelector('.demooptions')
if(demoPanel) demoPanel.style.display = 'block';
}
(evt) => { grflw1 = evt.target }
)
document.querySelector('[data-trigger="onAutoplace1H"]').addEventListener('click',
(evt) => { grflw1.autoPlace('horizontal', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
@@ -74,7 +68,13 @@
(evt) => { grflw1.autoPlace('vertical', 80, 30, 1000, document.querySelector('[data-id="compunet"]').value) }
)
const grflw2 = document.querySelector('bz-graflow.eic')
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) }
)
@@ -82,7 +82,13 @@
(evt) => { grflw2.autoPlace('vertical', 80, 80, 1000, document.querySelector('[data-id="eic"]').value) }
)
const grflw3 = document.querySelector('bz-graflow.organi')
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) }
)
@@ -90,7 +96,13 @@
(evt) => { grflw3.autoPlace('vertical', 80, 30, 1000, document.querySelector('[data-id="organi"]').value) }
)
const grflw4 = document.querySelector('bz-graflow.icmp')
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) }
)