This commit is contained in:
STEINNI
2026-03-08 18:11:24 +00:00

View File

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