diff --git a/src/app/cartography/shared/managers/selection-manager.spec.ts b/src/app/cartography/shared/managers/selection-manager.spec.ts index 4be36928..4fc83d8c 100644 --- a/src/app/cartography/shared/managers/selection-manager.spec.ts +++ b/src/app/cartography/shared/managers/selection-manager.spec.ts @@ -83,7 +83,7 @@ describe('SelectionManager', () => { const node = new Node(); node.node_id = "test1"; const drawing = new Drawing(); - drawing.drawing_id = "test1" + drawing.drawing_id = "test1"; manager.setSelectedLinks([link]); manager.setSelectedNodes([node]); manager.setSelectedDrawings([drawing]); diff --git a/src/app/cartography/shared/widgets/nodes.spec.ts b/src/app/cartography/shared/widgets/nodes.spec.ts new file mode 100644 index 00000000..f2458482 --- /dev/null +++ b/src/app/cartography/shared/widgets/nodes.spec.ts @@ -0,0 +1,69 @@ + +import { TestSVGCanvas } from "../../testing"; +import { NodesWidget } from "./nodes"; +import { Node } from "../models/node"; +import { Label } from "../models/label"; + + +describe('NodesWidget', () => { + let svg: TestSVGCanvas; + let widget: NodesWidget; + + beforeEach(() => { + svg = new TestSVGCanvas(); + widget = new NodesWidget(); + }); + + afterEach(() => { + svg.destroy(); + }); + + describe('draggable behaviour', () => { + let node: Node; + const tryToDrag = () => { + const drew = svg.canvas.selectAll('g.node'); + const drewNode = drew.nodes()[0]; + + drewNode.dispatchEvent( + new MouseEvent('mousedown', { + clientX: 150, clientY: 250, relatedTarget: drewNode, + screenY: 1024, screenX: 1024, view: window + }) + ); + + window.dispatchEvent(new MouseEvent('mousemove', {clientX: 300, clientY: 300})); + window.dispatchEvent(new MouseEvent('mouseup', {clientX: 300, clientY: 300, view: window})); + }; + + beforeEach(() => { + node = new Node(); + node.x = 100; + node.y = 200; + node.width = 100; + node.height = 100; + node.label = new Label(); + }); + + it('should be draggable when enabled', () => { + widget.setDraggingEnabled(true); + widget.draw(svg.canvas, [node]); + + tryToDrag(); + + expect(node.x).toEqual(250); + expect(node.y).toEqual(250); + }); + + it('should be not draggable when disabled', () => { + widget.setDraggingEnabled(false); + widget.draw(svg.canvas, [node]); + + tryToDrag(); + + expect(node.x).toEqual(100); + expect(node.y).toEqual(200); + }); + }); + + +}); diff --git a/src/app/cartography/shared/widgets/nodes.ts b/src/app/cartography/shared/widgets/nodes.ts index f79bb640..fbdc6cef 100644 --- a/src/app/cartography/shared/widgets/nodes.ts +++ b/src/app/cartography/shared/widgets/nodes.ts @@ -11,6 +11,7 @@ import { CssFixer } from "../helpers/css-fixer"; export class NodesWidget implements Widget { private debug = false; + private draggingEnabled = false; private onContextMenuCallback: (event: any, node: Node) => void; private onNodeClickedCallback: (event: any, node: Node) => void; @@ -45,6 +46,10 @@ export class NodesWidget implements Widget { this.symbols = symbols; } + public setDraggingEnabled(enabled: boolean) { + this.draggingEnabled = enabled; + } + private executeOnNodeDraggingCallback(callback_event: any, node: Node) { this.onNodeDraggingCallbacks.forEach((callback: (e: any, n: Node) => void) => { callback(callback_event, node); @@ -190,7 +195,9 @@ export class NodesWidget implements Widget { }); }; - node_merge.call(dragging()); + if (this.draggingEnabled) { + node_merge.call(dragging()); + } nodes_selection .exit() diff --git a/src/app/project-map/project-map.component.ts b/src/app/project-map/project-map.component.ts index 0645df2c..ae34fc9a 100644 --- a/src/app/project-map/project-map.component.ts +++ b/src/app/project-map/project-map.component.ts @@ -1,6 +1,5 @@ import { Component, Inject, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { ActivatedRoute, ParamMap } from '@angular/router'; -import { HotkeysService } from 'angular2-hotkeys'; import { Observable } from 'rxjs/Observable'; import { Subject } from "rxjs/Subject"; @@ -89,7 +88,6 @@ export class ProjectMapComponent implements OnInit, OnDestroy { protected nodesDataSource: NodesDataSource, protected linksDataSource: LinksDataSource, protected drawingsDataSource: DrawingsDataSource, - protected hotkeysService: HotkeysService ) { this.selectionManager = new SelectionManager( this.nodesDataSource, this.linksDataSource, this.drawingsDataSource, new InRectangleHelper()); @@ -105,7 +103,10 @@ export class ProjectMapComponent implements OnInit, OnDestroy { .fromPromise(this.serverService.get(server_id)) .flatMap((server: Server) => { this.server = server; - return this.projectService.get(server, paramMap.get('project_id')); + return this.projectService.get(server, paramMap.get('project_id')).map((project) => { + project.readonly = true; + return project; + }); }) .flatMap((project: Project) => { this.project = project; @@ -194,6 +195,8 @@ export class ProjectMapComponent implements OnInit, OnDestroy { } setUpMapCallbacks(project: Project) { + this.mapChild.graphLayout.getNodesWidget().setDraggingEnabled(!this.project.readonly); + this.mapChild.graphLayout.getNodesWidget().setOnContextMenuCallback((event: any, node: Node) => { this.nodeContextMenu.open(node, event.clientY, event.clientX); });