From b39cf7033f75c79f1e73e070efb2dc5356084d78 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 10 Jan 2019 06:42:20 -0800 Subject: [PATCH 1/3] Basic implementation of context menu for drawings --- src/app/app.module.ts | 14 +++--- src/app/cartography/events/event-source.ts | 8 ++++ src/app/cartography/widgets/drawings.ts | 6 +++ .../edit-style-action.component.html | 4 ++ .../edit-style-action.component.spec.ts | 0 .../edit-style-action.component.ts | 24 ++++++++++ .../move-layer-down-action.component.html | 0 .../move-layer-down-action.component.spec.ts | 0 .../move-layer-down-action.component.ts | 45 +++++++++++++++++++ .../move-layer-up-action.component.html | 0 .../move-layer-up-action.component.spec.ts | 0 .../move-layer-up-action.component.ts | 45 +++++++++++++++++++ .../start-node-action.component.html | 0 .../start-node-action.component.spec.ts | 0 .../start-node-action.component.ts | 0 .../stop-node-action.component.html | 0 .../stop-node-action.component.spec.ts | 0 .../stop-node-action.component.ts | 0 .../context-menu/context-menu.component.html | 10 +++++ .../context-menu.component.scss} | 0 .../context-menu.component.spec.ts} | 10 ++--- .../context-menu.component.ts} | 34 +++++++++++--- .../move-layer-down-action.component.ts | 29 ------------ .../move-layer-up-action.component.ts | 29 ------------ .../node-context-menu.component.html | 9 ---- .../project-map/project-map.component.html | 2 +- .../project-map/project-map.component.ts | 25 ++++++++--- 27 files changed, 205 insertions(+), 89 deletions(-) create mode 100644 src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.html create mode 100644 src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.spec.ts create mode 100644 src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.ts rename src/app/components/project-map/{node-context-menu => context-menu}/actions/move-layer-down-action/move-layer-down-action.component.html (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/move-layer-down-action/move-layer-down-action.component.spec.ts (100%) create mode 100644 src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts rename src/app/components/project-map/{node-context-menu => context-menu}/actions/move-layer-up-action/move-layer-up-action.component.html (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/move-layer-up-action/move-layer-up-action.component.spec.ts (100%) create mode 100644 src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts rename src/app/components/project-map/{node-context-menu => context-menu}/actions/start-node-action/start-node-action.component.html (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/start-node-action/start-node-action.component.spec.ts (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/start-node-action/start-node-action.component.ts (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/stop-node-action/stop-node-action.component.html (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/stop-node-action/stop-node-action.component.spec.ts (100%) rename src/app/components/project-map/{node-context-menu => context-menu}/actions/stop-node-action/stop-node-action.component.ts (100%) create mode 100644 src/app/components/project-map/context-menu/context-menu.component.html rename src/app/components/project-map/{node-context-menu/node-context-menu.component.scss => context-menu/context-menu.component.scss} (100%) rename src/app/components/project-map/{node-context-menu/node-context-menu.component.spec.ts => context-menu/context-menu.component.spec.ts} (58%) rename src/app/components/project-map/{node-context-menu/node-context-menu.component.ts => context-menu/context-menu.component.ts} (55%) delete mode 100644 src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts delete mode 100644 src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts delete mode 100644 src/app/components/project-map/node-context-menu/node-context-menu.component.html diff --git a/src/app/app.module.ts b/src/app/app.module.ts index cfc6add2..8566a4ba 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -36,9 +36,9 @@ import { AppComponent } from './app.component'; import { ProjectMapComponent } from './components/project-map/project-map.component'; import { ServersComponent, AddServerDialogComponent } from './components/servers/servers.component'; -import { NodeContextMenuComponent } from './components/project-map/node-context-menu/node-context-menu.component'; -import { StartNodeActionComponent } from './components/project-map/node-context-menu/actions/start-node-action/start-node-action.component'; -import { StopNodeActionComponent } from './components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component'; +import { ContextMenuComponent } from './components/project-map/context-menu/context-menu.component'; +import { StartNodeActionComponent } from './components/project-map/context-menu/actions/start-node-action/start-node-action.component'; +import { StopNodeActionComponent } from './components/project-map/context-menu/actions/stop-node-action/stop-node-action.component'; import { TemplateComponent } from './components/template/template.component'; import { TemplateListDialogComponent } from './components/template/template-list-dialog/template-list-dialog.component'; import { CartographyModule } from './cartography/cartography.module'; @@ -50,8 +50,9 @@ import { SymbolsDataSource } from "./cartography/datasources/symbols-datasource" import { SelectionManager } from "./cartography/managers/selection-manager"; import { InRectangleHelper } from "./cartography/helpers/in-rectangle-helper"; import { DrawingsDataSource } from "./cartography/datasources/drawings-datasource"; -import { MoveLayerDownActionComponent } from './components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component'; -import { MoveLayerUpActionComponent } from './components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component'; +import { EditStyleActionComponent } from './components/project-map/context-menu/actions/edit-style-action/edit-style-action.component'; +import { MoveLayerDownActionComponent } from './components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component'; +import { MoveLayerUpActionComponent } from './components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component'; import { ProjectMapShortcutsComponent } from './components/project-map/project-map-shortcuts/project-map-shortcuts.component'; import { SettingsComponent } from './components/settings/settings.component'; import { SettingsService } from "./services/settings.service"; @@ -113,13 +114,14 @@ if (environment.production) { ConfirmationDialogComponent, DefaultLayoutComponent, ProgressDialogComponent, - NodeContextMenuComponent, + ContextMenuComponent, StartNodeActionComponent, StopNodeActionComponent, TemplateComponent, TemplateListDialogComponent, MoveLayerDownActionComponent, MoveLayerUpActionComponent, + EditStyleActionComponent, ProjectMapShortcutsComponent, SettingsComponent, LocalServerComponent, diff --git a/src/app/cartography/events/event-source.ts b/src/app/cartography/events/event-source.ts index 49b6751b..1ad574cf 100644 --- a/src/app/cartography/events/event-source.ts +++ b/src/app/cartography/events/event-source.ts @@ -1,4 +1,5 @@ import { TextElement } from '../models/drawings/text-element'; +import { MapDrawing } from '../models/map/map-drawing'; export class DataEventSource { constructor( @@ -50,3 +51,10 @@ export class TextEditedDataEvent { public textElement: TextElement ) {} } + +export class DrawingContextMenu { + constructor( + public event: any, + public drawing: MapDrawing + ) {} +} diff --git a/src/app/cartography/widgets/drawings.ts b/src/app/cartography/widgets/drawings.ts index 96a1f1e5..84bfac34 100644 --- a/src/app/cartography/widgets/drawings.ts +++ b/src/app/cartography/widgets/drawings.ts @@ -14,6 +14,7 @@ import { EllipseElement } from "../models/drawings/ellipse-element"; import { ResizingEnd } from "../events/resizing"; import { LineElement } from "../models/drawings/line-element"; import { MapSettingsManager } from "../managers/map-settings-manager"; +import { DrawingContextMenu } from '../events/event-source'; @Injectable() @@ -21,6 +22,7 @@ export class DrawingsWidget implements Widget { public draggable = new Draggable(); public draggingEnabled = false; public resizingFinished = new EventEmitter>(); + public onContextMenu = new EventEmitter(); // public onContextMenu = new EventEmitter(); // public onDrawingClicked = new EventEmitter(); @@ -60,6 +62,10 @@ export class DrawingsWidget implements Widget { .append('g') .attr('class', 'drawing') .attr('drawing_id', (l: MapDrawing) => l.id) + .on('contextmenu', (l: MapDrawing) => { + event.preventDefault(); + this.onContextMenu.emit(new DrawingContextMenu(event, l)); + }) const merge = drawing.merge(drawing_enter); diff --git a/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.html b/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.html new file mode 100644 index 00000000..43ab8ded --- /dev/null +++ b/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.html @@ -0,0 +1,4 @@ + diff --git a/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.spec.ts b/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.spec.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.ts b/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.ts new file mode 100644 index 00000000..54b1a542 --- /dev/null +++ b/src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.ts @@ -0,0 +1,24 @@ +import { Component, OnInit, Input } from "@angular/core"; +import { Drawing } from '../../../../../cartography/models/drawing'; +import { Server } from '../../../../../models/server'; +import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource'; +import { DrawingService } from '../../../../../services/drawing.service'; + + +@Component({ + selector: 'app-edit-style-action', + templateUrl: './edit-style-action.component.html' +}) +export class EditStyleActionComponent implements OnInit { + @Input() server: Server; + @Input() drawing: Drawing; + + constructor( + private drawingsDataSource: DrawingsDataSource, + private drawingService: DrawingService + ) {} + + ngOnInit() {} + + editStyle(){} +} diff --git a/src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.html b/src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.html similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.html rename to src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.html diff --git a/src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.spec.ts b/src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.spec.ts similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.spec.ts rename to src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.spec.ts diff --git a/src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts b/src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts new file mode 100644 index 00000000..117981e0 --- /dev/null +++ b/src/app/components/project-map/context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts @@ -0,0 +1,45 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { Server } from '../../../../../models/server'; +import { Node } from '../../../../../cartography/models/node'; +import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource'; +import { NodeService } from '../../../../../services/node.service'; +import { Drawing } from '../../../../../cartography/models/drawing'; +import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource'; +import { DrawingService } from '../../../../../services/drawing.service'; + +@Component({ + selector: 'app-move-layer-down-action', + templateUrl: './move-layer-down-action.component.html' +}) +export class MoveLayerDownActionComponent implements OnInit { + @Input() server: Server; + @Input() node: Node; + @Input() drawing: Drawing; + + constructor( + private nodesDataSource: NodesDataSource, + private drawingsDataSource: DrawingsDataSource, + private nodeService: NodeService, + private drawingService: DrawingService + ) {} + + ngOnInit() {} + + moveLayerDown() { + if (this.node) { + this.node.z--; + this.nodesDataSource.update(this.node); + + this.nodeService + .update(this.server, this.node) + .subscribe((node: Node) => {}); + } else if(this.drawing) { + this.drawing.z--; + this.drawingsDataSource.update(this.drawing); + + this.drawingService + .update(this.server, this.drawing) + .subscribe((drawing: Drawing) => {}); + } + } +} diff --git a/src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.html b/src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.html similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.html rename to src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.html diff --git a/src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.spec.ts b/src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.spec.ts similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.spec.ts rename to src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.spec.ts diff --git a/src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts b/src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts new file mode 100644 index 00000000..8ce6dc45 --- /dev/null +++ b/src/app/components/project-map/context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts @@ -0,0 +1,45 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { Server } from '../../../../../models/server'; +import { Node } from '../../../../../cartography/models/node'; +import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource'; +import { NodeService } from '../../../../../services/node.service'; +import { Drawing } from '../../../../../cartography/models/drawing'; +import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource'; +import { DrawingService } from '../../../../../services/drawing.service'; + +@Component({ + selector: 'app-move-layer-up-action', + templateUrl: './move-layer-up-action.component.html' +}) +export class MoveLayerUpActionComponent implements OnInit { + @Input() server: Server; + @Input() node: Node; + @Input() drawing: Drawing; + + constructor( + private nodesDataSource: NodesDataSource, + private drawingsDataSource: DrawingsDataSource, + private nodeService: NodeService, + private drawingService: DrawingService + ) { } + + ngOnInit() {} + + moveLayerUp() { + if (this.node) { + this.node.z++; + this.nodesDataSource.update(this.node); + + this.nodeService + .update(this.server, this.node) + .subscribe((node: Node) => {}); + } else if(this.drawing) { + this.drawing.z++; + this.drawingsDataSource.update(this.drawing); + + this.drawingService + .update(this.server, this.drawing) + .subscribe((drawing: Drawing) => {}); + } + } +} diff --git a/src/app/components/project-map/node-context-menu/actions/start-node-action/start-node-action.component.html b/src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.html similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/start-node-action/start-node-action.component.html rename to src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.html diff --git a/src/app/components/project-map/node-context-menu/actions/start-node-action/start-node-action.component.spec.ts b/src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.spec.ts similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/start-node-action/start-node-action.component.spec.ts rename to src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.spec.ts diff --git a/src/app/components/project-map/node-context-menu/actions/start-node-action/start-node-action.component.ts b/src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.ts similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/start-node-action/start-node-action.component.ts rename to src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.ts diff --git a/src/app/components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component.html b/src/app/components/project-map/context-menu/actions/stop-node-action/stop-node-action.component.html similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component.html rename to src/app/components/project-map/context-menu/actions/stop-node-action/stop-node-action.component.html diff --git a/src/app/components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component.spec.ts b/src/app/components/project-map/context-menu/actions/stop-node-action/stop-node-action.component.spec.ts similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component.spec.ts rename to src/app/components/project-map/context-menu/actions/stop-node-action/stop-node-action.component.spec.ts diff --git a/src/app/components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component.ts b/src/app/components/project-map/context-menu/actions/stop-node-action/stop-node-action.component.ts similarity index 100% rename from src/app/components/project-map/node-context-menu/actions/stop-node-action/stop-node-action.component.ts rename to src/app/components/project-map/context-menu/actions/stop-node-action/stop-node-action.component.ts diff --git a/src/app/components/project-map/context-menu/context-menu.component.html b/src/app/components/project-map/context-menu/context-menu.component.html new file mode 100644 index 00000000..396b659b --- /dev/null +++ b/src/app/components/project-map/context-menu/context-menu.component.html @@ -0,0 +1,10 @@ +
+ + + + + + + + +
diff --git a/src/app/components/project-map/node-context-menu/node-context-menu.component.scss b/src/app/components/project-map/context-menu/context-menu.component.scss similarity index 100% rename from src/app/components/project-map/node-context-menu/node-context-menu.component.scss rename to src/app/components/project-map/context-menu/context-menu.component.scss diff --git a/src/app/components/project-map/node-context-menu/node-context-menu.component.spec.ts b/src/app/components/project-map/context-menu/context-menu.component.spec.ts similarity index 58% rename from src/app/components/project-map/node-context-menu/node-context-menu.component.spec.ts rename to src/app/components/project-map/context-menu/context-menu.component.spec.ts index e7d14829..74f643c0 100644 --- a/src/app/components/project-map/node-context-menu/node-context-menu.component.spec.ts +++ b/src/app/components/project-map/context-menu/context-menu.component.spec.ts @@ -1,20 +1,20 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { NodeContextMenuComponent } from './node-context-menu.component'; +import { ContextMenuComponent } from './context-menu.component'; describe('NodeContextMenuComponent', () => { - let component: NodeContextMenuComponent; - let fixture: ComponentFixture; + let component: ContextMenuComponent; + let fixture: ComponentFixture; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ NodeContextMenuComponent ] + declarations: [ ContextMenuComponent ] }) .compileComponents(); })); beforeEach(() => { - fixture = TestBed.createComponent(NodeContextMenuComponent); + fixture = TestBed.createComponent(ContextMenuComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/src/app/components/project-map/node-context-menu/node-context-menu.component.ts b/src/app/components/project-map/context-menu/context-menu.component.ts similarity index 55% rename from src/app/components/project-map/node-context-menu/node-context-menu.component.ts rename to src/app/components/project-map/context-menu/context-menu.component.ts index ba89c12d..883a3e57 100644 --- a/src/app/components/project-map/node-context-menu/node-context-menu.component.ts +++ b/src/app/components/project-map/context-menu/context-menu.component.ts @@ -5,14 +5,15 @@ import { Node } from "../../../cartography/models/node"; import { Server } from "../../../models/server"; import { Project } from "../../../models/project"; import { ProjectService } from "../../../services/project.service"; +import { Drawing } from '../../../cartography/models/drawing'; @Component({ - selector: 'app-node-context-menu', - templateUrl: './node-context-menu.component.html', - styleUrls: ['./node-context-menu.component.scss'] + selector: 'app-context-menu', + templateUrl: './context-menu.component.html', + styleUrls: ['./context-menu.component.scss'] }) -export class NodeContextMenuComponent implements OnInit { +export class ContextMenuComponent implements OnInit { @Input() project: Project; @Input() server: Server; @@ -21,6 +22,9 @@ export class NodeContextMenuComponent implements OnInit { topPosition; leftPosition; node: Node; + drawing: Drawing; + private hasNodeCapabilities: boolean = false; + private hasDrawingCapabilities: boolean = false; constructor( private sanitizer: DomSanitizer, @@ -37,10 +41,30 @@ export class NodeContextMenuComponent implements OnInit { this.changeDetector.detectChanges(); } - public open(node: Node, top: number, left: number) { + public openMenuForNode(node: Node, top: number, left: number) { + this.resetCapabilities(); + this.hasNodeCapabilities = true; + this.node = node; this.setPosition(top, left); + this.contextMenu.openMenu(); } + public openMenuForDrawing(drawing: Drawing, top: number, left: number) { + this.resetCapabilities(); + this.hasDrawingCapabilities = true; + + this.drawing = drawing; + this.setPosition(top, left); + + this.contextMenu.openMenu(); + } + + private resetCapabilities() { + this.node = null; + this.drawing = null; + this.hasDrawingCapabilities = false; + this.hasNodeCapabilities = false; + } } diff --git a/src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts b/src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts deleted file mode 100644 index 709e080e..00000000 --- a/src/app/components/project-map/node-context-menu/actions/move-layer-down-action/move-layer-down-action.component.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { Component, OnInit, Input } from '@angular/core'; -import { Server } from '../../../../../models/server'; -import { Node } from '../../../../../cartography/models/node'; -import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource'; -import { NodeService } from '../../../../../services/node.service'; - -@Component({ - selector: 'app-move-layer-down-action', - templateUrl: './move-layer-down-action.component.html' -}) -export class MoveLayerDownActionComponent implements OnInit { - @Input() server: Server; - @Input() node: Node; - - constructor( - private nodesDataSource: NodesDataSource, - private nodeService: NodeService - ) { } - - ngOnInit() {} - - moveLayerDown() { - this.node.z--; - this.nodesDataSource.update(this.node); - this.nodeService - .update(this.server, this.node) - .subscribe((node: Node) => {}); - } -} diff --git a/src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts b/src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts deleted file mode 100644 index 5e51e937..00000000 --- a/src/app/components/project-map/node-context-menu/actions/move-layer-up-action/move-layer-up-action.component.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { Component, OnInit, Input } from '@angular/core'; -import { Server } from '../../../../../models/server'; -import { Node } from '../../../../../cartography/models/node'; -import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource'; -import { NodeService } from '../../../../../services/node.service'; - -@Component({ - selector: 'app-move-layer-up-action', - templateUrl: './move-layer-up-action.component.html' -}) -export class MoveLayerUpActionComponent implements OnInit { - @Input() server: Server; - @Input() node: Node; - - constructor( - private nodesDataSource: NodesDataSource, - private nodeService: NodeService - ) { } - - ngOnInit() {} - - moveLayerUp() { - this.node.z++; - this.nodesDataSource.update(this.node); - this.nodeService - .update(this.server, this.node) - .subscribe((node: Node) => {}); - } -} diff --git a/src/app/components/project-map/node-context-menu/node-context-menu.component.html b/src/app/components/project-map/node-context-menu/node-context-menu.component.html deleted file mode 100644 index f6822c71..00000000 --- a/src/app/components/project-map/node-context-menu/node-context-menu.component.html +++ /dev/null @@ -1,9 +0,0 @@ -
- - - - - - - -
diff --git a/src/app/components/project-map/project-map.component.html b/src/app/components/project-map/project-map.component.html index ef924b61..cb62ab8f 100644 --- a/src/app/components/project-map/project-map.component.html +++ b/src/app/components/project-map/project-map.component.html @@ -121,7 +121,7 @@ - + diff --git a/src/app/components/project-map/project-map.component.ts b/src/app/components/project-map/project-map.component.ts index 542cee36..9e0a3f80 100644 --- a/src/app/components/project-map/project-map.component.ts +++ b/src/app/components/project-map/project-map.component.ts @@ -12,7 +12,7 @@ import { ServerService } from "../../services/server.service"; import { ProjectService } from '../../services/project.service'; import { Server } from "../../models/server"; import { Drawing } from "../../cartography/models/drawing"; -import { NodeContextMenuComponent } from "./node-context-menu/node-context-menu.component"; +import { ContextMenuComponent } from "./context-menu/context-menu.component"; import { Template } from "../../models/template"; import { NodeService } from "../../services/node.service"; import { Symbol } from "../../models/symbol"; @@ -24,11 +24,14 @@ import { ProgressService } from "../../common/progress/progress.service"; import { MapChangeDetectorRef } from '../../cartography/services/map-change-detector-ref'; import { NodeContextMenu } from '../../cartography/events/nodes'; import { NodeWidget } from '../../cartography/widgets/node'; +import { DrawingsWidget } from '../../cartography/widgets/drawings'; import { DrawingService } from '../../services/drawing.service'; import { MapNodeToNodeConverter } from '../../cartography/converters/map/map-node-to-node-converter'; import { SettingsService, Settings } from '../../services/settings.service'; import { D3MapComponent } from '../../cartography/components/d3-map/d3-map.component'; import { ToolsService } from '../../services/tools.service'; +import { DrawingContextMenu } from '../../cartography/events/event-source'; +import { MapDrawingToDrawingConverter } from '../../cartography/converters/map/map-drawing-to-drawing-converter'; @Component({ @@ -66,7 +69,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy { private inReadOnlyMode = false; - @ViewChild(NodeContextMenuComponent) nodeContextMenu: NodeContextMenuComponent; + @ViewChild(ContextMenuComponent) contextMenu: ContextMenuComponent; @ViewChild(D3MapComponent) mapChild: D3MapComponent; private subscriptions: Subscription[] = []; @@ -81,7 +84,9 @@ export class ProjectMapComponent implements OnInit, OnDestroy { private projectWebServiceHandler: ProjectWebServiceHandler, private mapChangeDetectorRef: MapChangeDetectorRef, private nodeWidget: NodeWidget, + private drawingsWidget: DrawingsWidget, private mapNodeToNode: MapNodeToNodeConverter, + private mapDrawingToDrawing: MapDrawingToDrawingConverter, private nodesDataSource: NodesDataSource, private linksDataSource: LinksDataSource, private drawingsDataSource: DrawingsDataSource, @@ -189,16 +194,26 @@ export class ProjectMapComponent implements OnInit, OnDestroy { } setUpMapCallbacks() { - const onContextMenu = this.nodeWidget.onContextMenu.subscribe((eventNode: NodeContextMenu) => { + const onNodeContextMenu = this.nodeWidget.onContextMenu.subscribe((eventNode: NodeContextMenu) => { const node = this.mapNodeToNode.convert(eventNode.node); - this.nodeContextMenu.open( + this.contextMenu.openMenuForNode( node, eventNode.event.clientY, eventNode.event.clientX ); }); - this.subscriptions.push(onContextMenu); + const onDrawingContextMenu = this.drawingsWidget.onContextMenu.subscribe((eventDrawing: DrawingContextMenu) => { + const drawing = this.mapDrawingToDrawing.convert(eventDrawing.drawing); + this.contextMenu.openMenuForDrawing( + drawing, + eventDrawing.event.clientY, + eventDrawing.event.clientX + ); + }); + + this.subscriptions.push(onNodeContextMenu); + this.subscriptions.push(onDrawingContextMenu); this.mapChangeDetectorRef.detectChanges(); } From 669fcc0ddc2b5cccc6676c005805613329485874 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 10 Jan 2019 06:48:21 -0800 Subject: [PATCH 2/3] Fix for unit tests after changes in project map component --- src/app/components/project-map/project-map.component.spec.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/app/components/project-map/project-map.component.spec.ts b/src/app/components/project-map/project-map.component.spec.ts index e026dcdb..a1964261 100644 --- a/src/app/components/project-map/project-map.component.spec.ts +++ b/src/app/components/project-map/project-map.component.spec.ts @@ -31,6 +31,8 @@ import { of } from 'rxjs'; import { Server } from '../../models/server'; import { Node } from '../../cartography/models/node'; import { ToolsService } from '../../services/tools.service'; +import { DrawingsWidget } from '../../cartography/widgets/drawings'; +import { MapDrawingToDrawingConverter } from '../../cartography/converters/map/map-drawing-to-drawing-converter'; export class MockedProgressService { public activate() {} @@ -133,7 +135,9 @@ describe('ProjectMapComponent', () => { { provide: ProjectWebServiceHandler }, { provide: MapChangeDetectorRef }, { provide: NodeWidget }, + { provide: DrawingsWidget }, { provide: MapNodeToNodeConverter }, + { provide: MapDrawingToDrawingConverter }, { provide: NodesDataSource }, { provide: LinksDataSource }, { provide: DrawingsDataSource, useValue: drawingsDataSource}, From 27fa5f86fb7688f296fda6ed938134767bfb9008 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Fri, 11 Jan 2019 06:03:57 -0800 Subject: [PATCH 3/3] Code cleaned up --- .../components/text-editor/text-editor.component.html | 5 ++--- .../components/text-editor/text-editor.component.ts | 6 +++--- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/src/app/cartography/components/text-editor/text-editor.component.html b/src/app/cartography/components/text-editor/text-editor.component.html index f5d81eb2..5f432edc 100644 --- a/src/app/cartography/components/text-editor/text-editor.component.html +++ b/src/app/cartography/components/text-editor/text-editor.component.html @@ -1,6 +1,5 @@
+ [style.left]=leftPosition> {{innerText}} -
+ \ No newline at end of file diff --git a/src/app/cartography/components/text-editor/text-editor.component.ts b/src/app/cartography/components/text-editor/text-editor.component.ts index ea674e9f..4517666b 100644 --- a/src/app/cartography/components/text-editor/text-editor.component.ts +++ b/src/app/cartography/components/text-editor/text-editor.component.ts @@ -17,9 +17,9 @@ export class TextEditorComponent implements OnInit, OnDestroy { @ViewChild('temporaryTextElement') temporaryTextElement: ElementRef; @Input('svg') svg: SVGSVGElement; - private leftPosition: string = '0px'; - private topPosition: string = '0px'; - private innerText: string = ''; + leftPosition: string = '0px'; + topPosition: string = '0px'; + innerText: string = ''; private editingDrawingId: string; private editedElement: any;