Merge branch 'draw-interfaces' of github.com:GNS3/gns3-web-ui into draw-interfaces

src/app/cartography/shared/managers/selection-manager.spec.ts

@@ -2,6 +2,7 @@ import { Subject} from "rxjs/Subject";
 
 import { Node } from "../models/node";
 import { Link } from "../models/link";
+import { Drawing } from "../models/drawing";
 import { Rectangle } from "../models/rectangle";
 import { SelectionManager } from "./selection-manager";
 import { NodesDataSource } from "../datasources/nodes-datasource";
@@ -75,4 +76,20 @@ describe('SelectionManager', () => {
     manager.setSelectedLinks([link]);
     expect(manager.getSelectedLinks().length).toEqual(1);
   });
+
+  it('items should be cleared', () => {
+    const link = new Link();
+    link.link_id = "test1";
+    const node = new Node();
+    node.node_id = "test1";
+    const drawing = new Drawing();
+    drawing.drawing_id = "test1"
+    manager.setSelectedLinks([link]);
+    manager.setSelectedNodes([node]);
+    manager.setSelectedDrawings([drawing]);
+    manager.clearSelection();
+    expect(manager.getSelectedLinks().length).toEqual(0);
+    expect(manager.getSelectedDrawings().length).toEqual(0);
+    expect(manager.getSelectedNodes().length).toEqual(0);
+  });
 });

src/app/cartography/shared/managers/selection-manager.ts

@@ -76,6 +76,12 @@ export class SelectionManager {
     });
   }
 
+  public clearSelection() {
+    this.setSelectedDrawings([]);
+    this.setSelectedLinks([]);
+    this.setSelectedNodes([]);
+  }
+
   private getSelectedItemsInRectangle<T extends Selectable>(dataSource: DataSource<T>, rectangle: Rectangle) {
     return this.setSelectedItems<T>(dataSource, (item: T) => {
       return this.inRectangleHelper.inRectangle(rectangle, item.x, item.y);

src/app/cartography/shared/widgets/interface-label.ts

@@ -6,7 +6,7 @@ import { select } from "d3-selection";
 
 
 export class InterfaceLabelWidget {
-  static SURROUNDING_TEXT_BORDER = 10;
+  static SURROUNDING_TEXT_BORDER = 5;
 
   private cssFixer: CssFixer;
 
@@ -94,10 +94,12 @@ export class InterfaceLabelWidget {
           const text = parent.select<SVGTextElement>('text');
           const bbox = text.node().getBBox();
 
-          current.attr('width', bbox.width + InterfaceLabelWidget.SURROUNDING_TEXT_BORDER);
+          const border = InterfaceLabelWidget.SURROUNDING_TEXT_BORDER;
-          current.attr('height', bbox.height + InterfaceLabelWidget.SURROUNDING_TEXT_BORDER);
+
-          current.attr('x', bbox.x - InterfaceLabelWidget.SURROUNDING_TEXT_BORDER);
+          current.attr('width', bbox.width + border*2);
-          current.attr('y', bbox.y - InterfaceLabelWidget.SURROUNDING_TEXT_BORDER);
+          current.attr('height', bbox.height + border);
+          current.attr('x', - border);
+          current.attr('y', - bbox.height);
         });
 
     labels

src/app/project-map/project-map.component.ts

@@ -199,6 +199,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
     });
 
     this.mapChild.graphLayout.getNodesWidget().setOnNodeClickedCallback((event: any, node: Node) => {
+      this.selectionManager.clearSelection();
       this.selectionManager.setSelectedNodes([node]);
       if (this.drawLineMode) {
         this.nodeSelectInterfaceMenu.open(node, event.clientY, event.clientX);