Merge branch 'master' into Show-node-information-by-context-menu

src/app/components/project-map/context-menu/actions/bring-to-front-action/bring-to-front-action.component.html

@@ -0,0 +1,4 @@
+<button mat-menu-item (click)="bringToFront()">
+    <mat-icon>vertical_align_top</mat-icon>
+    <span>Bring to front</span>
+</button>

src/app/components/project-map/context-menu/actions/bring-to-front-action/bring-to-front-action.component.spec.ts

@@ -0,0 +1,66 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { BringToFrontActionComponent } from './bring-to-front-action.component';
+import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
+import { CommonModule } from '@angular/common';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { MockedDrawingService, MockedDrawingsDataSource, MockedNodesDataSource, MockedNodeService } from '../../../project-map.component.spec';
+import { DrawingService } from '../../../../../services/drawing.service';
+import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource';
+import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource';
+import { NodeService } from '../../../../../services/node.service';
+import { Node } from '../../../../../cartography/models/node';
+import { of } from 'rxjs';
+import { ComponentFactoryResolver } from '@angular/core';
+import { Drawing } from '../../../../../cartography/models/drawing';
+
+describe('BringToFrontActionComponent', () => {
+  let component: BringToFrontActionComponent;
+  let fixture: ComponentFixture<BringToFrontActionComponent>;
+  let drawingService = new MockedDrawingService();
+  let drawingsDataSource = new MockedDrawingsDataSource();
+  let nodeService  = new MockedNodeService();
+  let nodesDataSource = new MockedNodesDataSource();
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+        imports: [MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, CommonModule, NoopAnimationsModule],
+        providers: [
+            { provide: DrawingService, useValue: drawingService },
+            { provide: DrawingsDataSource, useValue: drawingsDataSource },
+            { provide: NodeService, useValue: nodeService },
+            { provide: NodesDataSource, useValue: nodesDataSource },
+          ],
+        declarations: [BringToFrontActionComponent]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BringToFrontActionComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call node service when bring to front action called', () => {
+    spyOn(nodeService, 'update').and.returnValue(of());
+    component.nodes = [{z: 0} as Node];
+    component.drawings = [];
+
+    component.bringToFront();
+
+    expect(nodeService.update).toHaveBeenCalled();
+  });
+
+  it('should call drawing service when bring to front action called', () => {
+    spyOn(drawingService, 'update').and.returnValue(of());
+    component.nodes = [];
+    component.drawings = [{z: 0} as Drawing];
+
+    component.bringToFront();
+
+    expect(drawingService.update).toHaveBeenCalled();
+  });
+});

src/app/components/project-map/context-menu/actions/bring-to-front-action/bring-to-front-action.component.ts

@@ -0,0 +1,43 @@
+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-bring-to-front-action',
+  templateUrl: './bring-to-front-action.component.html'
+})
+export class BringToFrontActionComponent implements OnInit {
+  @Input() server: Server;
+  @Input() nodes: Node[];
+  @Input() drawings: Drawing[];
+
+  constructor(
+    private nodesDataSource: NodesDataSource,
+    private drawingsDataSource: DrawingsDataSource,
+    private nodeService: NodeService,
+    private drawingService: DrawingService
+  ) {}
+
+  ngOnInit() {}
+
+  bringToFront() {
+    this.nodes.forEach((node) => {
+      node.z = 100;
+      this.nodesDataSource.update(node);
+
+      this.nodeService.update(this.server, node).subscribe((node: Node) => {});
+    });
+
+    this.drawings.forEach((drawing) => {
+      drawing.z = 100;
+      this.drawingsDataSource.update(drawing);
+
+      this.drawingService.update(this.server, drawing).subscribe((drawing: Drawing) => {});
+    });
+  }
+}

src/app/components/project-map/context-menu/context-menu.component.html

@@ -48,6 +48,12 @@
       [nodes]="nodes"
       [drawings]="drawings"
     ></app-move-layer-down-action>
+    <app-bring-to-front-action
+      *ngIf="!projectService.isReadOnly(project) && (drawings.length || nodes.length) && labels.length===0"
+      [server]="server"
+      [nodes]="nodes"
+      [drawings]="drawings"
+    ></app-bring-to-front-action>
     <app-start-capture-action
       *ngIf="!projectService.isReadOnly(project) && isBundledServer 
       && drawings.length===0 && nodes.length===0 && links.length===1"