Fix tests

Refactor server protocol field
Add server protocol to gns3+pcap
2025-06-24 17:15:22 +00:00 · 2023-11-03 12:28:01 +10:00 · 2023-11-03 11:17:47 +10:00 · 2023-11-02 17:36:41 +10:00 · 2023-10-31 16:45:17 +10:00 · 2023-10-31 16:16:22 +10:00
87 changed files with 3785 additions and 4661 deletions
--- a/.github/workflows/add-new-issues-to-project.yml
+++ b/.github/workflows/add-new-issues-to-project.yml
@ -0,0 +1,16 @@
+name: Add new issues to GNS3 project
+
+on:
+  issues:
+    types:
+      - opened
+
+jobs:
+  add-to-project:
+    name: Add issue to project
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/add-to-project@v0.4.0
+        with:
+          project-url: https://github.com/orgs/GNS3/projects/3
+          github-token: ${{ secrets.ADD_NEW_ISSUES_TO_PROJECT }}
--- a/.github/workflows/codeql.yml
+++ b/.github/workflows/codeql.yml
@ -0,0 +1,76 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL"
+
+on:
+  push:
+    branches: [ "master", "master-3.0" ]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [ "master", "master-3.0" ]
+  schedule:
+    - cron: '38 18 * * 6'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: [ 'javascript', 'python' ]
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
+        # Use only 'java' to analyze code written in Java, Kotlin or both
+        # Use only 'javascript' to analyze code written in JavaScript, TypeScript or both
+        # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v3
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v2
+      with:
+        languages: ${{ matrix.language }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+
+        # Details on CodeQL's query packs refer to : https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
+        # queries: security-extended,security-and-quality
+
+
+    # Autobuild attempts to build any compiled languages  (C/C++, C#, Go, or Java).
+    # If this step fails, then you should remove it and run the build manually (see below)
+    - name: Autobuild
+      uses: github/codeql-action/autobuild@v2
+
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
+
+    #   If the Autobuild fails above, remove it and uncomment the following three lines.
+    #   modify them (or add more) to build your code if your project, please refer to the EXAMPLE below for guidance.
+
+    # - run: |
+    #   echo "Run, Build Application using script"
+    #   ./location_of_script_within_repo/buildscript.sh
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v2
+      with:
+        category: "/language:${{matrix.language}}"
--- a/.gitignore
+++ b/.gitignore
@ -1,6 +1,7 @@
 # See http://help.github.com/ignore-files/ for more about ignoring files.

 # compiled output
+/.angular
 /dist
 /tmp
 /out-tsc
--- a/.whitesource
+++ b/.whitesource
@ -2,7 +2,8 @@
  "scanSettings": {
    "configMode": "AUTO",
    "configExternalURL": "",
-    "projectToken" : ""
+    "projectToken" : "",
+    "baseBranches": ["master", "master-3.0"]
  },
  "checkRunSettings": {
    "vulnerableCheckRunConclusionLevel": "failure"
@ -10,4 +11,4 @@
  "issueSettings": {
    "minSeverityLevel": "LOW"
  }
-}
+}
--- a/SECURITY.md
+++ b/SECURITY.md
@ -0,0 +1,5 @@
+# Security Policy
+
+## Reporting a Vulnerability
+
+Please use GitHub's report a vulnerability feature. More information can be found in https://docs.github.com/en/code-security/security-advisories/guidance-on-reporting-and-writing/privately-reporting-a-security-vulnerability
--- a/angular.json
+++ b/angular.json
@ -47,10 +47,11 @@
 						"scripts": [],
 						"vendorChunk": true,
 						"extractLicenses": false,
-						"buildOptimizer": false,
+						"buildOptimizer": true,
 						"sourceMap": true,
 						"optimization": false,
-						"namedChunks": true
+						"namedChunks": true,
+						"aot": true
 					},
 					"configurations": {
 						"production": {
@ -176,6 +177,7 @@
 							"src/styles.scss",
 							"src/theme.scss"
 						],
+						"sourceMap": false,
 						"assets": [
 							"src/assets",
 							"src/favicon.ico"
--- a/karma.conf.js
+++ b/karma.conf.js
@ -25,7 +25,7 @@ module.exports = function (config) {
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
-    browsers: ['ChromeHeadless'],
+    browsers: ['Chrome'],
    singleRun: true
  });
 };
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "gns3-web-ui",
-  "version": "2.2.23",
+  "version": "2.2.43.dev1",
  "author": {
    "name": "GNS3 Technology Inc.",
    "email": "developers@gns3.com"
@ -36,31 +36,33 @@
    "generate-licenses-file": "yarn license-checker --production --csv --out licenses.csv",
    "prebuildforelectron": "node set-variables-in-env.js --set src/environments/environment.electron.prod.ts",
    "postbuildforelectron": "node set-variables-in-env.js --unset src/environments/environment.electron.prod.ts",
+    "postinstall": "ngcc --properties es5 browser module main --first-only --create-ivy-entry-points && ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points",
    "snyk-protect": "snyk protect",
    "prepare": "yarn run snyk-protect"
  },
  "private": true,
  "dependencies": {
-    "@angular/animations": "^12.1.4",
-    "@angular/cdk": "^12.1.4",
-    "@angular/common": "^12.1.4",
-    "@angular/compiler": "^12.1.4",
-    "@angular/core": "^12.1.4",
-    "@angular/forms": "^12.1.4",
-    "@angular/material": "^12.1.4",
-    "@angular/platform-browser": "^12.1.4",
-    "@angular/platform-browser-dynamic": "^12.1.4",
-    "@angular/router": "^12.1.4",
-    "@sentry/browser": "^6.10.0",
-    "@types/jest": "^26.0.24",
+    "@angular/animations": "^12.2.12",
+    "@angular/cdk": "^12.2.12",
+    "@angular/common": "^12.2.12",
+    "@angular/compiler": "^12.2.12",
+    "@angular/core": "^12.2.12",
+    "@angular/forms": "^12.2.12",
+    "@angular/material": "^12.2.12",
+    "@angular/platform-browser": "^12.2.12",
+    "@angular/platform-browser-dynamic": "^12.2.12",
+    "@angular/router": "^12.2.12",
+    "@sentry/browser": "^6.14.1",
+    "@types/jest": "^27.0.2",
    "@types/mocha": "^9.0.0",
-    "@types/react": "^17.0.15",
-    "@types/react-dom": "^17.0.9",
-    "angular-draggable-droppable": "^4.6.0",
+    "@types/react": "^17.0.34",
+    "@types/react-dom": "^17.0.11",
+    "angular-draggable-droppable": "^5.0.0",
    "angular-resizable-element": "^3.4.0",
-    "bootstrap": "^5.0.2",
+    "bootstrap": "^5.1.3",
    "command-exists": "^1.2.9",
-    "core-js": "^3.16.0",
+    "core-js": "^3.19.1",
+    "css-tree": "^1.1.3",
    "d3-ng2-service": "^2.2.0",
    "eev": "^0.1.5",
    "ini": "^2.0.0",
@ -71,42 +73,42 @@
    "ngx-childprocess": "^0.0.6",
    "ngx-device-detector": "^2.1.1",
    "ngx-electron": "^2.2.0",
-    "node-fetch": "^2.6.1",
+    "node-fetch": "^3.2.10",
    "notosans-fontface": "1.2.2",
-    "prettier-plugin-organize-imports": "^2.3.3",
-    "rxjs": "^6.5.3",
-    "rxjs-compat": "^6.5.3",
+    "prettier-plugin-organize-imports": "^2.3.4",
+    "rxjs": "^6.6.7",
+    "rxjs-compat": "^6.6.7",
    "save-svg-as-png": "^1.4.17",
-    "snyk": "^1.671.0",
-    "spark-md5": "^3.0.1",
-    "svg-crowbar": "^0.6.5",
+    "snyk": "^1.1064.0",
+    "spark-md5": "^3.0.2",
+    "svg-crowbar": "^0.7.0",
    "tree-kill": "^1.2.2",
-    "tslib": "^2.3.0",
+    "tslib": "^2.3.1",
    "typeface-roboto": "^1.1.13",
-    "xterm": "^4.13.0",
+    "xterm": "^4.15.0",
    "xterm-addon-attach": "^0.6.0",
    "xterm-addon-fit": "^0.5.0",
-    "yargs": "^17.0.1",
+    "yargs": "^17.2.1",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
-    "@angular-devkit/build-angular": "^12.1.4",
-    "@angular/cli": "^12.1.4",
-    "@angular/compiler-cli": "^12.1.4",
-    "@angular/language-service": "^12.1.4",
-    "@sentry/cli": "^1.67.2",
-    "@sentry/electron": "^2.5.1",
-    "@types/jasmine": "^3.8.2",
+    "@angular-devkit/build-angular": "^12.2.12",
+    "@angular/cli": "^12.2.12",
+    "@angular/compiler-cli": "^12.2.12",
+    "@angular/language-service": "^12.2.12",
+    "@sentry/cli": "^1.71.0",
+    "@sentry/electron": "^2.5.4",
+    "@types/jasmine": "^3.10.2",
    "@types/jasminewd2": "^2.0.10",
-    "@types/node": "16.4.7",
+    "@types/node": "16.11.6",
    "codelyzer": "^6.0.2",
-    "electron": "^13.1.7",
-    "electron-builder": "22.11.7",
+    "electron": "^13.6.6",
+    "electron-builder": "^22.9.1",
    "file-loader": "^6.2.0",
-    "jasmine-core": "~3.8.0",
+    "jasmine-core": "~3.10.1",
    "jasmine-spec-reporter": "~7.0.0",
    "jquery": "^3.6.0",
-    "karma": "^6.3.4",
+    "karma": "^6.3.16",
    "karma-chrome-launcher": "~3.1.0",
    "karma-cli": "^2.0.0",
    "karma-coverage-istanbul-reporter": "~3.0.3",
@ -114,16 +116,16 @@
    "karma-jasmine-html-reporter": "^1.7.0",
    "license-checker": "^25.0.1",
    "popper.js": "^1.16.1",
-    "prettier": "^2.3.2",
+    "prettier": "^2.4.1",
    "protractor": "^7.0.0",
    "replace": "^1.2.1",
    "rxjs-tslint": "^0.1.8",
    "ts-mockito": "^2.6.1",
-    "ts-node": "~10.1.0",
+    "ts-node": "~10.4.0",
    "tslint": "^6.1.3",
    "tslint-config-prettier": "^1.18.0",
-    "typescript": "4.3.5",
-    "webpack": "5.47.1",
+    "typescript": "4.2.3",
+    "webpack": "5.76.0",
    "yarn-upgrade-all": "^0.5.4"
  },
  "greenkeeper": {
@ -132,4 +134,4 @@
    ]
  },
  "snyk": true
-}
+}
--- a/scripts/requirements.txt
+++ b/scripts/requirements.txt
@ -1,6 +1,6 @@
-setuptools==54.2.0
+setuptools==65.5.1
 cx_Freeze==5.1.1
-requests==2.25.1
+requests==2.31.0
 packaging==20.9
 appdirs==1.4.4
 psutil==5.8.0
--- a/src/ReleaseNotes.txt
+++ b/src/ReleaseNotes.txt
@ -1,6 +1,10 @@
 GNS3 WebUI is web implementation of user interface for GNS3 software.

-Current version: 2.2.22
+Current version: 2.2.32
+
+Bug Fixes & enhancements
+- Fixed generated capture file is not valid
+- Fixed Docker additional directories

 Current version: 2020.4.0-beta.1

--- a/src/app/cartography/components/experimental-map/drawing/drawings/rect/rect.component.html
+++ b/src/app/cartography/components/experimental-map/drawing/drawings/rect/rect.component.html
@ -7,4 +7,6 @@
  [attr.stroke-dasharray]="stroke_dasharray"
  [attr.width]="rect.width"
  [attr.height]="rect.height"
+  [attr.rx]="rect.rx"
+  [attr.ry]="rect.ry"
 />
--- a/src/app/cartography/components/text-editor/text-editor.component.ts
+++ b/src/app/cartography/components/text-editor/text-editor.component.ts
@ -87,6 +87,7 @@ export class TextEditorComponent implements OnInit, OnDestroy {
        `scale(${this.mapScaleService.getScale()})`
      );
      this.temporaryTextElement.nativeElement.focus();
