graflow, autoplacement 1.5, with layer-ordering, 2nd test WF

This commit is contained in:
STEINNI
2026-01-04 19:31:31 +00:00
parent 0cedc88eab
commit ff77990aa2
6 changed files with 261 additions and 147 deletions
+29 -11
View File
@@ -10,29 +10,47 @@
<script src="../../thirdparty/buildoz/buildoz.js"></script>
<script src="../../thirdparty/buildoz/bzGraflow.js"></script>
<style>
bz-graflow{
bz-graflow.compunet{
overflow: scroll;
border: 5px ridge #4BABFF;
width: 70vw;
height: 70vh;
width: 80vw;
height: 40vh;
}
bz-graflow.organi{
overflow: scroll;
border: 5px ridge #4BABFF;
width: 40vw;
height: 100vh;
}
</style>
<script>
window.addEventListener('load',()=>{
const grflw = document.querySelector('bz-graflow')
document.querySelector('[data-trigger="onAutoplaceH"]').addEventListener('click',
(evt) => { grflw.autoPlace('horizontal') }
const grflw1 = document.querySelector('bz-graflow.compunet')
document.querySelector('[data-trigger="onAutoplace1H"]').addEventListener('click',
(evt) => { grflw1.autoPlace('horizontal') }
)
document.querySelector('[data-trigger="onAutoplaceV"]').addEventListener('click',
(evt) => { grflw.autoPlace('vertical') }
document.querySelector('[data-trigger="onAutoplace1V"]').addEventListener('click',
(evt) => { grflw1.autoPlace('vertical') }
)
const grflw2 = document.querySelector('bz-graflow.organi')
document.querySelector('[data-trigger="onAutoplace2H"]').addEventListener('click',
(evt) => { grflw2.autoPlace('horizontal') }
)
document.querySelector('[data-trigger="onAutoplace2V"]').addEventListener('click',
(evt) => { grflw2.autoPlace('vertical') }
)
})
</script>
</head>
<body>
<bz-graflow flow="/app/assets/json/bzGraflow/testFlow1.json" tension="60"></bz-graflow>
<button data-trigger="onAutoplaceH">auto-place Horizontal</button>
<button data-trigger="onAutoplaceV">auto-place Vertical</button>
<bz-graflow class="compunet" flow="/app/assets/json/bzGraflow/testFlow1.json" tension="60"></bz-graflow>
<button data-trigger="onAutoplace1H" style="margin:10px;">auto-place Horizontal</button>
<button data-trigger="onAutoplace1V" style="margin:10px;">auto-place Vertical</button>
<bz-graflow class="organi" flow="/app/assets/json/bzGraflow/testFlow2.json" tension="60"></bz-graflow>
<button data-trigger="onAutoplace2H" style="margin:10px;">auto-place Horizontal</button>
<button data-trigger="onAutoplace2V" style="margin:10px;">auto-place Vertical</button>
</body>
</html>