Merge branch 'main' of https://gitea.internike.com/nike/buildoz

bzGraflow.js

@@ -235,25 +235,6 @@ class BZgraflow extends Buildoz{
         const childEl = document.createElement('bz-graflow')
         childEl.isSubflow = true
         childEl.currentOrientation = this.currentOrientation
-        if(flowNode.subflow.url) childEl.setAttribute('flow', flowNode.subflow.url)
-        else {
-            childEl.addEventListener('bz:graflow:domConnected', (e) => {
-                e.detail.graflow.loadFlow(flowNode.subflow.flow)
-            })
-        }
-
-        childEl.setAttribute('tension', this.getBZAttribute('tension') || '60')
-        // Remember which node we "came from" so exitSubflow() can animate back to it.
-        childEl.dataset.enterNodeId = id
-        const btnExitSubflow = document.createElement('button')
-        btnExitSubflow.classList.add('bzgf-zoom-out')
-        this.addIcon(btnExitSubflow, 'zoomout')
-        btnExitSubflow.addEventListener('click', () => {
-            this.exitSubflow(childEl)
-        })
-        // Put the child in the exact same viewport rect as the parent 
-        this.invade(this, childEl)
-        childEl.hostContainer.appendChild(btnExitSubflow)
 
         childEl.addEventListener('bz:graflow:flowLoaded', (e) => {
             for(const portLink of flowNode.subflow.portLinks){
@@ -279,6 +260,28 @@ class BZgraflow extends Buildoz{
             childEl.autoPlace(this.currentOrientation, parseInt(this.getBZAttribute('gapx')) || 80, parseInt(this.getBZAttribute('gapy')) || 80)
         }, { once:true })
 
+        if(flowNode.subflow.url) childEl.setAttribute('flow', flowNode.subflow.url)
+        else {
+            childEl.addEventListener('bz:graflow:domConnected', async (e) => {
+                await childEl.loadFlow(flowNode.subflow.flow)
+            })
+        }
+
+        childEl.setAttribute('tension', this.getBZAttribute('tension') || '60')
+        // Remember which node we "came from" so exitSubflow() can animate back to it.
+        childEl.dataset.enterNodeId = id
+        const btnExitSubflow = document.createElement('button')
+        btnExitSubflow.classList.add('bzgf-zoom-out')
+        this.addIcon(btnExitSubflow, 'zoomout')
+        btnExitSubflow.addEventListener('click', () => {
+            this.exitSubflow(childEl)
+        })
+        // Put the child in the exact same viewport rect as the parent 
+        this.invade(this, childEl)
+        childEl.hostContainer.appendChild(btnExitSubflow)
+
+/////////////////////
+
         // Fade out the current (host) graflow while the child scales up
         this.hostContainer.style.opacity = '1'
         this.hostContainer.style.transition = 'opacity 1000ms ease-in-out'