diff --git a/demos/demo-cloning/index.tsx b/demos/demo-cloning/index.tsx index 91006a2..7a1ce1e 100644 --- a/demos/demo-cloning/index.tsx +++ b/demos/demo-cloning/index.tsx @@ -81,7 +81,7 @@ export default () => { model.addAll(node1, node2, link1); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-custom-link1/index.tsx b/demos/demo-custom-link1/index.tsx index aedc335..ef83703 100644 --- a/demos/demo-custom-link1/index.tsx +++ b/demos/demo-custom-link1/index.tsx @@ -150,7 +150,7 @@ export default () => { model.addAll(node1, node2, node3, node4); // load model into engine - engine.setDiagramModel(model); + engine.setModel(model); // render the diagram! return ; diff --git a/demos/demo-custom-node1/index.tsx b/demos/demo-custom-node1/index.tsx index eda4d92..4f63ade 100644 --- a/demos/demo-custom-node1/index.tsx +++ b/demos/demo-custom-node1/index.tsx @@ -50,7 +50,7 @@ export default () => { model.addAll(node1, node2, node3, link1, link2); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-dagre/index.tsx b/demos/demo-dagre/index.tsx index c03bb31..bc08758 100644 --- a/demos/demo-dagre/index.tsx +++ b/demos/demo-dagre/index.tsx @@ -40,7 +40,7 @@ class Demo8Widget extends React.Component { const { engine } = this.props; const model = engine.getDiagramModel(); let distributedModel = getDistributedModel(engine, model); - engine.setDiagramModel(distributedModel); + engine.setModel(distributedModel); this.forceUpdate(); } @@ -114,7 +114,7 @@ export default () => { //5) load model into engine let model2 = getDistributedModel(engine, model); - engine.setDiagramModel(model2); + engine.setModel(model2); return ; }; diff --git a/demos/demo-drag-and-drop/Application.ts b/demos/demo-drag-and-drop/Application.ts index e5924a8..71ed26a 100644 --- a/demos/demo-drag-and-drop/Application.ts +++ b/demos/demo-drag-and-drop/Application.ts @@ -16,7 +16,7 @@ export class Application { public newModel() { this.activeModel = new SRD.DiagramModel(); - this.diagramEngine.setDiagramModel(this.activeModel); + this.diagramEngine.setModel(this.activeModel); //3-A) create a default node var node1 = new SRD.DefaultNodeModel("Node 1", "rgb(0,192,255)"); diff --git a/demos/demo-grid/index.tsx b/demos/demo-grid/index.tsx index 2496c33..5361e4d 100644 --- a/demos/demo-grid/index.tsx +++ b/demos/demo-grid/index.tsx @@ -30,7 +30,7 @@ export default () => { model.addAll(node1, node2, link1); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-labelled-links/index.tsx b/demos/demo-labelled-links/index.tsx index 576ebe8..358821b 100644 --- a/demos/demo-labelled-links/index.tsx +++ b/demos/demo-labelled-links/index.tsx @@ -53,7 +53,7 @@ export default () => { model.addAll(node1, node2, node3, node4, link1, link2, link3); // load model into engine and render - engine.setDiagramModel(model); + engine.setModel(model); return ( { model.addAll(node1, node2, link1); - engine.setDiagramModel(model); + engine.setModel(model); var props = { diagramEngine: engine, diff --git a/demos/demo-listeners/index.tsx b/demos/demo-listeners/index.tsx index 19437aa..2610451 100644 --- a/demos/demo-listeners/index.tsx +++ b/demos/demo-listeners/index.tsx @@ -46,7 +46,7 @@ export default () => { }); }); - engine.setDiagramModel(model); + engine.setModel(model); var props = { diagramEngine: engine, diff --git a/demos/demo-locks/index.tsx b/demos/demo-locks/index.tsx index 501b1e1..4b617da 100644 --- a/demos/demo-locks/index.tsx +++ b/demos/demo-locks/index.tsx @@ -51,7 +51,7 @@ export default () => { model.addAll(node3, node4, link2); - engine.setDiagramModel(model); + engine.setModel(model); //!========================================= <<<<<<< diff --git a/demos/demo-mutate-graph/index.tsx b/demos/demo-mutate-graph/index.tsx index c3f56b2..23df5e9 100644 --- a/demos/demo-mutate-graph/index.tsx +++ b/demos/demo-mutate-graph/index.tsx @@ -31,7 +31,7 @@ class NodeDelayedPosition extends React.Component { node.x += 30; node.y += 30; model2.deSerializeDiagram(obj, engine); - engine.setDiagramModel(model2); + engine.setModel(model2); this.forceUpdate(); } @@ -79,7 +79,7 @@ export default () => { model.addAll(node1, node2, link1); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-performance/index.tsx b/demos/demo-performance/index.tsx index aa54f92..b609f7a 100644 --- a/demos/demo-performance/index.tsx +++ b/demos/demo-performance/index.tsx @@ -23,7 +23,7 @@ export default () => { } //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-serializing/index.tsx b/demos/demo-serializing/index.tsx index 68e21ed..2579cfb 100644 --- a/demos/demo-serializing/index.tsx +++ b/demos/demo-serializing/index.tsx @@ -29,7 +29,7 @@ export default () => { model.addAll(node1, node2, link1); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //!------------- SERIALIZING ------------------ @@ -39,7 +39,7 @@ export default () => { var model2 = new DiagramModel(); model2.deSerializeDiagram(JSON.parse(str), engine); - engine.setDiagramModel(model2); + engine.setModel(model2); return ( { model.addAll(node1, node2, node3, link1); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-simple/index.tsx b/demos/demo-simple/index.tsx index aeae2cf..c56eb48 100644 --- a/demos/demo-simple/index.tsx +++ b/demos/demo-simple/index.tsx @@ -34,7 +34,7 @@ export default () => { model.addAll(node1, node2, link1); //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ; diff --git a/demos/demo-smart-routing/index.tsx b/demos/demo-smart-routing/index.tsx index 5b013fb..43be3e9 100644 --- a/demos/demo-smart-routing/index.tsx +++ b/demos/demo-smart-routing/index.tsx @@ -43,7 +43,7 @@ export default () => { model.addAll(node1, node2, node3, node4, node5, link1, link2); // load model into engine and render - engine.setDiagramModel(model); + engine.setModel(model); return ( { } //5) load model into engine - engine.setDiagramModel(model); + engine.setModel(model); //6) render the diagram! return ( diff --git a/src/models/DiagramModel.ts b/src/models/DiagramModel.ts index c4ac432..c19f96a 100644 --- a/src/models/DiagramModel.ts +++ b/src/models/DiagramModel.ts @@ -12,8 +12,8 @@ export interface DiagramListener extends CanvasModelListener { } export class DiagramModel extends CanvasModel { - linksLayer: CanvasLayerModel; - nodesLayer: CanvasLayerModel; + linksLayer: CanvasLayerModel; + nodesLayer: CanvasLayerModel; constructor() { super(); @@ -53,12 +53,7 @@ export class DiagramModel extends CanvasModel { } addNode(node: NodeModel): NodeModel { - node.addListener({ - entityRemoved: () => { - this.removeNode(node); - } - }); - this.nodes[node.getID()] = node; + this.nodesLayer.addEntity(node); this.iterateListeners("node added", (listener, event) => { if (listener.nodesUpdated) { listener.nodesUpdated({ ...event, node: node, isCreated: true }); @@ -68,8 +63,7 @@ export class DiagramModel extends CanvasModel { } removeLink(link: LinkModel | string) { - link = this.getLink(link); - delete this.links[link.getID()]; + this.linksLayer.removeEntity(link); this.iterateListeners("link removed", (listener, event) => { if (listener.linksUpdated) { listener.linksUpdated({ ...event, link: link as LinkModel, isCreated: false }); @@ -78,8 +72,7 @@ export class DiagramModel extends CanvasModel { } removeNode(node: NodeModel | string) { - node = this.getNode(node); - delete this.nodes[node.getID()]; + this.nodesLayer.removeEntity(node); this.iterateListeners("node removed", (listener, event) => { if (listener.nodesUpdated) { listener.nodesUpdated({ ...event, node: node as NodeModel, isCreated: false }); @@ -88,10 +81,10 @@ export class DiagramModel extends CanvasModel { } getLinks(): { [s: string]: LinkModel } { - return this.links; + return this.linksLayer.getEntities(); } getNodes(): { [s: string]: NodeModel } { - return this.nodes; + return this.nodesLayer.getEntities(); } } diff --git a/src/models/NodeModel.ts b/src/models/NodeModel.ts index 6637c76..125712a 100644 --- a/src/models/NodeModel.ts +++ b/src/models/NodeModel.ts @@ -20,6 +20,10 @@ export class NodeModel extends CanvasElementMod return this.dimensions; } + setPosition(x:number, y:number){ + this.dimensions.updateDimensions(x,y, this.dimensions.getWidth(), this.dimensions.getHeight()); + } + deSerialize(event: DeserializeEvent) { super.deSerialize(event); this.dimensions.deserialize(event.data.dimensions);