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

bzGraflow.js

@@ -84,24 +84,19 @@ class BZgraflow extends Buildoz{
         this.mainContainer.append(this.wiresContainer)
         this.mainContainer.append(this.nodesContainer)
         this.append(this.hostContainer)
-        this.loadFlow(flowUrl).then(() => {
-            if(this.getBZAttribute('edit')){
-                const edit = this.getBZAttribute('edit').split(',')
-                if(edit.includes('nodesmove')){
-                    this.nodesMover = new MovingNodes(this)
-                    this.nodesMover.enableMovingNodes('.bzgf-node') 
-                }
-                if(edit.includes('wires')){
-                    this.WiresEditor = new EditWires(this)
-                    this.WiresEditor.enableEditWires()
-                    //this.WiresEditor.enableMovingNodes('.bzgf-wire') 
-                }
-                if(edit.includes('dropnodes')){
-                    this.NodesReceiver = new DroppingNodes(this)
-                    //this.NodesReceiver.enableDroppingNodes('.bzgf-node') 
-                }
+        if(this.getBZAttribute('edit')){
+            const edit = this.getBZAttribute('edit').split(',')
+            if(edit.includes('nodesmove')){
+                this.nodesMover = new MovingNodes(this, '.bzgf-node')
             }
-        })
+            if(edit.includes('wires')){
+                this.WiresEditor = new EditWires(this, '.bzgf-wire')
+            }
+            if(edit.includes('dropnodes')){
+                this.NodesReceiver = new DroppingNodes(this, '.bzgf-node')
+            }
+        }
+        this.loadFlow(flowUrl)
     }
 
     error(msg, err){
@@ -436,7 +431,7 @@ class BZgraflow extends Buildoz{
         for(const node of this.flow.nodes){
             if((!node.coords) || (!node.coords.x) ||(!node.coords.y)) forceAutoplace=true
             this.addNode(node)
-        } 
+        }
         for(const link of this.flow.links){
             this.addWire(link)
         }
@@ -446,6 +441,11 @@ class BZgraflow extends Buildoz{
             else this.currentOrientation = 'vertical'
         }
         if(forceAutoplace) this.autoPlace(this.currentOrientation) 
+        this.dispatchEvent(new CustomEvent('refreshed', {
+            detail: { },
+            bubbles: true,
+            composed: true,
+        }))            
     }
 
     // Convert viewport (client) coordinates to this instance's SVG local coordinates.
@@ -767,8 +767,7 @@ class BZgraflow extends Buildoz{
                         const bb =  this.stagedNodes[nid].getBoundingClientRect()
                         const nodeHeight = this.stagedNodes[nid].offsetHeight || bb.height
                         if((align == 'parent') && (nid in parents) && (parents[nid][0] in parentsY)) {
-                            y = Math.max(parentsY[parents[nid][0]], y) //TODO handle multiple parents with avg
-                            console.log('parent', nid, parents[nid], parentsY[parents[nid][0]])
+                            y = Math.max(parentsY[parents[nid][0]], y) //TODO handle multiple parents with avg                            
                         } 
                         placedY = y
                         this.moveNode(nid, x, y, orientation, tween, null, token)                        
@@ -1172,8 +1171,10 @@ class BZgraflow extends Buildoz{
 Buildoz.define('graflow', BZgraflow)
 
 class MovingNodes{
-    constructor(graflow){
+    constructor(graflow, itemSelector, handleSelector = itemSelector){
         this.graflow = graflow
+        this.itemSelector = itemSelector
+        this.handleSelector = handleSelector
         this.nodesContainer = this.graflow.mainContainer.querySelector('.bzgf-nodes-container')
         this.state = null
 
@@ -1184,14 +1185,13 @@ class MovingNodes{
             button,
             a[href]
         `
+        this.graflow.addEventListener('refreshed', this.enableMovingNodes.bind(this))
     }
     
-    enableMovingNodes(itemSelector, handleSelector = itemSelector) {
-        this.itemSelector = itemSelector
-        this.handleSelector = handleSelector
+    enableMovingNodes() { 
         if(!this._handleCursorStyle){
             const style = document.createElement('style')
-            style.textContent = `${handleSelector}{ cursor: move }`
+            style.textContent = `${this.handleSelector}{ cursor: move }`
             this.nodesContainer.appendChild(style)
             this._handleCursorStyle = style
         }
@@ -1217,7 +1217,6 @@ class MovingNodes{
 
     pointerDown(e){
         this.graflow.clearFakeNodes()
-        console.log('=====> interactive element', e.target)
 
         const node = e.target.closest(this.itemSelector) 
         if(!node) return
@@ -1278,6 +1277,7 @@ class EditWires{
         this.graflow = graflow
         this.nodesContainer = this.graflow.mainContainer.querySelector('.bzgf-nodes-container')
         this.state = null
+        this.graflow.addEventListener('refreshed', this.enableEditWires.bind(this))
     }
      enableEditWires(){
         for(const ref in this.graflow.stagedWires ){