graflow: dataset & markup from flow
This commit is contained in:
20
bzGraflow.js
20
bzGraflow.js
@@ -88,18 +88,18 @@ class BZgraflow extends Buildoz{
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
addNode(type, id, x, y, data){
|
addNode(node){
|
||||||
if(!(type in this.nodesRegistry)){ console.warn(`Unknown node type (${type})`); return(null)}
|
const id = node.id
|
||||||
const nodeDef = this.nodesRegistry[type]
|
if(!(node.nodeType in this.nodesRegistry)){ console.warn(`Unknown node type (${node.nodeType})`); return(null)}
|
||||||
|
const nodeDef = this.nodesRegistry[node.nodeType]
|
||||||
this.stagedNodes[id] = nodeDef.cloneNode(true)
|
this.stagedNodes[id] = nodeDef.cloneNode(true)
|
||||||
if(data){
|
for(const token in node.markup){
|
||||||
for(const token in data){
|
this.stagedNodes[id].innerHTML = this.stagedNodes[id].innerHTML.replace(new RegExp(`\{${token}\}`, 'g'), node.markup[token])
|
||||||
this.stagedNodes[id].innerHTML = this.stagedNodes[id].innerHTML.replace(new RegExp(`\{${token}\}`, 'g'), data[token])
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
if(typeof(node.data)=='object') Object.assign(this.stagedNodes[id].dataset, node.data)
|
||||||
const portEls = this.stagedNodes[id].querySelectorAll('.port')
|
const portEls = this.stagedNodes[id].querySelectorAll('.port')
|
||||||
this.stagedNodes[id].style.left = `${x}px`
|
this.stagedNodes[id].style.left = `${node.coords.x}px`
|
||||||
this.stagedNodes[id].style.top = `${y}px`
|
this.stagedNodes[id].style.top = `${node.coords.y}px`
|
||||||
this.stagedNodes[id].dataset.id = id
|
this.stagedNodes[id].dataset.id = id
|
||||||
this.stagedNodes[id].ports = Object.fromEntries(Array.from(portEls).map(item => ([item.dataset.id, { ...item.dataset, el:item }])))
|
this.stagedNodes[id].ports = Object.fromEntries(Array.from(portEls).map(item => ([item.dataset.id, { ...item.dataset, el:item }])))
|
||||||
this.nodesContainer.append(this.stagedNodes[id])
|
this.nodesContainer.append(this.stagedNodes[id])
|
||||||
@@ -126,7 +126,7 @@ class BZgraflow extends Buildoz{
|
|||||||
let x = 0
|
let x = 0
|
||||||
let y = 0
|
let y = 0
|
||||||
for(const node of this.flow.nodes){
|
for(const node of this.flow.nodes){
|
||||||
const nodeEl = this.addNode(node.nodeType, node.id , node.coords.x, node.coords.y, node.data)
|
const nodeEl = this.addNode(node)
|
||||||
}
|
}
|
||||||
for(const link of this.flow.links){
|
for(const link of this.flow.links){
|
||||||
this.addWire(link)
|
this.addWire(link)
|
||||||
|
|||||||
Reference in New Issue
Block a user