From 48dcfcbf1c93a3d0ae2eef1e7e303482a4fc9033 Mon Sep 17 00:00:00 2001
From: ziajka <dominik@gns3.net>
Date: Mon, 5 Nov 2018 12:10:51 +0100
Subject: [PATCH] Node dragged unified way

---
 .../components/map/map.component.html         |  6 ++++--
 .../components/map/map.component.ts           | 10 ++++++----
 .../project-map/project-map.component.html    |  1 +
 .../project-map/project-map.component.ts      | 20 +++++++++----------
 4 files changed, 20 insertions(+), 17 deletions(-)

diff --git a/src/app/cartography/components/map/map.component.html b/src/app/cartography/components/map/map.component.html
index 68e33fff..a0f9f5ac 100644
--- a/src/app/cartography/components/map/map.component.html
+++ b/src/app/cartography/components/map/map.component.html
@@ -1,2 +1,4 @@
-<svg class="map" preserveAspectRatio="none">
-</svg>
+<svg
+    class="map"
+    preserveAspectRatio="none"
+></svg>
diff --git a/src/app/cartography/components/map/map.component.ts b/src/app/cartography/components/map/map.component.ts
index fc89076d..f5b557d6 100644
--- a/src/app/cartography/components/map/map.component.ts
+++ b/src/app/cartography/components/map/map.component.ts
@@ -1,5 +1,5 @@
 import {
-  Component, ElementRef, HostListener, Input, OnChanges, OnDestroy, OnInit, SimpleChange, EventEmitter
+  Component, ElementRef, HostListener, Input, OnChanges, OnDestroy, OnInit, SimpleChange, EventEmitter, Output
 } from '@angular/core';
 import { D3, D3Service } from 'd3-ng2-service';
 import { Selection } from 'd3-selection';
@@ -11,7 +11,7 @@ import { Context } from "../../models/context";
 import { Size } from "../../models/size";
 import { Drawing } from "../../models/drawing";
 import { Symbol } from '../../../models/symbol';
-import { NodeEvent } from '../../widgets/nodes';
+import { NodeEvent, NodesWidget } from '../../widgets/nodes';
 import { Subscription } from 'rxjs';
 
 
@@ -29,6 +29,8 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
   @Input() width = 1500;
   @Input() height = 600;
 
+  @Output() onNodeDragged: EventEmitter<NodeEvent>;
+
   private d3: D3;
   private parentNativeElement: any;
   private svg: Selection<SVGSVGElement, any, null, undefined>;
@@ -36,8 +38,6 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
 
   private onNodeDraggingSubscription: Subscription;
 
-  // public graphLayout: GraphLayout;
-
   protected settings = {
     'show_interface_labels': true
   };
@@ -45,10 +45,12 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
   constructor(
     protected element: ElementRef,
     protected d3Service: D3Service,
+    protected nodesWidget: NodesWidget,
     public graphLayout: GraphLayout
     ) {
     this.d3 = d3Service.getD3();
     this.parentNativeElement = element.nativeElement;
+    this.onNodeDragged = nodesWidget.onNodeDragged;
   }
 
   @Input('show-interface-labels') 
diff --git a/src/app/components/project-map/project-map.component.html b/src/app/components/project-map/project-map.component.html
index d5074ed0..743f4e1c 100644
--- a/src/app/components/project-map/project-map.component.html
+++ b/src/app/components/project-map/project-map.component.html
@@ -7,6 +7,7 @@
     [width]="project.scene_width"
     [height]="project.scene_height"
     [show-interface-labels]="project.show_interface_labels"
+    (onNodeDragged)="onNodeDragged($event)"
   ></app-map>
 
   <div class="project-toolbar">
diff --git a/src/app/components/project-map/project-map.component.ts b/src/app/components/project-map/project-map.component.ts
index 7fc90932..105949d4 100644
--- a/src/app/components/project-map/project-map.component.ts
+++ b/src/app/components/project-map/project-map.component.ts
@@ -212,17 +212,6 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
 
     this.subscriptions.push(onNodeClicked);
 
-    const onNodeDragged = this.mapChild.graphLayout.getNodesWidget().onNodeDragged.subscribe((eventNode: NodeEvent) => {
-      this.nodesDataSource.update(eventNode.node);
-      this.nodeService
-        .updatePosition(this.server, eventNode.node, eventNode.node.x, eventNode.node.y)
-        .subscribe((n: Node) => {
-          this.nodesDataSource.update(n);
-        });
-    });
-
-    this.subscriptions.push(onNodeDragged);
-
     this.subscriptions.push(
       this.selectionManager.subscribe(
         this.mapChild.graphLayout.getSelectionTool().rectangleSelected)
@@ -246,6 +235,15 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
       });
   }
 
+  onNodeDragged(nodeEvent: NodeEvent) {
+    this.nodesDataSource.update(nodeEvent.node);
+    this.nodeService
+      .updatePosition(this.server, nodeEvent.node, nodeEvent.node.x, nodeEvent.node.y)
+      .subscribe((n: Node) => {
+        this.nodesDataSource.update(n);
+      });
+  }
+
   public toggleDrawLineMode() {
     this.drawLineMode = !this.drawLineMode;
     if (!this.drawLineMode) {