Merge branch 'master' into add-rectangle-change-border-position

.gitignore

@@ -49,3 +49,6 @@ package-lock.json
 # System Files
 .DS_Store
 Thumbs.db
+
+# Licenses file
+licenses.csv

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 120,
+  "singleQuote": true,
+  "useTabs": false,
+  "tabWidth": 2,
+  "semi": true,
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false,
+}

README.md

@@ -18,6 +18,10 @@ Please use GNS3 WebUI bundled in `gns3server` and `gns3`.
 
 ## Development
 
+### Branches policy
+
+On branch `master` you can find the latest codebase including under development features. If you are looking for stable version with features promoted to be included in the current/next release please switch to `stable` branch.
+
 ### Installation
 
 We're using [yarn](https://yarnpkg.com/lang/en/) for packages installation:

package.json

@@ -23,70 +23,76 @@
     "distwin": "yarn buildforelectron && electron-builder --win --x64",
     "distmac": "yarn buildforelectron && electron-builder --mac --x64",
     "release": "build",
-    "coverage": "ng test --watch=false --code-coverage"
+    "coverage": "ng test --watch=false --code-coverage",
+    "prettier:base": "prettier",
+    "prettier:check": "yarn prettier:base -- --list-different \"src/**/*.{ts,js,html,scss}\"",
+    "prettier:write": "yarn prettier:base -- --write \"src/**/*.{ts,js,html,scss}\"",
+    "generate-licenses-file": "yarn license-checker --production --csv --out licenses.csv"
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^7.0.4",
-    "@angular/cdk": "^7.0.4",
-    "@angular/common": "^7.0.4",
-    "@angular/compiler": "^7.0.4",
-    "@angular/core": "^7.0.4",
-    "@angular/forms": "^7.0.4",
-    "@angular/http": "^7.0.4",
-    "@angular/material": "^7.0.4",
-    "@angular/platform-browser": "^7.0.4",
-    "@angular/platform-browser-dynamic": "^7.0.4",
-    "@angular/router": "^7.0.4",
-    "@ng-bootstrap/ng-bootstrap": "^4.0.0",
+    "@angular/animations": "^7.1.2",
+    "@angular/cdk": "^7.1.1",
+    "@angular/common": "^7.1.2",
+    "@angular/compiler": "^7.1.2",
+    "@angular/core": "^7.1.2",
+    "@angular/forms": "^7.1.2",
+    "@angular/http": "^7.1.2",
+    "@angular/material": "^7.1.1",
+    "@angular/platform-browser": "^7.1.2",
+    "@angular/platform-browser-dynamic": "^7.1.2",
+    "@angular/router": "^7.1.2",
     "angular-persistence": "^1.0.1",
     "angular2-hotkeys": "^2.1.4",
     "angular2-indexeddb": "^1.2.3",
     "bootstrap": "4.1.3",
-    "core-js": "^2.5.7",
+    "core-js": "^2.6.0",
     "css-tree": "^1.0.0-alpha.29",
     "d3-ng2-service": "^2.1.0",
     "electron-settings": "^3.2.0",
+    "hammerjs": "^2.0.8",
     "material-design-icons": "^3.0.1",
     "ng2-file-upload": "^1.3.0",
     "ngx-electron": "^2.0.0",
     "notosans-fontface": "^1.1.0",
-    "npm-check-updates": "^2.14.3",
     "raven-js": "^3.27.0",
     "rxjs": "^6.3.3",
     "rxjs-compat": "^6.3.3",
     "typeface-roboto": "^0.0.54",
-    "yargs": "^12.0.4",
+    "yargs": "^12.0.5",
     "zone.js": "^0.8.26"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.10.6",
-    "@angular/cli": "^7.0.6",
-    "@angular/compiler-cli": "^7.0.4",
-    "@angular/language-service": "^7.0.4",
-    "@sentry/electron": "^0.13.0",
+    "@angular-devkit/build-angular": "~0.11.2",
+    "@angular/cli": "^7.1.2",
+    "@angular/compiler-cli": "^7.1.2",
+    "@angular/language-service": "^7.1.2",
+    "@sentry/electron": "^0.14.0",
     "@types/jasmine": "~3.3.0",
     "@types/jasminewd2": "~2.0.6",
-    "@types/node": "~10.12.9",
+    "@types/node": "~10.12.12",
     "codelyzer": "~4.5.0",
