Merge branch 'main' of https://gitea.internike.com/nike/buildoz
This commit is contained in:
32
bzGraflow.js
32
bzGraflow.js
@@ -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 ){
|
||||||
|
|||||||
Reference in New Issue
Block a user