+      document.documentElement.style.cursor = "default";

      let textListener = () => {
        this.drawingsEventSource.textAdded.emit(
--- a/src/app/cartography/converters/map/map-drawing-to-svg-converter.ts
+++ b/src/app/cartography/converters/map/map-drawing-to-svg-converter.ts
@ -14,7 +14,7 @@ export class MapDrawingToSvgConverter implements Converter<MapDrawing, string> {
    let elem = ``;

    if (mapDrawing.element instanceof RectElement) {
-      elem = `<rect fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" height=\"${mapDrawing.element.height}\" width=\"${mapDrawing.element.width}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" />`;
+      elem = `<rect fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" height=\"${mapDrawing.element.height}\" width=\"${mapDrawing.element.width}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" rx=\"${mapDrawing.element.rx}\" ry=\"${mapDrawing.element.ry}\" />`;
    } else if (mapDrawing.element instanceof EllipseElement) {
      elem = `<ellipse fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" cx=\"${mapDrawing.element.cx}\" cy=\"${mapDrawing.element.cy}\" rx=\"${mapDrawing.element.rx}\" ry=\"${mapDrawing.element.ry}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" />`;
    } else if (mapDrawing.element instanceof LineElement) {
--- a/src/app/cartography/helpers/drawings-factory/rectangle-element-factory.ts
+++ b/src/app/cartography/helpers/drawings-factory/rectangle-element-factory.ts
@ -13,6 +13,8 @@ export class RectangleElementFactory implements DrawingElementFactory {
    rectElement.stroke_width = 2;
    rectElement.width = 200;
    rectElement.height = 100;
+    rectElement.rx = 0;
+    rectElement.ry = 0;
    return rectElement;
  }
 }
--- a/src/app/cartography/helpers/font-fixer.spec.ts
+++ b/src/app/cartography/helpers/font-fixer.spec.ts
@ -16,8 +16,8 @@ describe('FontFixer', () => {
    };

    expect(fixer.fix(font)).toEqual({
-      font_family: 'Noto Sans',
-      font_size: 11,
+      font_family: 'Arial',
+      font_size: 12,
      font_weight: 'bold',
    });
  });
@ -39,12 +39,12 @@ describe('FontFixer', () => {
  it('should fix TypeWriter font and 10px size in styles', () => {
    const styles = 'font-family: TypeWriter; font-size: 10px; font-weight: bold';

-    expect(fixer.fixStyles(styles)).toEqual('font-family:Noto Sans;font-size:11px;font-weight:bold');
+    expect(fixer.fixStyles(styles)).toEqual('font-family:Arial;font-size:12px;font-weight:bold');
  });

  it('should fix TypeWriter font and 10px size in styles with quotes', () => {
    const styles = 'font-family: "TypeWriter"; font-size: 10px; font-weight: bold';

-    expect(fixer.fixStyles(styles)).toEqual('font-family:Noto Sans;font-size:11px;font-weight:bold');
+    expect(fixer.fixStyles(styles)).toEqual('font-family:Arial;font-size:12px;font-weight:bold');
  });
 });
--- a/src/app/cartography/helpers/font-fixer.ts
+++ b/src/app/cartography/helpers/font-fixer.ts
@ -9,8 +9,8 @@ import { Font } from '../models/font';
 export class FontFixer {
  static DEFAULT_FONT = 'TypeWriter';
  static DEFAULT_SIZE = 10;
-  static REPLACE_BY_FONT = 'Noto Sans';
-  static REPLACE_BY_SIZE = 11;
+  static REPLACE_BY_FONT = 'Arial';
+  static REPLACE_BY_SIZE = 12;

  public fix(font: Font): Font {
    if (font.font_family === FontFixer.DEFAULT_FONT && font.font_size === FontFixer.DEFAULT_SIZE) {
--- a/src/app/cartography/helpers/svg-to-drawing-converter/rect-converter.spec.ts
+++ b/src/app/cartography/helpers/svg-to-drawing-converter/rect-converter.spec.ts
@ -17,6 +17,8 @@ describe('RectConverter', () => {

    element.setAttribute('width', '100px');
    element.setAttribute('height', '200px');
+    element.setAttribute('rx', '0');
+    element.setAttribute('ry', '0');

    const drawing = rectConverter.convert(element);
    expect(drawing.fill).toEqual('#ffffff');
@ -25,6 +27,8 @@ describe('RectConverter', () => {
    expect(drawing.stroke_dasharray).toEqual('5,25,25');
    expect(drawing.width).toEqual(100);
    expect(drawing.height).toEqual(200);
+    expect(drawing.rx).toEqual(0);
+    expect(drawing.ry).toEqual(0);
  });

  it('should parse with no attributes', () => {
@ -37,5 +41,7 @@ describe('RectConverter', () => {
    expect(drawing.stroke_dasharray).toBeUndefined();
    expect(drawing.width).toBeUndefined();
    expect(drawing.height).toBeUndefined();
+    expect(drawing.rx).toBeUndefined();
+    expect(drawing.ry).toBeUndefined();
  });
 });
--- a/src/app/cartography/helpers/svg-to-drawing-converter/rect-converter.ts
+++ b/src/app/cartography/helpers/svg-to-drawing-converter/rect-converter.ts
@ -40,6 +40,16 @@ export class RectConverter implements SvgConverter {
      drawing.height = parseInt(height.value, 10);
    }

+    const rx = element.attributes.getNamedItem('rx');
+    if (rx) {
+      drawing.rx = parseInt(rx.value, 0);
+    }
+
+    const ry = element.attributes.getNamedItem('ry');
+    if (ry) {
+      drawing.ry = parseInt(ry.value, 0);
+    }
+
    return drawing;
  }
 }
--- a/src/app/cartography/models/drawings/rect-element.ts
+++ b/src/app/cartography/models/drawings/rect-element.ts
@ -8,4 +8,6 @@ export class RectElement implements DrawingElement {
  stroke: string;
  stroke_width: number;
  stroke_dasharray: string;
+  rx: number;
+  ry: number;
 }
--- a/src/app/cartography/models/node.ts
+++ b/src/app/cartography/models/node.ts
@ -53,7 +53,10 @@ export class Properties {
  qemu_path: string;
  environment: string;
  extra_hosts: string;
+  extra_volumes: string[];
  replicate_network_connection_state: boolean;
+  tpm: boolean;
+  uefi: boolean;
 }

 export class Node {
--- a/src/app/cartography/widgets/drawings/rect-drawing.spec.ts
+++ b/src/app/cartography/widgets/drawings/rect-drawing.spec.ts
@ -28,6 +28,8 @@ describe('RectDrawingWidget', () => {
    rect.stroke_dasharray = '5,25,25';
    rect.width = 100;
    rect.height = 200;
+    rect.rx = 0;
+    rect.ry = 0;
    drawing.element = rect;

    const drawings = svg.canvas.selectAll<SVGGElement, MapDrawing>('g.drawing').data([drawing]);
@ -46,5 +48,7 @@ describe('RectDrawingWidget', () => {
    expect(rect_element.getAttribute('stroke-dasharray')).toEqual('5,25,25');
    expect(rect_element.getAttribute('width')).toEqual('100');
    expect(rect_element.getAttribute('height')).toEqual('200');
+    expect(rect_element.getAttribute('rx')).toEqual('0');
+    expect(rect_element.getAttribute('ry')).toEqual('0');
  });
 });
--- a/src/app/cartography/widgets/drawings/rect-drawing.ts
+++ b/src/app/cartography/widgets/drawings/rect-drawing.ts
@ -33,7 +33,9 @@ export class RectDrawingWidget implements DrawingShapeWidget {
      .attr('stroke-width', (rect) => rect.stroke_width)
      .attr('stroke-dasharray', (rect) => this.qtDasharrayFixer.fix(rect.stroke_dasharray))
      .attr('width', (rect) => rect.width)
-      .attr('height', (rect) => rect.height);
+      .attr('height', (rect) => rect.height)
+      .attr('rx', (rect) => rect.rx)
+      .attr('ry', (rect) => rect.ry);

    drawing.exit().remove();
  }
--- a/src/app/cartography/widgets/drawings/text-drawing.spec.ts
+++ b/src/app/cartography/widgets/drawings/text-drawing.spec.ts
@ -42,7 +42,7 @@ describe('TextDrawingWidget', () => {
    const text_element = drew.nodes()[0];
    expect(text_element.innerHTML).toEqual('<tspan xml:space="preserve" x="0" dy="0em">THIS IS TEXT</tspan>');
    expect(text_element.getAttribute('fill')).toEqual('#000000');
-    expect(text_element.getAttribute('style')).toEqual('font-family: "Noto Sans"; font-size: 11pt; font-weight: bold');
+    expect(text_element.getAttribute('style')).toEqual('font-family: "Arial"; font-size: 12pt; font-weight: bold');
    expect(text_element.getAttribute('text-decoration')).toEqual('line-through');
  });

--- a/src/app/cartography/widgets/interface-status.ts
+++ b/src/app/cartography/widgets/interface-status.ts
@ -97,9 +97,9 @@ export class InterfaceStatusWidget implements Widget {
          .attr('y', (ls: LinkStatus) => ls.y - 10)
          .attr('rx', 8)
          .attr('ry', 8)
-          .style('fill', 'white')
+          .style('fill', '#c7ffdf')
          .attr('stroke', '#2ecc71')
-          .attr('stroke-width', 3);
+          .attr('stroke-width', 2);
        status_started.exit().remove();
        const status_started_label = link_group
          .selectAll<SVGTextElement, LinkStatus>('text.status_started_label')
@ -111,7 +111,7 @@ export class InterfaceStatusWidget implements Widget {
          .text((ls: LinkStatus) => ls.port)
          .attr('x', (ls: LinkStatus) => ls.x - 25)
          .attr('y', (ls: LinkStatus) => ls.y + 5)
-          .attr('fill', `black`);
+          .attr('fill', `#0e9647`);
        status_started_label.exit().remove();

        const status_stopped = link_group
@ -129,9 +129,9 @@ export class InterfaceStatusWidget implements Widget {
          .attr('y', (ls: LinkStatus) => ls.y - 10)
          .attr('rx', 8)
          .attr('ry', 8)
-          .style('fill', 'white')
+          .style('fill', '#ffe3e3')
          .attr('stroke', 'red')
-          .attr('stroke-width', 3);
+          .attr('stroke-width', 2);
        status_stopped.exit().remove();
        const status_stopped_label = link_group
          .selectAll<SVGTextElement, LinkStatus>('text.status_stopped_label')
@ -143,7 +143,7 @@ export class InterfaceStatusWidget implements Widget {
          .text((ls: LinkStatus) => ls.port)
          .attr('x', (ls: LinkStatus) => ls.x - 25)
          .attr('y', (ls: LinkStatus) => ls.y + 5)
-          .attr('fill', `black`);
+          .attr('fill', `red`);
        status_stopped_label.exit().remove();

        const status_suspended = link_group
@ -162,8 +162,8 @@ export class InterfaceStatusWidget implements Widget {
          .attr('rx', 8)
          .attr('ry', 8)
          .style('fill', 'white')
-          .attr('stroke', '#FFFF00')
-          .attr('stroke-width', 3);
+          .attr('stroke', '#fffbc3')
+          .attr('stroke-width', 2);
        status_suspended.exit().remove();
        const status_suspended_label = link_group
          .selectAll<SVGTextElement, LinkStatus>('text.status_suspended_label')
@ -175,7 +175,7 @@ export class InterfaceStatusWidget implements Widget {
          .text((ls: LinkStatus) => ls.port)
          .attr('x', (ls: LinkStatus) => ls.x - 25)
          .attr('y', (ls: LinkStatus) => ls.y + 5)
-          .attr('fill', `black`);
+          .attr('fill', `#6b5633`);
        status_suspended_label.exit().remove();
      } else {
        const status_started = link_group
--- a/src/app/cartography/widgets/link.ts
+++ b/src/app/cartography/widgets/link.ts
@ -87,6 +87,7 @@ export class LinkWidget implements Widget {
      .filter((l) => {
        return (
          !l.capturing &&
+          !l.suspend &&
          (l.filters.bpf || l.filters.corrupt || l.filters.delay || l.filters.frequency_drop || l.filters.packet_loss)
        );
      })
@ -113,9 +114,7 @@ export class LinkWidget implements Widget {
    link_body
      .filter((l) => {
        return (
-          l.capturing &&
-          l.suspend &&
-          !(l.filters.bpf || l.filters.corrupt || l.filters.delay || l.filters.frequency_drop || l.filters.packet_loss)
+          l.suspend
        );
      })
      .append<SVGGElement>('g')
--- a/src/app/components/bundled-server-finder/bundled-server-finder.component.ts
+++ b/src/app/components/bundled-server-finder/bundled-server-finder.component.ts
@ -22,10 +22,10 @@ export class BundledServerFinderComponent implements OnInit {
    this.progressService.activate();
    setTimeout(() => {
      let port;
-      
+
      if (parseInt(this.document.location.port, 10)) {
        port = parseInt(this.document.location.port, 10);
-      } else if (this.document.location.protocol == "https:") {
+      } else if (this.document.location.protocol == "https") {
        port = 443;
      } else {
        port = 80;
--- a/src/app/components/direct-link/direct-link.component.ts
+++ b/src/app/components/direct-link/direct-link.component.ts
@ -23,8 +23,8 @@ export class DirectLinkComponent implements OnInit {
    { key: 'basic', name: 'Basic authorization' },
  ];
  protocols = [
-    { key: 'http:', name: 'HTTP' },
-    { key: 'https:', name: 'HTTPS' },
+    { key: 'http', name: 'HTTP' },
+    { key: 'https', name: 'HTTPS' },
  ];
  locations = [
    { key: 'local', name: 'Local' },
@ -34,7 +34,7 @@ export class DirectLinkComponent implements OnInit {
  serverForm = new FormGroup({
    name: new FormControl('', [Validators.required]),
    location: new FormControl(''),
-    protocol: new FormControl('http:'),
+    protocol: new FormControl('http'),
    authorization: new FormControl('none'),
    login: new FormControl(''),
    password: new FormControl(''),
--- a/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.html
+++ b/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.html
@ -13,8 +13,8 @@
    <th mat-header-cell *matHeaderCellDef>Adapter type</th>
    <td mat-cell *matCellDef="let element; let i = index">
      <mat-select placeholder="Type" [(ngModel)]="element.adapter_type">
-        <mat-option *ngFor="let type of networkTypes" [value]="type">
-          {{ type }}
+        <mat-option *ngFor="let type of networkTypes" [value]="type.value">
+          {{ type.name }}
        </mat-option>
      </mat-select>
    </td>
--- a/src/app/components/preferences/common/symbols/symbols.component.ts
+++ b/src/app/components/preferences/common/symbols/symbols.component.ts
@ -72,11 +72,11 @@ export class SymbolsComponent implements OnInit {
  }

  private createSvgFileForImage(image: string | ArrayBuffer, imageToUpload: HTMLImageElement) {
-    return `<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" height=\"${imageToUpload.height}\" 
+    return `<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" height=\"${imageToUpload.height}\"
                width=\"${imageToUpload.width}\">\n<image height=\"${imageToUpload.height}\" width=\"${imageToUpload.width}\" xlink:href=\"${image}\"/>\n</svg>`;
  }

  getImageSourceForTemplate(symbol: string) {
-    return `${this.server.protocol}//${this.server.host}:${this.server.port}/v2/symbols/${symbol}/raw`;
+    return `${this.server.protocol}://${this.server.host}:${this.server.port}/v2/symbols/${symbol}/raw`;
  }
 }
--- a/src/app/components/preferences/ios-on-unix/iou-template-details/iou-template-details.component.html
+++ b/src/app/components/preferences/ios-on-unix/iou-template-details/iou-template-details.component.html
@ -98,14 +98,14 @@
        <mat-checkbox [(ngModel)]="iouTemplate.l1_keepalives">
          Enable layer 1 keepalive messages (non-functional) </mat-checkbox
        ><br />
-        <mat-checkbox [(ngModel)]="defaultSettings"> Use default IOU values for memories </mat-checkbox>
-        <mat-form-field class="form-field" *ngIf="!defaultSettings">
+        <mat-checkbox [(ngModel)]="iouTemplate.use_default_iou_values"> Use default IOU values for memories </mat-checkbox>
+        <mat-form-field class="form-field" *ngIf="!iouTemplate.use_default_iou_values">
          <input matInput type="number" [(ngModel)]="iouTemplate.ram" placeholder="RAM size" />
          <span matSuffix>MB</span>
        </mat-form-field>
-        <mat-form-field class="form-field" *ngIf="!defaultSettings">
+        <mat-form-field class="form-field" *ngIf="!iouTemplate.use_default_iou_values">
          <input matInput type="number" [(ngModel)]="iouTemplate.nvram" placeholder="NVRAM size" />
-          <span matSuffix>MB</span>
+          <span matSuffix>KB</span>
        </mat-form-field>
      </mat-expansion-panel>
      <mat-expansion-panel>
--- a/src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.html
+++ b/src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.html
@ -110,6 +110,9 @@
                  placeholder="Please enter name"
                />
              </mat-form-field>
+              <div *ngIf="uploadedFile">
+                <mat-progress-bar mode="determinate" [value]="uploadProgress" aria-valuemin="0" aria-valuemax="100"></mat-progress-bar>
+              </div>
            </div>
          </form>
        </mat-step>
--- a/src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.ts
+++ b/src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.ts
@ -32,6 +32,8 @@ export class AddQemuVmTemplateComponent implements OnInit {
  chosenImage: string = '';
  qemuTemplate: QemuTemplate;
  uploader: FileUploader;
+  uploadedFile: boolean = false;
+  uploadProgress: number = 0;

  nameForm: FormGroup;
  memoryForm: FormGroup;
@ -86,6 +88,9 @@ export class AddQemuVmTemplateComponent implements OnInit {
      });
      this.toasterService.success('Image uploaded');
    };
+    this.uploader.onProgressItem = (progress: any) => {
+      this.uploadProgress = progress['progress'];
+    };

    const server_id = this.route.snapshot.paramMap.get('server_id');
    this.serverService.get(parseInt(server_id, 10)).then((server: Server) => {
@ -127,6 +132,7 @@ export class AddQemuVmTemplateComponent implements OnInit {
  }

  uploadImageFile(event) {
+    this.uploadedFile = true;
    let name = event.target.files[0].name;
    this.diskForm.controls['fileName'].setValue(name);

--- a/src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.html
+++ b/src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.html
@ -186,13 +186,15 @@
        </mat-form-field>
        <mat-form-field class="form-field">
          <mat-select placeholder="Type" [(ngModel)]="qemuTemplate.adapter_type">
-            <mat-option *ngFor="let type of networkTypes" [value]="type[0]"> {{ type[1] }} ({{ type[0] }}) </mat-option>
+            <mat-option *ngFor="let type of networkTypes" [value]="type.value">{{type.name}} ({{type.value}}) </mat-option>
          </mat-select>
        </mat-form-field>
        <button mat-button class="configButton" (click)="setCustomAdaptersConfiguratorState(true)">
          Configure custom adapters</button
-        ><br />
-        <mat-checkbox [(ngModel)]="qemuTemplate.legacy_networking"> Use the legacy networking mode </mat-checkbox>
+        >
+        <br /><mat-checkbox [(ngModel)]="qemuTemplate.legacy_networking"> Use the legacy networking mode </mat-checkbox>
+        <br /><mat-checkbox [(ngModel)]="qemuTemplate.replicate_network_connection_state"> Replicate network connection state </mat-checkbox>
+
      </mat-expansion-panel>
      <mat-expansion-panel>
        <mat-expansion-panel-header>
@ -271,6 +273,8 @@
              <input matInput type="text" [(ngModel)]="qemuTemplate.options" placeholder="Options" />
            </mat-form-field>
            <mat-checkbox [(ngModel)]="qemuTemplate.linked_clone"> Use as a linked base VM </mat-checkbox>
+            <br /><mat-checkbox [(ngModel)]="qemuTemplate.tpm"> Enable the Trusted Platform Module (TPM)</mat-checkbox>
+            <br /><mat-checkbox [(ngModel)]="qemuTemplate.uefi"> Enable the UEFI boot mode </mat-checkbox>
          </mat-card-content>
        </mat-card>
      </mat-expansion-panel>
--- a/src/app/components/project-map/context-menu/actions/console-device-action-browser/console-device-action-browser.component.ts
+++ b/src/app/components/project-map/context-menu/actions/console-device-action-browser/console-device-action-browser.component.ts
@ -1,4 +1,5 @@
 import { Component, Input } from '@angular/core';
+import { DeviceDetectorService } from 'ngx-device-detector';
 import { Node } from '../../../../../cartography/models/node';
 import { Server } from '../../../../../models/server';
 import { NodeService } from '../../../../../services/node.service';
@ -12,7 +13,7 @@ export class ConsoleDeviceActionBrowserComponent {
  @Input() server: Server;
  @Input() node: Node;

-  constructor(private toasterService: ToasterService, private nodeService: NodeService) {}
+  constructor(private toasterService: ToasterService, private nodeService: NodeService, private deviceService: DeviceDetectorService) {}

  openConsole() {
    this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => {
@ -21,6 +22,31 @@ export class ConsoleDeviceActionBrowserComponent {
    });
  }

+  createHiddenIframe(target: Element, uri: string) {
+    const iframe = document.createElement("iframe");
+    iframe.src = uri;
+    iframe.id = "hiddenIframe";
+    iframe.style.display = "none";
+    target.appendChild(iframe);
+    return iframe;
+  }
+
+  openUriUsingFirefox(uri: string) {
+      var iframe = (document.querySelector("#hiddenIframe") as HTMLIFrameElement);
+
+      if (!iframe) {
+          iframe = this.createHiddenIframe(document.body, "about:blank");
+      }
+
+      try {
+          iframe.contentWindow.location.href = uri;
+      } catch (e) {
+          if (e.name === "NS_ERROR_UNKNOWN_PROTOCOL") {
+              this.toasterService.error('Protocol handler does not exist');
+          }
+      }
+  }
+
  startConsole() {
    if (this.node.status !== 'started') {
      this.toasterService.error('This node must be started before a console can be opened');
@ -33,20 +59,33 @@ export class ConsoleDeviceActionBrowserComponent {
        this.node.console_host = this.server.host;
      }

-      if (
-        this.node.console_type === 'telnet' ||
-        this.node.console_type === 'vnc' ||
-        this.node.console_type === 'spice'
-      ) {
-        try {
-          location.assign(
-            `gns3+${this.node.console_type}://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`
-          );
-        } catch (e) {
-          this.toasterService.error(e);
+      const device = this.deviceService.getDeviceInfo();
+
+      try {
+        var uri;
+        if (this.node.console_type === 'telnet') {
+          uri = `gns3+telnet://[${this.node.console_host}]:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`;
+        } else if (this.node.console_type === 'vnc') {
+          uri = `gns3+vnc://[${this.node.console_host}]:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`;
+        } else if (this.node.console_type.startsWith('spice')) {
+          uri = `gns3+spice://[${this.node.console_host}]:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`
+        } else if (this.node.console_type.startsWith('http')) {
+          uri = `${this.node.console_type}://[${this.node.console_host}]:${this.node.console}`
+          return window.open(uri);  // open an http console directly in a new window/tab
+        } else {
+          this.toasterService.error('Supported console types are: telnet, vnc, spice and spice+agent.');
        }
-      } else {
-        this.toasterService.error('Supported console types: telnet, vnc, spice.');
+
+        if (device.browser === "Firefox") {
+            // Use a hidden iframe otherwise Firefox will disconnect
+            // from the GNS3 controller websocket if we use location.assign()
+            this.openUriUsingFirefox(uri);
+        } else {
+            location.assign(uri);
+        }
+
+      } catch (e) {
+          this.toasterService.error(e);
      }
    }
  }
--- a/src/app/components/project-map/context-menu/actions/console-device-action/console-device-action.component.ts
+++ b/src/app/components/project-map/context-menu/actions/console-device-action/console-device-action.component.ts
@ -29,7 +29,7 @@ export class ConsoleDeviceActionComponent implements OnInit {
    let consoleCommand = this.settingsService.getConsoleSettings()
      ? this.settingsService.getConsoleSettings()
      : this.nodeService.getDefaultCommand();
-    const startedNodes = this.nodes.filter((node) => node.status === 'started');
+    const startedNodes = this.nodes.filter((node) => node.status === 'started' && node.console_type !== 'none');

    if (startedNodes.length === 0) {
      this.toasterService.error('Device needs to be started in order to console to it.');
@ -37,7 +37,7 @@ export class ConsoleDeviceActionComponent implements OnInit {
    }

    for (var node of this.nodes) {
-      if (node.status !== 'started') {
+      if (node.status !== 'started' && node.console_type !== 'none') {
        continue;
      }

--- a/src/app/components/project-map/drawings-editors/style-editor/style-editor.component.html
+++ b/src/app/components/project-map/drawings-editors/style-editor/style-editor.component.html
@ -2,7 +2,7 @@

 <div class="modal-form-container">
  <form [formGroup]="formGroup">
-    <mat-form-field class="form-field">
+    <mat-form-field class="form-field" *ngIf="element.fill !== undefined">
      <input
        matInput
        [ngModelOptions]="{ standalone: true }"
@ -23,7 +23,13 @@
    </mat-form-field>

    <mat-form-field class="form-field">
-      <input matInput formControlName="borderWidth" placeholder="Border width" type="number" />
+      <input
+        matInput formControlName="borderWidth"
+        placeholder="Border width"
+        type="number"
+        min="0"
+        max="100"
+      />
    </mat-form-field>

    <mat-form-field class="form-field" *ngIf="element.stroke_dasharray">
@ -36,6 +42,41 @@
      />
    </mat-form-field>

+    <mat-form-field class="form-field" *ngIf="element.width !== undefined">
+      <input
+        matInput
+        [ngModelOptions]="{ standalone: true }"
+        placeholder="Width"
+        min="0"
+        type="number"
+        [(ngModel)]="element.width"
+      />
+    </mat-form-field>
+
+    <mat-form-field class="form-field" *ngIf="element.height !== undefined">
+      <input
+        matInput
+        [ngModelOptions]="{ standalone: true }"
+        placeholder="Height"
+        min="0"
+        type="number"
+        [(ngModel)]="element.height"
+      />
+    </mat-form-field>
+
+
+    <mat-form-field class="form-field" *ngIf="element.rx !== undefined">
+      <input
+        matInput
+        [ngModelOptions]="{ standalone: true }"
+        placeholder="Corner radius"
+        type="number"
+        min="0"
+        max="100"
+        [(ngModel)]="element.rx"
+      />
+    </mat-form-field>
+
    <mat-form-field class="form-field">
      <input matInput formControlName="rotation" placeholder="Rotation" type="number" />
    </mat-form-field>
--- a/src/app/components/project-map/drawings-editors/style-editor/style-editor.component.ts
+++ b/src/app/components/project-map/drawings-editors/style-editor/style-editor.component.ts
@ -49,6 +49,8 @@ export class StyleEditorDialogComponent implements OnInit {

    if (this.drawing.element instanceof RectElement || this.drawing.element instanceof EllipseElement) {
      this.element.fill = this.drawing.element.fill;
+      this.element.width = this.drawing.element.width;
+      this.element.height = this.drawing.element.height;
      this.element.stroke = this.drawing.element.stroke;
      this.element.stroke_dasharray = this.drawing.element.stroke_dasharray;
      this.element.stroke_width = this.drawing.element.stroke_width;
@ -58,6 +60,11 @@ export class StyleEditorDialogComponent implements OnInit {
      this.element.stroke_width = this.drawing.element.stroke_width;
    }

+    if (this.drawing.element instanceof RectElement) {
+        this.element.rx = this.drawing.element.rx;
+        this.element.ry = this.drawing.element.ry;
+      }
+
    if (this.element.stroke_width === undefined) this.element.stroke_width = 0;
    this.formGroup.controls['borderWidth'].setValue(this.element.stroke_width);
    this.formGroup.controls['rotation'].setValue(this.drawing.rotation);
@ -74,6 +81,8 @@ export class StyleEditorDialogComponent implements OnInit {

      if (this.drawing.element instanceof RectElement || this.drawing.element instanceof EllipseElement) {
        this.drawing.element.fill = this.element.fill;
+        this.drawing.element.width = this.element.width;
+        this.drawing.element.height = this.element.height;
        this.drawing.element.stroke = this.element.stroke;
        this.drawing.element.stroke_dasharray = this.element.stroke_dasharray;
        this.drawing.element.stroke_width = this.element.stroke_width;
@ -83,6 +92,11 @@ export class StyleEditorDialogComponent implements OnInit {
        this.drawing.element.stroke_width = this.element.stroke_width;
      }

+      if (this.drawing.element instanceof RectElement) {
+        this.drawing.element.rx = this.element.rx;
+        this.drawing.element.ry = this.element.rx;  // set ry with rx because we don't have ry in the form
+      }
+
      let mapDrawing = this.drawingToMapDrawingConverter.convert(this.drawing);
      mapDrawing.element = this.drawing.element;

@ -100,7 +114,11 @@ export class StyleEditorDialogComponent implements OnInit {

 export class ElementData {
  fill: string;
+  width: number;
+  height: number;
  stroke: string;
  stroke_width: number;
  stroke_dasharray: string;
+  rx: number;
+  ry: number;
 }
--- a/src/app/components/project-map/import-appliance/import-appliance.component.ts
+++ b/src/app/components/project-map/import-appliance/import-appliance.component.ts
@ -91,6 +91,7 @@ export class ImportApplianceComponent implements OnInit {
        template.console_auto_start = appliance.iou.console_auto_start;
        template.ethernet_adapters = appliance.iou.ethernet_adapters;
        template.l1_keepalives = appliance.iou.l1_keepalives;
+        template.use_default_iou_values = appliance.iou.use_default_iou_values;
        template.nvram = appliance.iou.nvram;
        template.ram = appliance.iou.ram;
        template.serial_adapters = appliance.iou.serial_adapters;
@ -149,6 +150,6 @@ export class ImportApplianceComponent implements OnInit {
  }

  private getUploadPath(server: Server, emulator: string, filename: string) {
-    return `${server.protocol}//${server.host}:${server.port}/v2/${emulator}/images/${filename}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/${emulator}/images/${filename}`;
  }
 }
--- a/src/app/components/project-map/log-console/log-console.component.ts
+++ b/src/app/components/project-map/log-console/log-console.component.ts
@ -226,18 +226,20 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {
            this.showCommand(`Launching console for node ${splittedCommand[1]}...`);
            if (node.console_type === 'telnet') {
              location.assign(
-                `gns3+telnet://${node.console_host}:${node.console}?name=${node.name}&project_id=${node.project_id}&node_id=${node.node_id}`
+                `gns3+telnet://[${node.console_host}]:${node.console}?name=${node.name}&project_id=${node.project_id}&node_id=${node.node_id}`
              );
            } else if (node.console_type === 'vnc') {
              location.assign(
-                `gns3+vnc://${node.console_host}:${node.console}?name=${node.name}&project_id=${node.project_id}&node_id=${node.node_id}`
+                `gns3+vnc://[${node.console_host}]:${node.console}?name=${node.name}&project_id=${node.project_id}&node_id=${node.node_id}`
              );
-            } else if (node.console_type === 'spice') {
+            } else if (node.console_type.startsWith('spice')) {
              location.assign(
-                `gns3+spice://${node.console_host}:${node.console}?name=${node.name}&project_id=${node.project_id}&node_id=${node.node_id}`
+                `gns3+spice://[${node.console_host}]:${node.console}?name=${node.name}&project_id=${node.project_id}&node_id=${node.node_id}`
              );
+            } else if (node.console_type.startsWith('http')) {
+               window.open(`${node.console_type}://[${node.console_host}]:${node.console}`);
            } else {
-              this.showCommand('Supported console types: telnet, vnc, spice.');
+              this.showCommand('Supported console types are: telnet, vnc, spice and spice+agent');
            }
          } else {
            this.showCommand(`This node must be started before a console can be opened.`);
@ -297,28 +299,28 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {

  printNode(node: Node): string {
    return (
-      `command_line: ${node.command_line}, 
-            compute_id: ${node.compute_id}, 
-            console: ${node.console}, 
-            console_host: ${node.console_host}, 
-            console_type: ${node.console_type}, 
-            first_port_name: ${node.first_port_name}, 
-            height: ${node.height}, 
-            label: ${node.label.text}, 
-            name: ${node.name}, 
-            node_directory: ${node.node_directory}, 
-            node_id: ${node.node_id}, 
-            node_type: ${node.node_type}, 
-            port_name_format: ${node.port_name_format}, 
+      `command_line: ${node.command_line},
+            compute_id: ${node.compute_id},
+            console: ${node.console},
+            console_host: ${node.console_host},
+            console_type: ${node.console_type},
+            first_port_name: ${node.first_port_name},
+            height: ${node.height},
+            label: ${node.label.text},
+            name: ${node.name},
+            node_directory: ${node.node_directory},
+            node_id: ${node.node_id},
+            node_type: ${node.node_type},
+            port_name_format: ${node.port_name_format},
            port_segment_size: ${node.port_segment_size}, ` +
      this.printPorts(node.ports) +
-      `project_id: ${node.project_id}, 
-            status: ${node.status}, 
-            symbol: ${node.symbol}, 
-            symbol_url: ${node.symbol_url}, 
-            width: ${node.width}, 
-            x: ${node.x}, 
-            y: ${node.y}, 
+      `project_id: ${node.project_id},
+            status: ${node.status},
+            symbol: ${node.symbol},
+            symbol_url: ${node.symbol_url},
+            width: ${node.width},
+            x: ${node.x},
+            y: ${node.y},
            z: ${node.z}`
    );
  }
@ -328,31 +330,31 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {
    ports.forEach((port) => {
      response =
        response +
-        `adapter_number: ${port.adapter_number}, 
-            link_type: ${port.link_type}, 
-            name: ${port.name}, 
-            port_number: ${port.port_number}, 
+        `adapter_number: ${port.adapter_number},
+            link_type: ${port.link_type},
+            name: ${port.name},
+            port_number: ${port.port_number},
            short_name: ${port.short_name}, `;
    });
    return response;
  }

  printLink(link: Link): string {
-    return `capture_file_name: ${link.capture_file_name}, 
-            capture_file_path: ${link.capture_file_path}, 
-            capturing: ${link.capturing}, 
-            link_id: ${link.link_id}, 
-            link_type: ${link.link_type}, 
-            project_id: ${link.project_id}, 
+    return `capture_file_name: ${link.capture_file_name},
+            capture_file_path: ${link.capture_file_path},
+            capturing: ${link.capturing},
+            link_id: ${link.link_id},
+            link_type: ${link.link_type},
+            project_id: ${link.project_id},
            suspend: ${link.suspend}, `;
  }

  printDrawing(drawing: Drawing): string {
-    return `drawing_id: ${drawing.drawing_id}, 
-            project_id: ${drawing.project_id}, 
-            rotation: ${drawing.rotation}, 
-            x: ${drawing.x}, 
-            y: ${drawing.y}, 
+    return `drawing_id: ${drawing.drawing_id},
+            project_id: ${drawing.project_id},
+            rotation: ${drawing.rotation},
+            x: ${drawing.x},
+            y: ${drawing.y},
            z: ${drawing.z}`;
  }
 }
--- a/src/app/components/project-map/new-template-dialog/new-template-dialog.component.html
+++ b/src/app/components/project-map/new-template-dialog/new-template-dialog.component.html
@ -77,7 +77,7 @@
        </ng-container>

        <!-- <ng-container matColumnDef="expandedDetail">
-                    <mat-cell *matCellDef="let detail"> 
+                    <mat-cell *matCellDef="let detail">
                        The symbol for {{detail.element}}
                    </mat-cell>
                </ng-container> -->
@ -85,14 +85,14 @@
        <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
        <mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>

-        <!-- <mat-row 
+        <!-- <mat-row
                    *matRowDef="let row; columns: displayedColumns;"
-                    matRipple 
-                    class="element-row" 
+                    matRipple
+                    class="element-row"
                    [class.expanded]="expandedElement == row"
                    (click)="expandedElement = row">
                </mat-row>
-                <mat-row 
+                <mat-row
                    *matRowDef="let row; columns: ['expandedDetail']; when: isExpansionDetailRow"
                    [@detailExpand]="row.element == expandedElement ? 'expanded' : 'collapsed'"
                    style="overflow: hidden">
@ -196,6 +196,38 @@
                </div>
              </div>

+              <div class="list-item-inside" *ngIf="version.images.bios_image">
+                <span>
+                  {{ version.images.bios_image }}
+                </span>
+
+                <div>
+                  <span *ngIf="checkImageFromVersion(version.images.bios_image)"
+                    ><mat-icon matTooltip="Ready to install" matTooltipClass="custom-tooltip">check</mat-icon></span
+                  >
+                  <span *ngIf="!checkImageFromVersion(version.images.bios_image)"
+                    ><mat-icon matTooltip="Missing" matTooltipClass="custom-tooltip">close</mat-icon></span
+                  >
+
+                  <input
+                    type="file"
+                    class="non-visible"
+                    #fileBios
+                    (change)="importImage($event, version.images.bios_image)"
+                    ng2FileSelect
+                    [uploader]="uploaderImage"
+                  />
+                  <button class="button" mat-raised-button (click)="fileBios.click()">Import</button>
+                  <button
+                    class="button"
+                    mat-raised-button
+                    (click)="downloadImageFromVersion(version.images.bios_image)"
+                  >
+                    Download
+                  </button>
+                </div>
+              </div>
+
              <div class="list-item-inside" *ngIf="version.images.hda_disk_image">
                <span>
                  {{ version.images.hda_disk_image }}
@ -260,6 +292,70 @@
                </div>
              </div>

+              <div class="list-item-inside" *ngIf="version.images.hdc_disk_image">
+                <span>
+                  {{ version.images.hdb_disk_image }}
+                </span>
+
+                <div>
+                  <span *ngIf="checkImageFromVersion(version.images.hdc_disk_image)"
+                    ><mat-icon matTooltip="Ready to install" matTooltipClass="custom-tooltip">check</mat-icon></span
+                  >
+                  <span *ngIf="!checkImageFromVersion(version.images.hdc_disk_image)"
+                    ><mat-icon matTooltip="Missing" matTooltipClass="custom-tooltip">close</mat-icon></span
+                  >
+
+                  <input
+                    type="file"
+                    class="non-visible"
+                    #file4
+                    (change)="importImage($event, version.images.hdc_disk_image)"
+                    ng2FileSelect
+                    [uploader]="uploaderImage"
+                  />
+                  <button class="button" mat-raised-button (click)="file4.click()">Import</button>
+                  <button
+                    class="button"
+                    mat-raised-button
+                    (click)="downloadImageFromVersion(version.images.hdc_disk_image)"
+                  >
+                    Download
+                  </button>
+                </div>
+              </div>
+
+              <div class="list-item-inside" *ngIf="version.images.hdd_disk_image">
+                <span>
+                  {{ version.images.hdd_disk_image }}
+                </span>
+
+                <div>
+                  <span *ngIf="checkImageFromVersion(version.images.hdd_disk_image)"
+                    ><mat-icon matTooltip="Ready to install" matTooltipClass="custom-tooltip">check</mat-icon></span
+                  >
+                  <span *ngIf="!checkImageFromVersion(version.images.hdd_disk_image)"
+                    ><mat-icon matTooltip="Missing" matTooltipClass="custom-tooltip">close</mat-icon></span
+                  >
+
+                  <input
+                    type="file"
+                    class="non-visible"
+                    #file5
+                    (change)="importImage($event, version.images.hdd_disk_image)"
+                    ng2FileSelect
+                    [uploader]="uploaderImage"
+                  />
+                  <button class="button" mat-raised-button (click)="file5.click()">Import</button>
+                  <button
+                    class="button"
+                    mat-raised-button
+                    (click)="downloadImageFromVersion(version.images.hdd_disk_image)"
+                  >
+                    Download
+                  </button>
+                </div>
+              </div>
+
              <div class="list-item-inside" *ngIf="version.images.cdrom_image">
                <span>
                  {{ version.images.cdrom_image}}
@ -276,12 +372,12 @@
                  <input
                    type="file"
                    class="non-visible"
-                    #file4
+                    #file6
                    (change)="importImage($event, version.images.cdrom_image)"
                    ng2FileSelect
                    [uploader]="uploaderImage"
                  />
-                  <button class="button" mat-raised-button (click)="file4.click()">Import</button>
+                  <button class="button" mat-raised-button (click)="file6.click()">Import</button>
                  <button
                    class="button"
                    mat-raised-button
--- a/src/app/components/project-map/new-template-dialog/new-template-dialog.component.ts
+++ b/src/app/components/project-map/new-template-dialog/new-template-dialog.component.ts
@ -320,17 +320,17 @@ export class NewTemplateDialogComponent implements OnInit {
        setTimeout(() => {
          if (this.qemuBinaries.length) {
            if (this.applianceToInstall.qemu.arch === 'x86_64') {
-              let filtered_binaries = this.qemuBinaries.filter((n) => n.path.includes('qemu-system-x86_64'));
+              let filtered_binaries = this.qemuBinaries.filter((n) => n.path.endsWith('qemu-system-x86_64'));
              if (filtered_binaries.length) {
                this.selectedBinary = filtered_binaries[0];
              }
            } else if (this.applianceToInstall.qemu.arch === 'i386') {
-              let filtered_binaries = this.qemuBinaries.filter((n) => n.path.includes('qemu-system-i386'));
+              let filtered_binaries = this.qemuBinaries.filter((n) => n.path.endsWith('qemu-system-i386'));
              if (filtered_binaries.length) {
                this.selectedBinary = filtered_binaries[0];
              }
-            } else if (this.applianceToInstall.qemu.arch === 'x86_64') {
-              let filtered_binaries = this.qemuBinaries.filter((n) => n.path.includes('qemu-system-arm'));
+            } else if (this.applianceToInstall.qemu.arch === 'arm') {
+              let filtered_binaries = this.qemuBinaries.filter((n) => n.path.endsWith('qemu-system-arm'));
              if (filtered_binaries.length) {
                this.selectedBinary = filtered_binaries[0];
              }
@ -364,7 +364,7 @@ export class NewTemplateDialogComponent implements OnInit {
          autoFocus: false,
          disableClose: true,
        });
-        dialogRef.componentInstance.confirmationMessage = `This is not the correct file. 
+        dialogRef.componentInstance.confirmationMessage = `This is not the correct file.
                    The MD5 sum is ${output} and should be ${imageToInstall.md5sum}. Do you want to accept it at your own risks?`;
        dialogRef.afterClosed().subscribe((answer: boolean) => {
          if (answer) {
@ -485,7 +485,7 @@ export class NewTemplateDialogComponent implements OnInit {
    iouTemplate.startup_config = this.applianceToInstall.iou.startup_config;
    iouTemplate.builtin = this.applianceToInstall.builtin;
    iouTemplate.category = this.getCategory();
-    iouTemplate.default_name_format = this.applianceToInstall.port_name_format;
+    iouTemplate.default_name_format = this.applianceToInstall.default_name_format;
    iouTemplate.symbol = this.applianceToInstall.symbol;
    iouTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
    iouTemplate.template_id = uuid();
@ -534,7 +534,7 @@ export class NewTemplateDialogComponent implements OnInit {
    iosTemplate.slot7 = this.applianceToInstall.dynamips.slot7;
    iosTemplate.builtin = this.applianceToInstall.builtin;
    iosTemplate.category = this.getCategory();
-    iosTemplate.default_name_format = this.applianceToInstall.port_name_format;
+    iosTemplate.default_name_format = this.applianceToInstall.default_name_format;
    iosTemplate.symbol = this.applianceToInstall.symbol;
    iosTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
    iosTemplate.template_id = uuid();
@ -572,7 +572,7 @@ export class NewTemplateDialogComponent implements OnInit {
    dockerTemplate.console_type = this.applianceToInstall.docker.console_type;
    dockerTemplate.builtin = this.applianceToInstall.builtin;
    dockerTemplate.category = this.getCategory();
-    dockerTemplate.default_name_format = this.applianceToInstall.port_name_format;
+    dockerTemplate.default_name_format = this.applianceToInstall.default_name_format;
    dockerTemplate.symbol = this.applianceToInstall.symbol;
    dockerTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
    dockerTemplate.template_id = uuid();
@ -629,12 +629,17 @@ export class NewTemplateDialogComponent implements OnInit {
    qemuTemplate.category = this.getCategory();
    qemuTemplate.first_port_name = this.applianceToInstall.first_port_name;
    qemuTemplate.port_name_format = this.applianceToInstall.port_name_format;
+    qemuTemplate.port_segment_size = this.applianceToInstall.port_segment_size;
+    qemuTemplate.default_name_format = this.applianceToInstall.default_name_format
    qemuTemplate.symbol = this.applianceToInstall.symbol;
    qemuTemplate.qemu_path = this.selectedBinary.path;
    qemuTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
    qemuTemplate.template_id = uuid();
    qemuTemplate.hda_disk_image = version.images.hda_disk_image;
    qemuTemplate.hdb_disk_image = version.images.hdb_disk_image;
+    qemuTemplate.hdc_disk_image = version.images.hdc_disk_image;
+    qemuTemplate.hdd_disk_image = version.images.hdd_disk_image;
+    qemuTemplate.cdrom_image = version.images.cdrom_image;
    qemuTemplate.template_type = 'qemu';
    qemuTemplate.usage = this.applianceToInstall.usage;

--- a/src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.html
+++ b/src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.html
@ -101,7 +101,7 @@

            <h6>Additional directories</h6>
            <mat-form-field class="form-field">
-              <textarea matInput type="text" [(ngModel)]="node.properties.extra_volumes"></textarea>
+              <textarea matInput type="text" [(ngModel)]="additionalDirectories"></textarea>
            </mat-form-field>
          </mat-tab>

--- a/src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.ts
+++ b/src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.ts
@ -20,13 +20,14 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
  name: string;
  generalSettingsForm: FormGroup;
  consoleTypes: string[] = [];
-  consoleResolutions: string[] = ['640x480', '800x600', '1024x768', '1280x800', '1280x1024', '1366x768', '1920x1080'];
+  consoleResolutions: string[] = ['2560x1440', '1920x1080', '1680x1050', '1440x900', '1366x768', '1280x1024', '1280x800', '1024x768', '800x600', '640x480'];
  private conf = {
    autoFocus: false,
    width: '800px',
    disableClose: true,
  };
  dialogRef;
+  additionalDirectories: string = "";

  constructor(
    public dialogReference: MatDialogRef<ConfiguratorDialogDockerComponent>,
@ -39,7 +40,7 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
    this.generalSettingsForm = this.formBuilder.group({
      name: new FormControl('', Validators.required),
      adapter: new FormControl('', Validators.required),
-      startCommand: new FormControl('', Validators.required),
+      startCommand: new FormControl(''),
      consoleHttpPort: new FormControl('', Validators.required),
      consoleHttpPath: new FormControl('', Validators.required),
    });
@ -50,6 +51,12 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
      this.node = node;
      this.name = node.name;
      this.getConfiguration();
+      if (this.node.properties.extra_volumes && this.node.properties.extra_volumes.length>0) {
+        for (let index = 0; index < this.node.properties.extra_volumes.length - 1; index++) {
+          this.additionalDirectories = this.additionalDirectories + this.node.properties.extra_volumes[index] + "\n";
+        }
+        this.additionalDirectories = this.additionalDirectories + this.node.properties.extra_volumes[this.node.properties.extra_volumes.length - 1];
+      }
    });
  }

@ -72,7 +79,16 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
  }

  onSaveClick() {
+    var extraVolumes = this.additionalDirectories.split("\n").filter(elem => elem != "");
+    for (const item of extraVolumes) {
+      console.log(item);
+      if (!item.startsWith("/")) {
+        this.toasterService.error(`Wrong format for additional directories.`);
+        return;
+      }
+    }
    if (this.generalSettingsForm.valid) {
+      this.node.properties.extra_volumes = extraVolumes;
      this.nodeService.updateNode(this.server, this.node).subscribe(() => {
        this.toasterService.success(`Node ${this.node.name} updated.`);
        this.onCancelClick();
--- a/src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.html
+++ b/src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.html
@ -20,13 +20,14 @@
              </mat-select>
            </mat-form-field>
            <mat-checkbox [(ngModel)]="node.console_auto_start"> Auto start console </mat-checkbox><br />
-            <mat-form-field class="form-field">
+            <mat-checkbox [(ngModel)]="node.properties.use_default_iou_values"> Use default IOU values for memories </mat-checkbox>
+            <mat-form-field class="form-field" *ngIf="!node.properties.use_default_iou_values">
              <input matInput type="number" [(ngModel)]="node.properties.ram" placeholder="RAM size" />
              <span matSuffix>MB</span>
            </mat-form-field>
-            <mat-form-field class="form-field">
+            <mat-form-field class="form-field" *ngIf="!node.properties.use_default_iou_values">
              <input matInput type="number" [(ngModel)]="node.properties.nvram" placeholder="NVRAM size" />
-              <span matSuffix>MB</span>
+              <span matSuffix>KB</span>
            </mat-form-field>
          </mat-tab>

@ -38,7 +39,7 @@
                  matInput
                  formControlName="ethernetAdapters"
                  type="number"
-                  [(ngModel)]="node.ethernet_adapters"
+                  [(ngModel)]="node.properties.ethernet_adapters"
                  placeholder="Ethernet adapters"
                />
              </mat-form-field>
@ -47,7 +48,7 @@
                  matInput
                  formControlName="serialAdapters"
                  type="number"
-                  [(ngModel)]="node.serial_adapters"
+                  [(ngModel)]="node.properties.serial_adapters"
                  placeholder="Serial adapters"
                />
              </mat-form-field>
--- a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.html
+++ b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.html
@ -238,6 +238,12 @@
                <mat-form-field class="form-field">
                  <input matInput type="text" [(ngModel)]="node.properties.options" placeholder="Options" />
                </mat-form-field>
+                <br /><mat-checkbox [(ngModel)]="node.properties.tpm">
+                   Enable the Trusted Platform Module (TPM)
+                 </mat-checkbox>
+                <br /><mat-checkbox [(ngModel)]="node.properties.uefi">
+                   Enable the UEFI boot mode
+                 </mat-checkbox>
              </mat-card-content>
            </mat-card>
          </mat-tab>
--- a/src/app/components/project-map/packet-capturing/start-capture/start-capture.component.ts
+++ b/src/app/components/project-map/packet-capturing/start-capture/start-capture.component.ts
@ -56,7 +56,7 @@ export class StartCaptureDialogComponent implements OnInit {
    const sourcePort = sourceNode.ports[this.link.nodes[0].port_number];
    const targetPort = targetNode.ports[this.link.nodes[1].port_number];
    this.inputForm.controls['fileName'].setValue(
-      `${sourceNode.name}_${sourcePort.name}_to_${targetNode.name}_${targetPort.name}`
+      `${sourceNode.name}_${sourcePort.name}_to_${targetNode.name}_${targetPort.name}`.replace(new RegExp('[^0-9A-Za-z_-]', 'g'), '')
    );
  }

--- a/src/app/components/project-map/project-map-menu/project-map-menu.component.ts
+++ b/src/app/components/project-map/project-map-menu/project-map-menu.component.ts
@ -104,6 +104,13 @@ export class ProjectMapMenuComponent implements OnInit, OnDestroy {
  }

  public addDrawing(selectedObject: string) {
+    if ((selectedObject === 'rectangle' && this.drawTools.isRectangleChosen) || (selectedObject === 'ellipse' && this.drawTools.isEllipseChosen) ||
+    (selectedObject === 'line' && this.drawTools.isLineChosen) || (selectedObject === 'text' && this.drawTools.isTextChosen)) {
+      document.documentElement.style.cursor = "default";
+    } else {
+      document.documentElement.style.cursor = "crosshair";
+    }
+
    switch (selectedObject) {
      case 'rectangle':
        this.drawTools.isTextChosen = false;
@ -140,6 +147,8 @@ export class ProjectMapMenuComponent implements OnInit, OnDestroy {
  }

  public resetDrawToolChoice() {
+    document.documentElement.style.cursor = "default";
+
    this.drawTools.isRectangleChosen = false;
    this.drawTools.isEllipseChosen = false;
    this.drawTools.isLineChosen = false;
--- a/src/app/components/project-map/project-map.component.html
+++ b/src/app/components/project-map/project-map.component.html
@ -67,6 +67,14 @@
      </div>
    </div>
    <div>
+      <button
+        class="map-settings-button"
+        matTooltip="Project Map Settings"
+        matTooltipClass="custom-tooltip"
+        mat-icon-button
+        [matMenuTriggerFor]="viewMenu">
+        <mat-icon>view_module</mat-icon>
+      </button>
      <button
        matTooltip="Toggle topology/servers summary"
        matTooltipClass="custom-tooltip"
@ -83,39 +91,27 @@

    <!-- GNS3 menu -->
    <mat-menu #mainMenu="matMenu" [overlapTrigger]="false">
+      <button mat-menu-item [matMenuTriggerFor]="projectMenu">
+        <mat-icon>insert_drive_file</mat-icon>
+        <span>Project settings</span>
+      </button>
      <button mat-menu-item [routerLink]="['/server', server.id, 'projects']">
        <mat-icon>work</mat-icon>
-        <span>Go to projects</span>
+        <span>Projects</span>
      </button>
      <button mat-menu-item [routerLink]="['/servers']">
        <mat-icon>developer_board</mat-icon>
-        <span>Go to servers</span>
-      </button>
-      <button mat-menu-item routerLink="/server/{{ server.id }}/preferences">
-        <mat-icon>settings_applications</mat-icon>
-        <span>Go to preferences</span>
+        <span>Servers</span>
      </button>
      <button mat-menu-item routerLink="/server/{{ server.id }}/systemstatus">
-        <mat-icon>info</mat-icon>
-        <span>Go to system status</span>
+        <mat-icon>data_usage</mat-icon>
+        <span>System Status</span>
      </button>
      <button mat-menu-item routerLink="/settings">
        <mat-icon>settings</mat-icon>
-        <span>Go to settings</span>
-      </button>
-      <button mat-menu-item (click)="addNewTemplate()">
-        <mat-icon>control_point</mat-icon>
-        <span>New template</span>
+        <span>Settings</span>
      </button>
      <app-import-appliance [server]="server" [project]="project"></app-import-appliance>
-      <button mat-menu-item [matMenuTriggerFor]="projectMenu">
-        <mat-icon>settings</mat-icon>
-        <span>Project settings</span>
-      </button>
-      <button mat-menu-item [matMenuTriggerFor]="viewMenu">
-        <mat-icon>view_module</mat-icon>
-        <span>Map settings</span>
-      </button>
    </mat-menu>

    <!-- Project Settings sub-menu -->
@ -256,4 +252,4 @@
  </div>
 </div>

-<ng-template #topologySummaryContainer></ng-template>
+<ng-template #topologySummaryContainer></ng-template>
--- a/src/app/components/project-map/project-map.component.scss
+++ b/src/app/components/project-map/project-map.component.scss
@ -73,6 +73,10 @@ g.node:hover {
    font-size: 28px !important;
  }

+  .map-settings-button mat-icon {
+    font-size: 22px !important;
+  }
+
  .selected {
    background: rgba(0, 151, 167, 0.1);

--- a/src/app/components/project-map/project-map.component.ts
+++ b/src/app/components/project-map/project-map.component.ts
@ -174,7 +174,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
    private nodeConsoleService: NodeConsoleService,
    private symbolService: SymbolService,
    private cd: ChangeDetectorRef,
-    private cfr: ComponentFactoryResolver, 
+    private cfr: ComponentFactoryResolver,
    private injector: Injector
  ) {}

@ -229,7 +229,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
        this.instance.instance.ngOnDestroy();
        this.instance.destroy();
      }
-    } 
+    }
  }

  addSubscriptions() {
@ -250,7 +250,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
      this.nodesDataSource.changes.subscribe((nodes: Node[]) => {
        if (!this.server) return;
        nodes.forEach(async (node: Node) => {
-          node.symbol_url = `${this.server.protocol}//${this.server.host}:${this.server.port}/v2/symbols/${node.symbol}/raw`;
+          node.symbol_url = `${this.server.protocol}://${this.server.host}:${this.server.port}/v2/symbols/${node.symbol}/raw`;

          // if (node.width == 0 && node.height == 0) {
          //   let symbolDimensions = await this.symbolService.getDimensions(this.server, node.symbol).toPromise();
@ -334,7 +334,6 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
            this.toggleShowTopologySummary(this.mapSettingsService.isTopologySummaryVisible);

            this.recentlyOpenedProjectService.setServerId(this.server.id.toString());
-            this.recentlyOpenedProjectService.setProjectId(this.project.project_id);

            if (this.project.status === 'opened') {
              return new Observable<Project>((observer) => {
@ -423,12 +422,22 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
              this.toasterService.success('Node has been deleted');
            });
          });
-        }
+
+        selected
+          .filter((item) => item instanceof MapDrawing)
+          .forEach((item: MapDrawing) => {
+            const drawing = this.mapDrawingToDrawing.convert(item);
+            this.drawingService.delete(this.server, drawing).subscribe((data) => {
+              this.toasterService.success('Drawing has been deleted');
+            });
+          });
+      }
    });
  }

  onProjectLoad(project: Project) {
    this.readonly = this.projectService.isReadOnly(project);
+    this.recentlyOpenedProjectService.setProjectId(this.project.project_id);

    const subscription = this.projectService
      .nodes(this.server, project.project_id)
@ -981,8 +990,8 @@ export class ProjectMapComponent implements OnInit, OnDestroy {

    fileReader.onloadend = () => {
      let image = fileReader.result;
-      let svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" 
-                height=\"${imageToUpload.height}\" width=\"${imageToUpload.width}\">\n<image height=\"${imageToUpload.height}\" width=\"${imageToUpload.width}\" 
+      let svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"
+                height=\"${imageToUpload.height}\" width=\"${imageToUpload.width}\">\n<image height=\"${imageToUpload.height}\" width=\"${imageToUpload.width}\"
                xlink:href=\"${image}\"/>\n</svg>`;
      this.drawingService
        .add(this.server, this.project.project_id, -(imageToUpload.width / 2), -(imageToUpload.height / 2), svg)
--- a/src/app/components/projects/projects.component.html
+++ b/src/app/components/projects/projects.component.html
@ -2,6 +2,7 @@
  <div class="default-header">
    <div class="row">
      <h1 class="col">Projects</h1>
+      <button class="col" mat-raised-button (click)="goToSystemStatus()" class="add-button">Go to system status</button>
      <button class="col" mat-raised-button (click)="goToPreferences()" class="add-button">Go to preferences</button>
      <button class="col" mat-raised-button color="primary" (click)="addBlankProject()" class="add-button">
        Add blank project
--- a/src/app/components/projects/projects.component.ts
+++ b/src/app/components/projects/projects.component.ts
@ -89,6 +89,12 @@ export class ProjectsComponent implements OnInit {
      .catch((error) => this.toasterService.error('Cannot navigate to the preferences'));
  }

+  goToSystemStatus() {
+    this.router
+      .navigate(['/server', this.server.id, 'systemstatus'])
+      .catch((error) => this.toasterService.error('Cannot navigate to the system status'));
+  }
+
  refresh() {
    this.projectService.list(this.server).subscribe(
      (projects: Project[]) => {
--- a/src/app/components/servers/add-server-dialog/add-server-dialog.component.ts
+++ b/src/app/components/servers/add-server-dialog/add-server-dialog.component.ts
@ -16,8 +16,8 @@ export class AddServerDialogComponent implements OnInit {
    { key: 'basic', name: 'Basic authorization' },
  ];
  protocols = [
-    { key: 'http:', name: 'HTTP' },
-    { key: 'https:', name: 'HTTPS' },
+    { key: 'http', name: 'HTTP' },
+    { key: 'https', name: 'HTTPS' },
  ];
  locations = [];

@ -28,7 +28,7 @@ export class AddServerDialogComponent implements OnInit {
    ubridge_path: new FormControl(''),
    host: new FormControl('', [Validators.required]),
    port: new FormControl('', [Validators.required, Validators.min(1)]),
-    protocol: new FormControl('http:'),
+    protocol: new FormControl('http'),
    authorization: new FormControl('none'),
    login: new FormControl(''),
    password: new FormControl(''),
--- a/src/app/components/settings/settings.component.html
+++ b/src/app/components/settings/settings.component.html
@ -11,6 +11,7 @@

          <div>
            <mat-checkbox [(ngModel)]="settings.crash_reports">Send anonymous crash reports</mat-checkbox><br />
+            <mat-checkbox [(ngModel)]="settings.anonymous_statistics">Send anonymous usage statistics</mat-checkbox><br />
            <mat-checkbox [(ngModel)]="integrateLinksLabelsToLinks">Integrate link labels to links</mat-checkbox><br />
            <mat-checkbox [(ngModel)]="openConsolesInWidget">Open consoles in the widget instead of in new tabs after clicking start consoles for all nodes</mat-checkbox>
          </div>
--- a/src/app/components/settings/settings.component.spec.ts
+++ b/src/app/components/settings/settings.component.spec.ts
@ -69,6 +69,7 @@ describe('SettingsComponent', () => {
    const settings = {
      crash_reports: true,
      experimental_features: true,
+      anonymous_statistics: true,
      angular_map: false,
      console_command: '',
    };
--- a/src/app/components/template/template-list-dialog/template-list-dialog.component.html
+++ b/src/app/components/template/template-list-dialog/template-list-dialog.component.html
@ -1,5 +1,5 @@
 <div class="title-container">
-  <h1 mat-dialog-title>Add a node</h1>
+  <h1 mat-dialog-title>Insert New Node</h1>
  <button
    mat-button
    class="top-button"
--- a/src/app/components/template/template.component.html
+++ b/src/app/components/template/template.component.html
@ -10,63 +10,95 @@
 </button>

 <mat-menu #mainMenu="matMenu">
-  <button mat-menu-item (click)="openDialog()">
-    <mat-icon>add_to_queue</mat-icon>
-    <span>Open dialog to configure</span>
-  </button>
+   <div class="templateMenu">
+     <div class="templateMenuHeader">
+        <button mat-menu-item (click)="openDialog()">
+         <mat-icon>add_to_queue</mat-icon>
+         <span>
+            Insert New Node...
+         </span>
+        </button>
+        <button mat-menu-item (click)="addNewTemplate()">
+         <mat-icon>library_add</mat-icon>
+         <span>
+            New Template...
+         </span>
+        </button>
+     </div>

-  <mat-form-field (click)="$event.stopPropagation()" class="form-field" floatPlaceholder="never">
-    <input
-      matInput
-      placeholder="Search by name"
-      (keyup)="filterTemplates($event)"
-      [(ngModel)]="searchText"
-      [ngModelOptions]="{ standalone: true }"
-    />
-  </mat-form-field>
-  <mat-form-field (click)="$event.stopPropagation()" class="form-field">
-    <mat-select
-      [ngModelOptions]="{ standalone: true }"
-      placeholder="Filter templates by type"
-      (selectionChange)="filterTemplates($event)"
-      [(ngModel)]="selectedType"
-    >
-      <mat-option *ngFor="let type of templateTypes" [value]="type">
-        {{ type }}
-      </mat-option>
-    </mat-select>
-  </mat-form-field>
+     <div class="templateFilterBar">
+        <mat-form-field (click)="$event.stopPropagation()" class="form-field" floatPlaceholder="never">
+         <input
+           matInput
+           placeholder="Filter by name"
+           search="search"
+           (keyup)="filterTemplates($event)"
+           [(ngModel)]="searchText"
+           [ngModelOptions]="{ standalone: true }"
+         />
+         <mat-icon class="searchIcon" matSuffix>search</mat-icon>
+       </mat-form-field>
+       <mat-form-field (click)="$event.stopPropagation()" class="form-field">
+         <mat-select
+           [ngModelOptions]="{ standalone: true }"
+           placeholder="Filter by type"
+           (selectionChange)="filterTemplates($event)"
+           [(ngModel)]="selectedType"
+         >
+           <mat-option *ngFor="let type of templateTypes" [value]="type">
+             {{ type }}
+           </mat-option>
+         </mat-select>
+       </mat-form-field>
+     </div>

-  <div class="menu">
-    <div class="templateList">
-      <mat-list-item *ngFor="let template of filteredTemplates; let i = index">
-        <span *ngIf="i % 4 === 0" class="templateRow">
-          <span class="templateIcon">
-            <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i])">
-              <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i])" />
-            </div>
-            <div class="templateText">{{ filteredTemplates[i].name }}</div>
-          </span>
-          <span *ngIf="filteredTemplates[i + 1]" class="templateIcon">
-            <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 1])">
-              <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 1])" />
-            </div>
-            <div class="templateText">{{ filteredTemplates[i + 1].name }}</div>
-          </span>
-          <span *ngIf="filteredTemplates[i + 2]" class="templateIcon">
-            <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 2])">
-              <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 2])" />
-            </div>
-            <div class="templateText">{{ filteredTemplates[i + 2].name }}</div>
-          </span>
-          <span *ngIf="filteredTemplates[i + 3]" class="templateIcon">
-            <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 3])">
-              <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 3])" />
-            </div>
-            <div class="templateText">{{ filteredTemplates[i + 3].name }}</div>
-          </span>
-        </span>
-      </mat-list-item>
-    </div>
-  </div>
-</mat-menu>
+     <div class="menu">
+       <div class="templateList">
+         <mat-list-item *ngFor="let template of filteredTemplates; let i = index">
+           <span *ngIf="i % 4 === 0" class="templateRow">
+             <span class="templateIcon">
+               <div
+                 mwlDraggable
+                 (dragStart)="dragStart($event)"
+                 (dragEnd)="dragEnd($event, filteredTemplates[i])"
+                 class="iconContainer">
+                 <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i])" />
+               </div>
+               <div class="templateText">{{ filteredTemplates[i].name }}</div>
+             </span>
+             <span *ngIf="filteredTemplates[i + 1]" class="templateIcon">
+               <div
+                 mwlDraggable
+                 (dragStart)="dragStart($event)"
+                 (dragEnd)="dragEnd($event, filteredTemplates[i + 1])"
+                 class="iconContainer">
+                 <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 1])" />
+               </div>
+               <div class="templateText">{{ filteredTemplates[i + 1].name }}</div>
+             </span>
+             <span *ngIf="filteredTemplates[i + 2]" class="templateIcon">
+               <div
+                 mwlDraggable
+                 (dragStart)="dragStart($event)"
+                 (dragEnd)="dragEnd($event, filteredTemplates[i + 2])"
+                 class="iconContainer">
+                 <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 2])" />
+               </div>
+               <div class="templateText">{{ filteredTemplates[i + 2].name }}</div>
+             </span>
+             <span *ngIf="filteredTemplates[i + 3]" class="templateIcon">
+               <div
+                 mwlDraggable
+                 (dragStart)="dragStart($event)"
+                 (dragEnd)="dragEnd($event, filteredTemplates[i + 3])"
+                 class="iconContainer">
+                 <img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 3])" />
+               </div>
+               <div class="templateText">{{ filteredTemplates[i + 3].name }}</div>
+             </span>
+           </span>
+         </mat-list-item>
+       </div>
+     </div>
+   </div>
+</mat-menu>
--- a/src/app/components/template/template.component.scss
+++ b/src/app/components/template/template.component.scss
@ -1,6 +1,7 @@
 ::ng-deep .mat-menu-panel {
  max-width: 400px;
-  max-height: 500px;
+  max-height: 640px;
+  border-radius: 8px;
 }

 .menu {
@ -8,6 +9,26 @@
  overflow-y: scroll;
  scrollbar-color: darkgrey #263238;
  scrollbar-width: thin;
+  font-size: 12px;
+}
+
+.templateMenuHeader {
+   border-bottom: 1px solid rgba(255,255,255,0.05);
+}
+
+.templateFilterBar {
+   padding: 10px 2%;
+   background-color: rgba(0,0,0,0.2);
+   margin-bottom: 10px;
+}
+
+.templateFilterBar > .form-field {
+   font-size: 12px;
+}
+
+.templateFilterBar .searchIcon {
+   position: relative;
+   top: 5px;
 }

 ::-webkit-scrollbar {
@ -24,20 +45,22 @@
 }

 .form-field {
-  width: 90%;
-  margin-left: 5%;
-  margin-right: 5%;
+  width: 44%;
+  margin-left: 3%;
+  margin-right: 3%;
 }

 .image {
-  width: 65px;
-  height: 65px;
+  display: inline-block;
+  width: 55px;
+  height: 55px;
  filter: invert(0);
  --webkit-filter: invert(0) !important;
 }

 .templateList {
  width: 100%;
+  padding: 10px;
 }

 .templateRow {
@ -50,6 +73,23 @@
 }

 .templateIcon {
-  width: 80px !important;
-  padding: 10px;
+  width: 90px !important;
+  padding: 2px 5px;
+  text-align: center;
+  margin: 3px;
+}
+
+.templateIcon > .iconContainer {
+   display: inline-flex;
+   align-items: center;
+   justify-content: center;
+   width: 70px;
+   height: 70px;
+   margin-bottom: 10px;
+   border-radius: 50%;
+   cursor: move;
+}
+
+.templateIcon > .iconContainer:hover {
+   background-color: rgba(237, 246, 231, 0.08);
 }
--- a/src/app/components/template/template.component.ts
+++ b/src/app/components/template/template.component.ts
@ -8,6 +8,7 @@ import { MapScaleService } from '../../services/mapScale.service';
 import { SymbolService } from '../../services/symbol.service';
 import { TemplateService } from '../../services/template.service';
 import { NodeAddedEvent, TemplateListDialogComponent } from './template-list-dialog/template-list-dialog.component';
+import { NewTemplateDialogComponent } from '../project-map/new-template-dialog/new-template-dialog.component';

@Component({
  selector: 'app-template',
@ -127,8 +128,21 @@ export class TemplateComponent implements OnInit, OnDestroy {
    });
  }

+  addNewTemplate() {
+    const dialogRef = this.dialog.open(NewTemplateDialogComponent, {
+      width: '1000px',
+      maxHeight: '700px',
+      autoFocus: false,
+      disableClose: true,
+    });
+
+    let instance = dialogRef.componentInstance;
+    instance.server = this.server;
+    instance.project = this.project;
+  }
+
  getImageSourceForTemplate(template: Template) {
-    return `${this.server.protocol}//${this.server.host}:${this.server.port}/v2/symbols/${template.symbol}/raw`;
+    return `${this.server.protocol}://${this.server.host}:${this.server.port}/v2/symbols/${template.symbol}/raw`;
  }

  ngOnDestroy() {
--- a/src/app/components/topology-summary/topology-summary.component.html
+++ b/src/app/components/topology-summary/topology-summary.component.html
@ -61,7 +61,7 @@
                {{ node.name }}
              </div>
              <div *ngIf="node.console != null && node.console != undefined && node.console_type != 'none'">
-                {{ node.console_type }} {{ node.console_host }}:{{ node.console }}
+                {{ node.console_type }}://{{ node.console_host }}:{{ node.console }}
              </div>
              <div *ngIf="node.console === null || node.console === undefined || node.console_type === 'none'">
                none
--- a/src/app/components/topology-summary/topology-summary.component.ts
+++ b/src/app/components/topology-summary/topology-summary.component.ts
@ -78,7 +78,28 @@ export class TopologySummaryComponent implements OnInit, OnDestroy {
      this.computes = computes;
    });

-    this.style = { top: '60px', right: '0px', width: '320px', height: '400px' };
+    this.revertPosition();
+  }
+
+  revertPosition(){
+    let leftPosition = localStorage.getItem('leftPosition');
+    let rightPosition = localStorage.getItem('rightPosition');
+    let topPosition = localStorage.getItem('topPosition');
+    let widthOfWidget = localStorage.getItem('widthOfWidget');
+    let heightOfWidget = localStorage.getItem('heightOfWidget');
+
+    if (!topPosition) {
+      this.style = { top: '60px', right: '0px', width: '320px', height: '400px' };
+    } else {
+      this.style = {
+        position: 'fixed',
+        left: `${+leftPosition}px`,
+        right: `${+rightPosition}px`,
+        top: `${+topPosition}px`,
+        width: `${+widthOfWidget}px`,
+        height: `${+heightOfWidget}px`,
+      };
+    }
  }

  toggleDragging(value: boolean) {
@ -101,6 +122,12 @@ export class TopologySummaryComponent implements OnInit, OnDestroy {
        width: `${width}px`,
        height: `${height}px`,
      };
+
+      localStorage.setItem('leftPosition', left.toString());
+      localStorage.setItem('topPosition', top.toString());
+      localStorage.setItem('widthOfWidget', width.toString());
+      localStorage.setItem('heightOfWidget', height.toString());
+
    } else {
      let right: number = Number(this.style['right'].split('px')[0]) - x;
      this.style = {
@ -110,6 +137,11 @@ export class TopologySummaryComponent implements OnInit, OnDestroy {
        width: `${width}px`,
        height: `${height}px`,
      };
+
+      localStorage.setItem('rightPosition', right.toString());
+      localStorage.setItem('topPosition', top.toString());
+      localStorage.setItem('widthOfWidget', width.toString());
+      localStorage.setItem('heightOfWidget', height.toString());
    }
  }

@ -140,6 +172,7 @@ export class TopologySummaryComponent implements OnInit, OnDestroy {

  toggleTopologyVisibility(value: boolean) {
    this.isTopologyVisible = value;
+    this.revertPosition();
  }

  compareAsc(first: Node, second: Node) {
--- a/src/app/models/appliance.ts
+++ b/src/app/models/appliance.ts
@ -55,6 +55,9 @@ export interface Iou {
 export interface Images {
  hda_disk_image: string;
  hdb_disk_image: string;
+  hdc_disk_image: string;
+  hdd_disk_image: string;
+  cdrom_image: string;
 }

 export interface Version {
@ -74,11 +77,13 @@ export interface Appliance {
  maintainer_email: string;
  name: string;
  port_name_format: string;
+  port_segment_size: number;
  product_name: string;
  product_url: string;
  registry_version: number;
  status: string;
  symbol: string;
+  default_name_format: string;
  usage: string;
  vendor_name: string;
  vendor_url: string;
--- a/src/app/models/server.ts
+++ b/src/app/models/server.ts
@ -1,7 +1,7 @@
 export type ServerAuthorization = 'basic' | 'none';
 export type ServerLocation = 'local' | 'remote' | 'bundled';
 export type ServerStatus = 'stopped' | 'starting' | 'running';
-export type ServerProtocol = 'http:' | 'https:';
+export type ServerProtocol = 'http' | 'https';

 export class Server {
  id: number;
--- a/src/app/models/templates/qemu-template.ts
+++ b/src/app/models/templates/qemu-template.ts
@ -43,4 +43,7 @@ export class QemuTemplate {
  template_id: string;
  template_type: string;
  usage: string;
+  replicate_network_connection_state: boolean;
+  tpm: boolean;
+  uefi: boolean;
 }
--- a/src/app/services/appliances.service.ts
+++ b/src/app/services/appliances.service.ts
@ -17,7 +17,7 @@ export class ApplianceService {
  }

  getUploadPath(server: Server, emulator: string, filename: string) {
-    return `${server.protocol}//${server.host}:${server.port}/v2/compute/${emulator}/images/${filename}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/compute/${emulator}/images/${filename}`;
  }

  updateAppliances(server: Server): Observable<Appliance[]> {
--- a/src/app/services/compute.service.ts
+++ b/src/app/services/compute.service.ts
@ -14,7 +14,7 @@ export class ComputeService {
  }

  getUploadPath(server: Server, emulator: string, filename: string) {
-    return `${server.protocol}//${server.host}:${server.port}/v2/${emulator}/images/${filename}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/${emulator}/images/${filename}`;
  }

  getStatistics(server: Server): Observable<ComputeStatistics[]> {
--- a/src/app/services/docker-configuration.service.ts
+++ b/src/app/services/docker-configuration.service.ts
@ -19,7 +19,7 @@ export class DockerConfigurationService {
  }

  getConsoleResolutions() {
-    let consoleResolutions = ['1920x1080', '1366x768', '1280x1024', '1280x800', '1024x768', '800x600', '640x480'];
+    let consoleResolutions = ['2560x1440', '1920x1080', '1680x1050', '1440x900', '1366x768', '1280x1024', '1280x800', '1024x768', '800x600', '640x480'];

    return consoleResolutions;
  }
--- a/src/app/services/drawing.service.spec.ts
+++ b/src/app/services/drawing.service.spec.ts
@ -149,7 +149,7 @@ describe('DrawingService', () => {
    drawing.z = 1;
    drawing.rotation = 0;
    drawing.svg =
-      '<svg height="100" width="200"><rect fill="#ffffff" fill-opacity="1.0" height="100" stroke="#000000" stroke-width="2" width="200" /></svg>';
+      '<svg height="100" width="200"><rect fill="#ffffff" fill-opacity="1.0" height="100" stroke="#000000" stroke-width="2" width="200" rx="0" ry="0" /></svg>';

    service.duplicate(server, drawing.project_id, drawing).subscribe();

--- a/src/app/services/google-analytics.service.ts
+++ b/src/app/services/google-analytics.service.ts
@ -1,14 +1,17 @@
 import { Injectable } from '@angular/core';
 import { NavigationEnd, Router } from '@angular/router';
 import { environment } from '../../environments/environment';
+import { SettingsService } from './settings.service';
 declare var gtag: Function;

@Injectable()
 export class GoogleAnalyticsService {
-  constructor(router: Router) {
+  private settingsService: SettingsService;
+
+  constructor(router: Router, settingsService: SettingsService) {
    if (!environment.production) return;
    router.events.subscribe((event) => {
-      if (event instanceof NavigationEnd) {
+      if (settingsService.getStatisticsSettings() && event instanceof NavigationEnd) {
        gtag('set', 'page', event.url);
        gtag('send', 'pageview');
      }
--- a/src/app/services/http-server.service.ts
+++ b/src/app/services/http-server.service.ts
@ -178,7 +178,7 @@ export class HttpServer {
      if (!server.protocol) {
        server.protocol = location.protocol as ServerProtocol;
      }
-      url = `${server.protocol}//${server.host}:${server.port}/v2${url}`;
+      url = `${server.protocol}://${server.host}:${server.port}/v2${url}`;
    } else {
      url = `/v2${url}`;
    }
--- a/src/app/services/ios.service.ts
+++ b/src/app/services/ios.service.ts
@ -14,7 +14,7 @@ export class IosService {
  }

  getImagePath(server: Server, filename: string): string {
-    return `${server.protocol}//${server.host}:${server.port}/v2/compute/dynamips/images/${filename}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/compute/dynamips/images/${filename}`;
  }

  getTemplates(server: Server): Observable<IosTemplate[]> {
--- a/src/app/services/iou.service.ts
+++ b/src/app/services/iou.service.ts
@ -22,7 +22,7 @@ export class IouService {
  }

  getImagePath(server: Server, filename: string): string {
-    return `${server.protocol}//${server.host}:${server.port}/v2/compute/iou/images/${filename}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/compute/iou/images/${filename}`;
  }

  addTemplate(server: Server, iouTemplate: any): Observable<any> {
--- a/src/app/services/link.service.ts
+++ b/src/app/services/link.service.ts
@ -63,9 +63,6 @@ export class LinkService {
  }

  updateLink(server: Server, link: Link) {
-    link.x = Math.round(link.x);
-    link.y = Math.round(link.y);
-
    return this.httpServer.put<Link>(server, `/projects/${link.project_id}/links/${link.link_id}`, link);
  }

--- a/src/app/services/nodeConsole.service.ts
+++ b/src/app/services/nodeConsole.service.ts
@ -67,7 +67,7 @@ export class NodeConsoleService {

  getUrl(server: Server, node: Node) {
    let protocol:string = "ws"
-	  if (server.protocol === "https:") {
+	  if (server.protocol === "https") {
 		  protocol = "wss"
 	  }

@ -78,13 +78,15 @@ export class NodeConsoleService {
    let nodesToStart = 'Please start the following nodes if you want to open consoles for them: ';
    let nodesToStartCounter = 0;
    nodes.forEach((n) => {
-      if (n.status === 'started') {
-        this.mapSettingsService.logConsoleSubject.next(true);
-        // this timeout is required due to xterm.js implementation
-        setTimeout(() => { this.openConsoleForNode(n); }, 500);
-      } else {
-        nodesToStartCounter++;
-        nodesToStart += n.name + ' '
+      if (n.console_type !== "none") {
+        if (n.status === 'started') {
+          this.mapSettingsService.logConsoleSubject.next(true);
+          // this timeout is required due to xterm.js implementation
+          setTimeout(() => { this.openConsoleForNode(n); }, 500);
+        } else {
+          nodesToStartCounter++;
+          nodesToStart += n.name + ' '
+        }
      }
    });
    if (nodesToStartCounter > 0) {
@ -93,16 +95,19 @@ export class NodeConsoleService {
  }

  openConsolesForAllNodesInNewTabs(nodes: Node[]) {
-    let nodesToStart = 'Please start the following nodes if you want to open consoles for them: ';
+    let nodesToStart = 'Please start the following nodes if you want to open consoles in tabs for them: ';
    let nodesToStartCounter = 0;
    nodes.forEach((n) => {
-      if (n.status === 'started') {
-        let url = this.router.url.split('/');
-        let urlString = `/static/web-ui/${url[1]}/${url[2]}/${url[3]}/${url[4]}/nodes/${n.node_id}`;
-        window.open(urlString);
-      } else {
-        nodesToStartCounter++;
-        nodesToStart += n.name + ' '
+      // opening a console in tab is only supported for telnet type
+      if (n.console_type === "telnet") {
+        if (n.status === 'started') {
+          let url = this.router.url.split('/');
+          let urlString = `/static/web-ui/${url[1]}/${url[2]}/${url[3]}/${url[4]}/nodes/${n.node_id}`;
+          window.open(urlString);
+        } else {
+          nodesToStartCounter++;
+          nodesToStart += n.name + ' '
+        }
      }
    });
    if (nodesToStartCounter > 0) {
--- a/src/app/services/notification.service.ts
+++ b/src/app/services/notification.service.ts
@ -5,17 +5,17 @@ import { Server } from '../models/server';
 export class NotificationService {
  notificationsPath(server: Server): string {
    let protocol:string = "ws"
-	  if (server.protocol === "https:") {
+	  if (server.protocol === "https") {
 		  protocol = "wss"
 	  }

    return `${protocol}://${server.host}:${server.port}/v2/notifications/ws`;
  }

-  
+
  projectNotificationsPath(server: Server, project_id: string): string {
    let protocol:string = "ws"
-	  if (server.protocol === "https:") {
+	  if (server.protocol === "https") {
 		  protocol = "wss"
 	  }

--- a/src/app/services/packet-capture.service.ts
+++ b/src/app/services/packet-capture.service.ts
@ -9,7 +9,7 @@ export class PacketCaptureService {

  startCapture(server: Server, project: Project, link: Link, name: string) {
    location.assign(
-      `gns3+pcap://${server.host}:${server.port}?project_id=${project.project_id}&link_id=${link.link_id}&name=${name}`
+      `gns3+pcap://${server.host}:${server.port}?protocol=${server.protocol}&project_id=${project.project_id}&link_id=${link.link_id}&project=${project.name}&name=${name}`
    );
  }
 }
--- a/src/app/services/project.service.ts
+++ b/src/app/services/project.service.ts
@ -75,11 +75,11 @@ export class ProjectService {
  }

  getUploadPath(server: Server, uuid: string, project_name: string) {
-    return `${server.protocol}//${server.host}:${server.port}/v2/projects/${uuid}/import?name=${project_name}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/projects/${uuid}/import?name=${project_name}`;
  }

  getExportPath(server: Server, project: Project) {
-    return `${server.protocol}//${server.host}:${server.port}/v2/projects/${project.project_id}/export`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/projects/${project.project_id}/export`;
  }

  export(server: Server, project_id: string): Observable<any> {
--- a/src/app/services/qemu-configuration.service.ts
+++ b/src/app/services/qemu-configuration.service.ts
@ -12,53 +12,31 @@ export class QemuConfigurationService {

  getNetworkTypes() {
    // needs extending of custom adapter component
-    // let networkTypes = [["e1000", "Intel Gigabit Ethernet"],
-    //     ["i82550", "Intel i82550 Ethernet"],
-    //     ["i82551", "Intel i82551 Ethernet"],
-    //     ["i82557a", "Intel i82557A Ethernet"],
-    //     ["i82557b", "Intel i82557B Ethernet"],
-    //     ["i82557c", "Intel i82557C Ethernet"],
-    //     ["i82558a", "Intel i82558A Ethernet"],
-    //     ["i82558b", "Intel i82558B Ethernet"],
-    //     ["i82559a", "Intel i82559A Ethernet"],
-    //     ["i82559b", "Intel i82559B Ethernet"],
-    //     ["i82559c", "Intel i82559C Ethernet"],
-    //     ["i82559er", "Intel i82559ER Ethernet"],
-    //     ["i82562", "Intel i82562 Ethernet"],
-    //     ["i82801", "Intel i82801 Ethernet"],
-    //     ["ne2k_pci", "NE2000 Ethernet"],
-    //     ["pcnet", "AMD PCNet Ethernet"],
-    //     ["rtl8139", "Realtek 8139 Ethernet"],
-    //     ["virtio", "Legacy paravirtualized Network I/O"],
-    //     ["virtio-net-pci", "Paravirtualized Network I/O"],
-    //     ["vmxnet3", "VMWare Paravirtualized Ethernet v3"]];
-
    let networkTypes = [
-      'e1000',
-      'e1000-82544gc',
-      'e1000-82545em',
-      'e1000e',
-      'rocker',
-      'Intel Gigabit Ethernet',
-      'i82550',
-      'i82551',
-      'i82557a',
-      'i82557b',
-      'i82557c',
-      'i82558a',
-      'i82558b',
-      'i82559a',
-      'i82559b',
-      'i82559c',
-      'i82559er',
-      'i82562',
-      'i82801',
-      'ne2k_pci',
-      'pcnet',
-      'rtl8139',
-      'virtio',
-      'virtio-net-pci',
-      'vmxnet3',
+      { value: 'e1000', name: 'Intel Gigabit Ethernet' },
+      { value: 'e1000-82544gc', name: 'Intel 82544GC Gigabit Ethernet' },
+      { value: 'e1000-82545em', name: 'Intel 82545EM Gigabit Ethernet' },
+      { value: 'e1000e', name: 'Intel PCIe Gigabit Ethernet' },
+      { value: 'i82550', name: 'Intel i82550 Ethernet' },
+      { value: 'i82551', name: 'Intel i82551 Ethernet' },
+      { value: 'i82557a', name: 'Intel i82557A Ethernet' },
+      { value: 'i82557b', name: 'Intel i82557B Ethernet' },
+      { value: 'i82557c', name: 'Intel i82557C Ethernet' },
+      { value: 'i82558a', name: 'Intel i82558A Ethernet' },
+      { value: 'i82558b', name: 'Intel i82558B Ethernet' },
+      { value: 'i82559a', name: 'Intel i82559A Ethernet' },
+      { value: 'i82559b', name: 'Intel i82559B Ethernet' },
+      { value: 'i82559c', name: 'Intel i82559C Ethernet' },
+      { value: 'i82559er', name: 'Intel i82559ER Ethernet' },
+      { value: 'i82562', name: 'Intel i82562 Ethernet' },
+      { value: 'i82801', name: 'Intel i82801 Ethernet' },
+      { value: 'igb', name: 'Intel 82576 Gigabit Ethernet' },
+      { value: 'ne2k_pci', name: 'NE2000 Ethernet' },
+      { value: 'pcnet', name: 'AMD PCNet Ethernet' },
+      { value: 'rocker', name: 'Rocker L2 switch device' },
+      { value: 'rtl8139', name: 'Realtek 8139 Ethernet' },
+      { value: 'virtio-net-pci', name: 'Paravirtualized Network I/O' },
+      { value: 'vmxnet3', name: 'VMWare Paravirtualized Ethernet v3' },
    ];

    return networkTypes;
--- a/src/app/services/qemu.service.spec.ts
+++ b/src/app/services/qemu.service.spec.ts
@ -78,6 +78,9 @@ describe('QemuService', () => {
      template_id: '1',
      template_type: 'qemu',
      usage: '',
+      replicate_network_connection_state: true,
+      tpm: false,
+      uefi: false,
    };

    service.saveTemplate(server, template).subscribe();
@ -131,6 +134,9 @@ describe('QemuService', () => {
      template_id: '',
      template_type: 'qemu',
      usage: '',
+      replicate_network_connection_state: true,
+      tpm: false,
+      uefi: false,
    };

    service.addTemplate(server, template).subscribe();
--- a/src/app/services/qemu.service.ts
+++ b/src/app/services/qemu.service.ts
@ -20,7 +20,7 @@ export class QemuService {
  }

  getImagePath(server: Server, filename: string): string {
-    return `${server.protocol}//${server.host}:${server.port}/v2/compute/qemu/images/${filename}`;
+    return `${server.protocol}://${server.host}:${server.port}/v2/compute/qemu/images/${filename}`;
  }

  getBinaries(server: Server): Observable<QemuBinary[]> {
--- a/src/app/services/server.service.ts
+++ b/src/app/services/server.service.ts
@ -83,7 +83,7 @@ export class ServerService {
  }

  public getServerUrl(server: Server) {
-    return `${server.protocol}//${server.host}:${server.port}/`;
+    return `${server.protocol}://${server.host}:${server.port}/`;
  }

  public checkServerVersion(server: Server): Observable<any> {
--- a/src/app/services/settings.service.ts
+++ b/src/app/services/settings.service.ts
@ -4,6 +4,7 @@ import { BehaviorSubject } from 'rxjs';
 export interface Settings {
  crash_reports: boolean;
  console_command: string;
+  anonymous_statistics: boolean;
 }

@Injectable({
@ -13,10 +14,12 @@ export class SettingsService {
  private settings: Settings = {
    crash_reports: true,
    console_command: undefined,
+    anonymous_statistics: true
  };

  private readonly reportsSettings: string = 'crash_reports';
  private readonly consoleSettings: string = 'console_command';
+  private readonly statisticsSettings: string = 'statistics_command';

  constructor() {
    if (this.getItem(this.reportsSettings))
@ -24,6 +27,9 @@ export class SettingsService {

    if (this.getItem(this.consoleSettings))
      this.settings.console_command = this.getItem(this.consoleSettings);
+
+    if (this.getItem(this.statisticsSettings))
+      this.settings.anonymous_statistics = this.getItem(this.statisticsSettings) === 'true' ? true : false;
  }

  setReportsSettings(value: boolean) {
@ -36,10 +42,24 @@ export class SettingsService {
    }
  }

+  setStatisticsSettings(value: boolean) {
+    this.settings.anonymous_statistics = value;
+    this.removeItem(this.statisticsSettings);
+    if (value) {
+      this.setItem(this.statisticsSettings, 'true');
+    } else {
+      this.setItem(this.statisticsSettings, 'false');
+    }
+  }
+
  getReportsSettings() {
    return this.getItem(this.reportsSettings) === 'true' ? true : false;
  }

+  getStatisticsSettings() {
+    return this.getItem(this.statisticsSettings) === 'true' ? true : false;
+  }
+
  setConsoleSettings(value: string) {
    this.settings.console_command = value;
    this.removeItem(this.consoleSettings);
@ -70,5 +90,6 @@ export class SettingsService {
    this.settings = settings;
    this.setConsoleSettings(settings.console_command);
    this.setReportsSettings(settings.crash_reports);
+    this.setStatisticsSettings(settings.anonymous_statistics);
  }
 }
--- a/src/app/services/template-mocks.service.ts
+++ b/src/app/services/template-mocks.service.ts
@ -75,6 +75,9 @@ export class TemplateMocksService {
      template_id: '',
      template_type: 'qemu',
      usage: '',
+      replicate_network_connection_state: true,
+      tpm: false,
+      uefi: false,
    };

    return of(template);
--- a/src/app/services/testing.ts
+++ b/src/app/services/testing.ts
@ -5,6 +5,6 @@ export function getTestServer(): Server {
  server.host = '127.0.0.1';
  server.port = 3080;
  server.authorization = 'none';
-  server.protocol = 'http:';
+  server.protocol = 'http';
  return server;
 }
--- a/src/test.ts
+++ b/src/test.ts
@ -5,7 +5,9 @@ import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@ang
 declare const require: any;

 // First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+});
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);
 // And load the modules.
--- a/src/theme.scss
+++ b/src/theme.scss
@ -1,4 +1,4 @@
-@import '~@angular/material/theming';
+@import '@angular/material/theming';
@import '~material-design-icons/iconfont/material-icons.css';
@import '~typeface-roboto/index.css';
@include mat-core();
--- a/yarn.lock
+++ b/yarn.lock