-    "electron": "3.0.9",
-    "electron-builder": "^20.36.2",
+    "electron": "3.0.11",
+    "electron-builder": "^20.38.2",
     "jasmine-core": "~3.3.0",
     "jasmine-spec-reporter": "~4.2.1",
     "jquery": "^3.3.1",
-    "karma": "~3.1.1",
+    "karma": "~3.1.3",
     "karma-chrome-launcher": "~2.2.0",
-    "karma-cli": "~1.0.1",
+    "karma-cli": "~2.0.0",
     "karma-coverage-istanbul-reporter": "^2.0.4",
     "karma-jasmine": "~2.0.1",
     "karma-jasmine-html-reporter": "^1.4.0",
-    "node-sass": "^4.10.0",
-    "popper.js": "^1.14.5",
+    "license-checker": "^24.0.1",
+    "node-sass": "^4.11.0",
+    "popper.js": "^1.14.6",
+    "prettier": "^1.15.2",
     "protractor": "~5.4.1",
     "ts-mockito": "^2.3.1",
     "ts-node": "~7.0.1",
     "tslint": "~5.11.0",
-    "typescript": "3.1.6"
+    "tslint-config-prettier": "^1.16.0",
+    "typescript": "<3.2.0"
   },
   "greenkeeper": {
     "ignore": [

src/app/app.module.ts

@@ -8,7 +8,6 @@ import { HttpClientModule } from '@angular/common/http';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 import { D3Service } from 'd3-ng2-service';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { HotkeyModule } from 'angular2-hotkeys';
 import { PersistenceModule } from 'angular-persistence';
 import { NgxElectronModule } from 'ngx-electron';
@@ -120,7 +119,6 @@ if (environment.production) {
     DrawLinkToolComponent
   ],
   imports: [
-    NgbModule.forRoot(),
     BrowserModule,
     HttpClientModule,
     AppRoutingModule,

src/app/cartography/components/d3-map/d3-map.component.ts

@@ -20,6 +20,7 @@ import { Symbol } from '../../../models/symbol';
 import { GraphDataManager } from '../../managers/graph-data-manager';
 import { DraggedDataEvent } from '../../events/event-source';
 import { MapSettingsManager } from '../../managers/map-settings-manager';
+import { Server } from '../../../models/server';
 
 
 @Component({
@@ -32,6 +33,7 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
   @Input() links: Link[] = [];
   @Input() drawings: Drawing[] = [];
   @Input() symbols: Symbol[] = [];
+  @Input() server: Server;
 
   @Input() width = 1500;
   @Input() height = 600;

src/app/cartography/converters/map/map-node-to-node-converter.ts

@@ -5,9 +5,6 @@ import { MapNode } from "../../models/map/map-node";
 import { MapLabelToLabelConverter } from "./map-label-to-label-converter";
 import { MapPortToPortConverter } from "./map-port-to-port-converter";
 import { Node } from "../../models/node";
-import { FontBBoxCalculator } from '../../helpers/font-bbox-calculator';
-import { CssFixer } from '../../helpers/css-fixer';
-import { FontFixer } from '../../helpers/font-fixer';
 
 
 @Injectable()
@@ -36,6 +33,7 @@ export class MapNodeToNodeConverter implements Converter<MapNode, Node> {
     node.project_id = mapNode.projectId;
     node.status = mapNode.status;
     node.symbol = mapNode.symbol;
+    node.symbol_url = mapNode.symbolUrl;
     node.width = mapNode.width;
     node.x = mapNode.x;
     node.y = mapNode.y;

src/app/cartography/converters/map/node-to-map-node-converter.ts

@@ -39,6 +39,7 @@ export class NodeToMapNodeConverter implements Converter<Node, MapNode> {
     mapNode.projectId = node.project_id;
     mapNode.status = node.status;
     mapNode.symbol = node.symbol;
+    mapNode.symbolUrl = node.symbol_url;
     mapNode.width = node.width;
     mapNode.x = node.x;
     mapNode.y = node.y;

src/app/cartography/models/map/map-node.ts

@@ -21,6 +21,7 @@ export class MapNode implements Indexed {
     projectId: string;
     status: string;
     symbol: string;
+    symbolUrl: string;
     width: number;
     x: number;
     y: number;

src/app/cartography/models/node.ts

@@ -21,6 +21,7 @@ export class Node {
   project_id: string;
   status: string;
   symbol: string;
+  symbol_url: string; // @TODO: full URL to symbol, move to MapNode once converters are moved to app module
   width: number;
   x: number;
   y: number;

src/app/cartography/widgets/node.ts

@@ -4,7 +4,6 @@ import { Widget } from "./widget";
 import { SVGSelection } from "../models/types";
 import { NodeContextMenu, NodeClicked } from "../events/nodes";
 import { select, event } from "d3-selection";
-import { MapSymbol } from "../models/map/map-symbol";
 import { MapNode } from "../models/map/map-node";
 import { GraphDataManager } from "../managers/graph-data-manager";
 import { SelectionManager } from "../managers/selection-manager";
@@ -47,20 +46,12 @@ export class NodeWidget implements Widget {
         })
         .on('click', (node: MapNode) => {
           this.nodesEventSource.clicked.emit(new ClickedDataEvent<MapNode>(node, event.clientX, event.clientY))
-          // this.onNodeClicked.emit(new NodeClicked(event, n));
         });
 
     // update image of node
     node_body_merge
         .select<SVGImageElement>('image')
-          .attr('xnode:href', (n: MapNode) => {
-            const symbol = this.graphDataManager.getSymbols().find((s: MapSymbol) => s.id === n.symbol);
-            if (symbol) {
-              return 'data:image/svg+xml;base64,' + btoa(symbol.raw);
-            }
-            // @todo; we need to have default image
-            return 'data:image/svg+xml;base64,none';
-          })
+          .attr('xnode:href', (n: MapNode) => n.symbolUrl)
           .attr('width', (n: MapNode) => n.width)
           .attr('height', (n: MapNode) => n.height)
           .attr('x', (n: MapNode) => 0)

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

@@ -7,7 +7,6 @@ import { map, mergeMap } from "rxjs/operators";
 
 import { Project } from '../../models/project';
 import { Node } from '../../cartography/models/node';
-import { SymbolService } from '../../services/symbol.service';
 import { Link } from "../../models/link";
 import { ServerService } from "../../services/server.service";
 import { ProjectService } from '../../services/project.service';
@@ -62,8 +61,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
   public links: Link[] = [];
   public drawings: Drawing[] = [];
   public symbols: Symbol[] = [];
-
-  project: Project;
+  public project: Project;
   public server: Server;
   private drawListener: Function;
   private ws: Subject<any>;
@@ -73,6 +71,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
     'moving': false,
     'draw_link': false
   };
+
   protected settings: Settings;
 
   protected drawTools = {
@@ -91,11 +90,11 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
   @ViewChild(D3MapComponent) mapChild: D3MapComponent;
 
   private subscriptions: Subscription[] = [];
+
   constructor(
     private route: ActivatedRoute,
     private serverService: ServerService,
     private projectService: ProjectService,
-    private symbolService: SymbolService,
     private nodeService: NodeService,
     private linkService: LinkService,
     public drawingService: DrawingService,
@@ -154,12 +153,6 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
 
     this.subscriptions.push(routeSub);
 
-    this.subscriptions.push(
-      this.symbolService.symbols.subscribe((symbols: Symbol[]) => {
-        this.symbols = symbols;
-      })
-    );
-
     this.subscriptions.push(
       this.drawingsDataSource.changes.subscribe((drawings: Drawing[]) => {
         this.drawings = drawings;
@@ -169,6 +162,10 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
 
     this.subscriptions.push(
       this.nodesDataSource.changes.subscribe((nodes: Node[]) => {
+        nodes.forEach((node: Node) => {
+          node.symbol_url = `http://${this.server.ip}:${this.server.port}/v2/symbols/${node.symbol}/raw`;
+        });
+
         this.nodes = nodes;
         this.mapChangeDetectorRef.detectChanges();
       })
@@ -213,12 +210,9 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
   onProjectLoad(project: Project) {
     this.readonly = this.projectService.isReadOnly(project);
 
-    const subscription = this.symbolService
-      .load(this.server)
+    const subscription = this.projectService
+      .nodes(this.server, project.project_id)
       .pipe(
-        mergeMap(() => {
-          return this.projectService.nodes(this.server, project.project_id);
-        }),
         mergeMap((nodes: Node[]) => {
           this.nodesDataSource.set(nodes);
           return this.projectService.links(this.server, project.project_id);

src/app/components/servers/server-discovery/server-discovery.component.html

@@ -7,3 +7,5 @@
     <button mat-button (click)="accept(discoveredServer)">YES</button>
   </mat-card-actions>
 </mat-card>
+
+<mat-divider *ngIf="discoveredServer"></mat-divider>

src/app/components/servers/server-discovery/server-discovery.component.spec.ts

@@ -1,5 +1,5 @@
 import {async, ComponentFixture, fakeAsync, TestBed, tick} from '@angular/core/testing';
-import { MatCardModule } from "@angular/material";
+import { MatCardModule, MatDividerModule } from "@angular/material";
 
 import { Observable } from "rxjs/Rx";
 
@@ -23,7 +23,7 @@ describe('ServerDiscoveryComponent', () => {
     mockedServerService = new MockedServerService();
     mockedVersionService = new MockedVersionService();
     TestBed.configureTestingModule({
-      imports: [ MatCardModule ],
+      imports: [ MatCardModule, MatDividerModule ],
       providers: [
         { provide: VersionService, useFactory: () => mockedVersionService },
         { provide: ServerService, useFactory: () => mockedServerService },

src/app/components/servers/servers.component.html

@@ -5,8 +5,6 @@
   <div class="default-content">
     <app-server-discovery></app-server-discovery>
 
-    <mat-divider></mat-divider>
-
     <div class="example-container mat-elevation-z8">
       <mat-table #table [dataSource]="dataSource">
 

src/app/components/servers/servers.component.ts

@@ -1,8 +1,8 @@
-import { Component, Inject, OnInit, Injectable } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
 import { DataSource } from "@angular/cdk/collections";
 import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
 
-import { Observable, BehaviorSubject, merge } from "rxjs";
+import { Observable, merge } from "rxjs";
 import { map } from "rxjs/operators";
 
 import { Server } from "../../models/server";

src/main.ts

@@ -1,3 +1,4 @@
+import 'hammerjs';
 import { enableProdMode } from '@angular/core';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 

src/test.ts

@@ -1,5 +1,5 @@
 // This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
+import 'hammerjs';
 import 'zone.js/dist/zone-testing';
 import { getTestBed } from '@angular/core/testing';
 import {

tslint.json

@@ -11,14 +11,10 @@
       "check-space"
     ],
     "curly": true,
-    "deprecation": {
-      "severity": "warn"
-    },
     "eofline": true,
     "forin": true,
     "import-blacklist": [
-      true,
-      "rxjs/Rx"
+      true
     ],
     "import-spacing": true,
     "indent": [
@@ -65,12 +61,11 @@
     ],
     "no-misused-new": true,
     "no-non-null-assertion": true,
-    "no-redundant-jsdoc": true,
     "no-shadowed-variable": true,
     "no-string-literal": false,
     "no-string-throw": true,
     "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
+    "no-trailing-whitespace": false,
     "no-unnecessary-initializer": true,
     "no-unused-expression": true,
     "no-use-before-declare": true,
@@ -85,7 +80,7 @@
     ],
     "prefer-const": true,
     "quotemark": [
-      true,
+      false,
       "single"
     ],
     "radix": true,
@@ -107,6 +102,7 @@
         "variable-declaration": "nospace"
       }
     ],
+    "typeof-compare": true,
     "unified-signatures": true,
     "variable-name": false,
     "whitespace": [
@@ -117,7 +113,18 @@
       "check-separator",
       "check-type"
     ],
-    "no-output-on-prefix": true,
+    "directive-selector": [
+      true,
+      "attribute",
+      "app",
+      "camelCase"
+    ],
+    "component-selector": [
+      true,
+      "element",
+      "app",
+      "kebab-case"
+    ],
     "use-input-property-decorator": true,
     "use-output-property-decorator": true,
     "use-host-property-decorator": true,
@@ -126,6 +133,13 @@
     "use-life-cycle-interface": true,
     "use-pipe-transform-interface": true,
     "component-class-suffix": true,
-    "directive-class-suffix": true
-  }
+    "directive-class-suffix": true,
+    "no-access-missing-member": true,
+    "templates-use-public": true,
+    "invoke-injectable": true
+  },
+  "extends": [
+    "tslint:latest",
+    "tslint-config-prettier"
+  ]
 }