diff --git a/src/BaseEntity.ts b/src/BaseEntity.ts index 6d0342f..b566dc0 100644 --- a/src/BaseEntity.ts +++ b/src/BaseEntity.ts @@ -7,42 +7,41 @@ export class BaseListener{ } export class BaseEntity{ - + public listeners:{[s: string]: T}; public id: string; public locked: boolean; - + constructor(id?:string){ this.listeners = {}; this.id = id || Toolkit.UID(); this.locked = false; } - + getID(){ return this.id; } - + clearListeners(){ this.listeners = {}; } - + public deSerialize(data){ this.id = data.id; } - + public serialize(){ return { id: this.id, } } - + public iterateListeners(cb: (t: T) => any){ - for (var i in this.listeners){ cb(this.listeners[i]); } } - + public removeListener(listener: string){ if (this.listeners[listener]){ delete this.listeners[listener]; @@ -50,17 +49,17 @@ export class BaseEntity{ } return false; } - + public addListener(listener: T): string{ var uid = Toolkit.UID(); this.listeners[uid] = listener; return uid; } - + public isLocked(): boolean{ return this.locked; } - + public setLocked(locked: boolean = true){ this.locked = locked; this.iterateListeners((listener) => { diff --git a/src/DiagramEngine.ts b/src/DiagramEngine.ts index 1f89990..3206f87 100644 --- a/src/DiagramEngine.ts +++ b/src/DiagramEngine.ts @@ -8,11 +8,11 @@ import * as _ from "lodash"; * @author Dylan Vorster */ export interface DiagramEngineListener extends BaseListener{ - + nodeFactoriesUpdated?(): void; - + linkFactoriesUpdated?(): void; - + repaintCanvas?(): void; } @@ -20,15 +20,15 @@ export interface DiagramEngineListener extends BaseListener{ * Passed as a parameter to the DiagramWidget */ export class DiagramEngine extends BaseEntity{ - + nodeFactories: {[s: string]:NodeWidgetFactory}; linkFactories: {[s: string]:LinkWidgetFactory}; instanceFactories: {[s: string]: AbstractInstanceFactory>}; - + diagramModel: DiagramModel; canvas: Element; paintableWidgets: {}; - + constructor(){ super(); this.diagramModel = new DiagramModel(); @@ -38,21 +38,21 @@ export class DiagramEngine extends BaseEntity{ this.canvas = null; this.paintableWidgets = null; } - + repaintCanvas(){ this.iterateListeners((listener) => { listener.repaintCanvas && listener.repaintCanvas(); }) } - + clearRepaintEntities(){ this.paintableWidgets = null; } - + enableRepaintEntities(entities: BaseModel[]){ this.paintableWidgets = {}; entities.forEach((entity) => { - + //if a node is requested to repaint, add all of its links if (entity instanceof NodeModel){ _.forEach(entity.getPorts(),(port) => { @@ -61,87 +61,94 @@ export class DiagramEngine extends BaseEntity{ }); }); } - + if (entity instanceof PointModel){ this.paintableWidgets[entity.getLink().getID()] = true; } - + this.paintableWidgets[entity.getID()] = true; }); } - + /** * Checks to see if a model is locked by running through * its parents to see if they are locked first */ isModelLocked(model: BaseEntity){ - + //always check the diagram model if (this.diagramModel.isLocked()){ return true; } - + + //a point is locked, if its model is locked + if (model instanceof PortModel){ + if (model.getParent().isLocked()){ + return true; + } + } + //a point is locked, if its model is locked if (model instanceof PointModel){ if (model.getLink().isLocked()){ return true; } } - + return model.isLocked(); } - + canEntityRepaint(baseModel: BaseModel){ //no rules applied, allow repaint if(this.paintableWidgets === null){ return true; } - + return this.paintableWidgets[baseModel.getID()] !== undefined; } - + setCanvas(canvas: Element| null){ this.canvas = canvas; } - + setDiagramModel(model: DiagramModel){ this.diagramModel = model; } - + getDiagramModel(): DiagramModel{ return this.diagramModel; } - + getNodeFactories(): {[s: string]:NodeWidgetFactory}{ return this.nodeFactories; } - + getLinkFactories(): {[s: string]:LinkWidgetFactory}{ return this.linkFactories; } - + getInstanceFactory(className: string): AbstractInstanceFactory>{ return this.instanceFactories[className]; } - + registerInstanceFactory(factory: AbstractInstanceFactory>){ this.instanceFactories[factory.getName()] = factory; } - + registerNodeFactory(factory: NodeWidgetFactory){ this.nodeFactories[factory.getType()] = factory; this.iterateListeners((listener) => { if(listener.nodeFactoriesUpdated) listener.nodeFactoriesUpdated(); }); } - + registerLinkFactory(factory: LinkWidgetFactory){ this.linkFactories[factory.getType()] = factory; this.iterateListeners((listener) => { if(listener.linkFactoriesUpdated) listener.linkFactoriesUpdated(); }); } - + getFactoryForNode(node: NodeModel): NodeWidgetFactory | null{ if (this.nodeFactories[node.getType()]){ return this.nodeFactories[node.getType()]; @@ -149,7 +156,7 @@ export class DiagramEngine extends BaseEntity{ console.log("cannot find widget factory for node of type: [" + node.getType()+"]"); return null; } - + getFactoryForLink(link: LinkModel): LinkWidgetFactory | null{ if (this.linkFactories[link.getType()]){ return this.linkFactories[link.getType()]; @@ -157,7 +164,7 @@ export class DiagramEngine extends BaseEntity{ console.log("cannot find widget factory for link of type: [" + link.getType()+"]"); return null; } - + generateWidgetForLink(link: LinkModel): JSX.Element|null{ var linkFactory = this.getFactoryForLink(link); if(!linkFactory){ @@ -165,7 +172,7 @@ export class DiagramEngine extends BaseEntity{ } return linkFactory.generateReactWidget(this,link); } - + generateWidgetForNode(node: NodeModel): JSX.Element|null{ var nodeFactory = this.getFactoryForNode(node); if(!nodeFactory){ @@ -173,7 +180,7 @@ export class DiagramEngine extends BaseEntity{ } return nodeFactory.generateReactWidget(this,node); } - + getRelativeMousePoint(event): {x:number,y:number}{ var point = this.getRelativePoint(event.clientX,event.clientY); return { @@ -186,7 +193,7 @@ export class DiagramEngine extends BaseEntity{ var canvasRect = this.canvas.getBoundingClientRect(); return {x: x-canvasRect.left,y:y-canvasRect.top}; } - + getNodePortElement(port: PortModel): any{ var selector = this.canvas.querySelector('.port[data-name="' + port.getName() + '"][data-nodeid="' + port.getParent().getID()+'"]'); if(selector === null){ @@ -194,7 +201,7 @@ export class DiagramEngine extends BaseEntity{ } return selector; } - + getPortCenter(port: PortModel){ var sourceElement = this.getNodePortElement(port); var sourceRect = sourceElement.getBoundingClientRect(); @@ -206,5 +213,5 @@ export class DiagramEngine extends BaseEntity{ y: ((sourceElement.offsetHeight/2)+rel.y/(this.diagramModel.getZoomLevel()/100.0)) - this.diagramModel.getOffsetY() }; } - + } \ No newline at end of file diff --git a/src/defaults/DefaultNodeWidget.tsx b/src/defaults/DefaultNodeWidget.tsx index dee10fb..e939cfb 100644 --- a/src/defaults/DefaultNodeWidget.tsx +++ b/src/defaults/DefaultNodeWidget.tsx @@ -33,8 +33,10 @@ export class DefaultNodeWidget extends React.Component
{this.props.node.name}
{ - this.props.node.remove(); - this.props.diagramEngine.repaintCanvas(); + if(!this.props.diagramEngine.isModelLocked(this.props.node)){ + this.props.node.remove(); + this.props.diagramEngine.repaintCanvas(); + } }} />
diff --git a/src/widgets/DiagramWidget.tsx b/src/widgets/DiagramWidget.tsx index 714f757..6d11152 100644 --- a/src/widgets/DiagramWidget.tsx +++ b/src/widgets/DiagramWidget.tsx @@ -274,7 +274,7 @@ export class DiagramWidget extends React.Component { return; } - if (element && element.model instanceof PortModel) { + if (element && element.model instanceof PortModel && !diagramEngine.isModelLocked(element.model)) { linkConnected = true; let link = model.model.getLink(); link.setTargetPort(element.model); @@ -369,18 +369,23 @@ export class DiagramWidget extends React.Component { //its a port element, we want to drag a link else if (model.model instanceof PortModel) { - var relative = diagramEngine.getRelativeMousePoint(event); - var link = new LinkModel(); - link.setSourcePort(model.model); + if(!this.props.diagramEngine.isModelLocked(model.model)) { - link.getFirstPoint().updateLocation(relative) - link.getLastPoint().updateLocation(relative); + var relative = diagramEngine.getRelativeMousePoint(event); + var link = new LinkModel(); + link.setSourcePort(model.model); - diagramModel.clearSelection(); - link.getLastPoint().setSelected(true); - diagramModel.addLink(link); + link.getFirstPoint().updateLocation(relative) + link.getLastPoint().updateLocation(relative); - this.startFiringAction(new MoveItemsAction(event.clientX, event.clientY, diagramEngine)); + diagramModel.clearSelection(); + link.getLastPoint().setSelected(true); + diagramModel.addLink(link); + + this.startFiringAction(new MoveItemsAction(event.clientX, event.clientY, diagramEngine)); + }else{ + diagramModel.clearSelection(); + } } //its some or other element, probably want to move it else {