From ecce86aaf75c7b428dc4b74fce27e822fe52df72 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Mon, 9 Sep 2019 06:57:42 -0700 Subject: [PATCH 01/30] Dialog for VPCS added --- src/app/app.module.ts | 9 ++- src/app/cartography/models/node.ts | 1 + .../config-action.component.html | 4 ++ .../config-action.component.spec.ts | 0 .../config-action/config-action.component.ts | 58 +++++++++++++++++++ .../context-menu/context-menu.component.html | 4 ++ .../configurator/configurator.component.scss | 7 +++ .../vpcs/configurator-vpcs.component.html | 39 +++++++++++++ .../vpcs/configurator-vpcs.component.ts | 58 +++++++++++++++++++ src/app/services/node.service.ts | 11 ++++ 10 files changed, 189 insertions(+), 2 deletions(-) create mode 100644 src/app/components/project-map/context-menu/actions/config-action/config-action.component.html create mode 100644 src/app/components/project-map/context-menu/actions/config-action/config-action.component.spec.ts create mode 100644 src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts create mode 100644 src/app/components/project-map/node-editors/configurator/configurator.component.scss create mode 100644 src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 3edba25a..fbcdc4ff 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -211,6 +211,8 @@ import { ProjectsFilter } from './filters/projectsFilter.pipe'; import { ComputeService } from './services/compute.service'; import { ReloadNodeActionComponent } from './components/project-map/context-menu/actions/reload-node-action/reload-node-action.component'; import { SuspendNodeActionComponent } from './components/project-map/context-menu/actions/suspend-node-action/suspend-node-action.component'; +import { ConfigActionComponent } from './components/project-map/context-menu/actions/config-action/config-action.component'; +import { ConfiguratorDialogVpcsComponent } from './components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -349,7 +351,9 @@ if (environment.production) { ChangeSymbolActionComponent, EditProjectDialogComponent, ReloadNodeActionComponent, - SuspendNodeActionComponent + SuspendNodeActionComponent, + ConfigActionComponent, + ConfiguratorDialogVpcsComponent ], imports: [ BrowserModule, @@ -449,7 +453,8 @@ if (environment.production) { SaveProjectDialogComponent, InfoDialogComponent, ChangeSymbolDialogComponent, - EditProjectDialogComponent + EditProjectDialogComponent, + ConfiguratorDialogVpcsComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index 5caf995f..3478617f 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -5,6 +5,7 @@ export class Node { command_line: string; compute_id: string; console: number; + console_auto_start: boolean; console_host: string; console_type: string; first_port_name: string; diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.html b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.html new file mode 100644 index 00000000..3290ba3a --- /dev/null +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.html @@ -0,0 +1,4 @@ + diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.spec.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.spec.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts new file mode 100644 index 00000000..5d9d0974 --- /dev/null +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -0,0 +1,58 @@ +import { Component, Input, OnInit, OnChanges } from '@angular/core'; +import { Server } from '../../../../../models/server'; +import { Node } from '../../../../../cartography/models/node'; +import { MatDialog, MatDialogRef } from '@angular/material'; +import { ConfiguratorDialogVpcsComponent } from '../../../node-editors/configurator/vpcs/configurator-vpcs.component'; + + +@Component({ + selector: 'app-config-node-action', + templateUrl: './config-action.component.html' +}) +export class ConfigActionComponent { + @Input() server: Server; + @Input() node: Node; + private conf = { + width: '600px', + autoFocus: false + }; + dialogRef; + + constructor(private dialog: MatDialog) {} + + configureNode() { + if (this.node.node_type === 'vpcs') { + this.dialogRef = this.dialog.open(ConfiguratorDialogVpcsComponent, this.conf); + } else if (this.node.node_type === 'ethernet_hub') { + + } else if (this.node.node_type === 'ethernet_switch') { + + } else if (this.node.node_type === 'cloud') { + + } else if (this.node.node_type === 'dynamips') { + + } else if (this.node.node_type === 'iou') { + + } else if (this.node.node_type === 'qemu') { + + } else if (this.node.node_type === 'virtualbox') { + + } else if (this.node.node_type === 'vmware') { + + } else if (this.node.node_type === 'docker') { + + } else if (this.node.node_type === 'nat') { + + } else if (this.node.node_type === 'frame_relay_switch') { + + } else if (this.node.node_type === 'atm_switch') { + + } else if (this.node.node_type === 'traceng') { + + } + + let instance = this.dialogRef.componentInstance; + instance.server = this.server; + instance.node = this.node; + } +} diff --git a/src/app/components/project-map/context-menu/context-menu.component.html b/src/app/components/project-map/context-menu/context-menu.component.html index 091a6fcf..177d607d 100644 --- a/src/app/components/project-map/context-menu/context-menu.component.html +++ b/src/app/components/project-map/context-menu/context-menu.component.html @@ -5,6 +5,10 @@ [server]="server" [node]="nodes[0]" > + diff --git a/src/app/components/project-map/node-editors/configurator/configurator.component.scss b/src/app/components/project-map/node-editors/configurator/configurator.component.scss new file mode 100644 index 00000000..ae93f5c6 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/configurator.component.scss @@ -0,0 +1,7 @@ +.form-field { + width: 100%; +} + +.select { + width: 100%; +} diff --git a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html new file mode 100644 index 00000000..e4edc149 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html @@ -0,0 +1,39 @@ +

Configurator for node {{node.name}}

+ +
+
+
+ +
+ + + + + + + {{type}} + + + + + Auto start console + +
+ +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts new file mode 100644 index 00000000..c2073860 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts @@ -0,0 +1,58 @@ +import { Component, OnInit, Input } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { VpcsConfigurationService } from '../../../../../services/vpcs-configuration.service'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; + + +@Component({ + selector: 'app-configurator-vpcs', + templateUrl: './configurator-vpcs.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogVpcsComponent implements OnInit { + server: Server; + node: Node; + + inputForm: FormGroup; + consoleTypes: string[] = []; + categories = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private vpcsConfigurationService: VpcsConfigurationService + ) { + this.inputForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.getConfiguration(); + }) + } + + getConfiguration() { + this.consoleTypes = this.vpcsConfigurationService.getConsoleTypes(); + this.categories = this.vpcsConfigurationService.getCategories(); + } + + onSaveClick() { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } + + onCancelClick() { + this.dialogRef.close(); + } +} diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index 111b5106..9beb0d6f 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -86,6 +86,13 @@ export class NodeService { }); } + updateNode(server: Server, node: Node): Observable { + return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { + console_type: node.console_type, + name: node.name + }); + } + delete(server: Server, node: Node) { return this.httpServer.delete(server, `/projects/${node.project_id}/nodes/${node.node_id}`); } @@ -99,6 +106,10 @@ export class NodeService { }); } + getNode(server: Server, node: Node) { + return this.httpServer.get(server, `/projects/${node.project_id}/nodes/${node.node_id}`) + } + getConfiguration(server: Server, node: Node) { let urlPath: string = `/projects/${node.project_id}/nodes/${node.node_id}` From 96e297ff6a1f68910180f8b24b2819e18d5db1cf Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Mon, 9 Sep 2019 08:56:14 -0700 Subject: [PATCH 02/30] Validation added --- .../config-action/config-action.component.ts | 9 +- .../configurator-ethernet-hub.component.html | 31 +++++++ .../configurator-ethernet-hub.component.ts | 83 +++++++++++++++++++ .../vpcs/configurator-vpcs.component.ts | 12 ++- 4 files changed, 127 insertions(+), 8 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index 5d9d0974..43cd50cd 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -3,6 +3,7 @@ import { Server } from '../../../../../models/server'; import { Node } from '../../../../../cartography/models/node'; import { MatDialog, MatDialogRef } from '@angular/material'; import { ConfiguratorDialogVpcsComponent } from '../../../node-editors/configurator/vpcs/configurator-vpcs.component'; +import { ConfiguratorDialogEthernetHubComponent } from '../../../node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component'; @Component({ @@ -24,7 +25,7 @@ export class ConfigActionComponent { if (this.node.node_type === 'vpcs') { this.dialogRef = this.dialog.open(ConfiguratorDialogVpcsComponent, this.conf); } else if (this.node.node_type === 'ethernet_hub') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogEthernetHubComponent, this.conf); } else if (this.node.node_type === 'ethernet_switch') { } else if (this.node.node_type === 'cloud') { @@ -43,11 +44,11 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'nat') { - } else if (this.node.node_type === 'frame_relay_switch') { + } else if (this.node.node_type === 'frame_relay_switch') { - } else if (this.node.node_type === 'atm_switch') { + } else if (this.node.node_type === 'atm_switch') { - } else if (this.node.node_type === 'traceng') { + } else if (this.node.node_type === 'traceng') { } diff --git a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html new file mode 100644 index 00000000..c60a7f67 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html @@ -0,0 +1,31 @@ +

Configurator for node {{node.name}}

+ +
+
+
+ +
+ + + + + + +
+ +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts new file mode 100644 index 00000000..05966da7 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts @@ -0,0 +1,83 @@ +import { Component, OnInit, Input } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { VpcsConfigurationService } from '../../../../../services/vpcs-configuration.service'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; + + +@Component({ + selector: 'app-configurator-ethernet-hub', + templateUrl: './configurator-ethernet-hub.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogEthernetHubComponent implements OnInit { + server: Server; + node: Node; + numberOfPorts: number; + inputForm: FormGroup; + consoleTypes: string[] = []; + categories = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private vpcsConfigurationService: VpcsConfigurationService + ) { + this.inputForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.getConfiguration(); + }) + } + + getConfiguration() { + this.consoleTypes = this.vpcsConfigurationService.getConsoleTypes(); + this.categories = this.vpcsConfigurationService.getCategories(); + } + + onSaveClick() { + if (this.inputForm.valid) { + for(let i=0; i { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`) + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} diff --git a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts index c2073860..042e60fd 100644 --- a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts +++ b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts @@ -46,10 +46,14 @@ export class ConfiguratorDialogVpcsComponent implements OnInit { } onSaveClick() { - this.nodeService.updateNode(this.server, this.node).subscribe(() => { - this.toasterService.success(`Node ${this.node.name} updated.`); - this.onCancelClick(); - }); + if (this.inputForm.valid) { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } } onCancelClick() { From 0fe44b2235f801325d57e5b12917a66a00c02a8d Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Mon, 9 Sep 2019 09:33:10 -0700 Subject: [PATCH 03/30] Dialog for ethernet hubs added --- src/app/app.module.ts | 7 +++++-- src/app/cartography/models/node.ts | 10 ++++++++++ .../configurator-ethernet-hub.component.ts | 20 ++++--------------- src/app/services/node.service.ts | 3 ++- 4 files changed, 21 insertions(+), 19 deletions(-) diff --git a/src/app/app.module.ts b/src/app/app.module.ts index fbcdc4ff..dc540c2f 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -213,6 +213,7 @@ import { ReloadNodeActionComponent } from './components/project-map/context-menu import { SuspendNodeActionComponent } from './components/project-map/context-menu/actions/suspend-node-action/suspend-node-action.component'; import { ConfigActionComponent } from './components/project-map/context-menu/actions/config-action/config-action.component'; import { ConfiguratorDialogVpcsComponent } from './components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component'; +import { ConfiguratorDialogEthernetHubComponent } from './components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -353,7 +354,8 @@ if (environment.production) { ReloadNodeActionComponent, SuspendNodeActionComponent, ConfigActionComponent, - ConfiguratorDialogVpcsComponent + ConfiguratorDialogVpcsComponent, + ConfiguratorDialogEthernetHubComponent ], imports: [ BrowserModule, @@ -454,7 +456,8 @@ if (environment.production) { InfoDialogComponent, ChangeSymbolDialogComponent, EditProjectDialogComponent, - ConfiguratorDialogVpcsComponent + ConfiguratorDialogVpcsComponent, + ConfiguratorDialogEthernetHubComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index 3478617f..358a1dcc 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -1,6 +1,15 @@ import { Label } from './label'; import { Port } from '../../models/port'; +export class PortsMapping { + name: string; + port_number: number; +} + +export class Properties { + ports_mapping: PortsMapping[]; +} + export class Node { command_line: string; compute_id: string; @@ -19,6 +28,7 @@ export class Node { port_segment_size: number; ports: Port[]; project_id: string; + properties: Properties; status: string; symbol: string; symbol_url: string; // @TODO: full URL to symbol, move to MapNode once converters are moved to app module diff --git a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts index 05966da7..ebc74b47 100644 --- a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts +++ b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts @@ -36,6 +36,7 @@ export class ConfiguratorDialogEthernetHubComponent implements OnInit { ngOnInit() { this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { this.node = node; + this.numberOfPorts = this.node.ports.length; this.getConfiguration(); }) } @@ -47,27 +48,14 @@ export class ConfiguratorDialogEthernetHubComponent implements OnInit { onSaveClick() { if (this.inputForm.valid) { + this.node.properties.ports_mapping = []; for(let i=0; i { this.toasterService.success(`Node ${this.node.name} updated.`); this.onCancelClick(); diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index 9beb0d6f..c94bd3c5 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -89,7 +89,8 @@ export class NodeService { updateNode(server: Server, node: Node): Observable { return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { console_type: node.console_type, - name: node.name + name: node.name, + properties: node.properties }); } From bdf8e89dfa2f25bac215d7e0af1db3bf919fa360 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 10 Sep 2019 03:05:54 -0700 Subject: [PATCH 04/30] Support for ethernet switches --- src/app/app.module.ts | 9 ++- ...t-switches-template-details.component.html | 60 +---------------- ...net-switches-template-details.component.ts | 33 ++-------- .../common/ports/ports.component.html | 66 +++++++++++++++++++ .../common/ports/ports.component.scss | 0 .../common/ports/ports.component.spec.ts | 0 .../common/ports/ports.component.ts | 48 ++++++++++++++ .../config-action/config-action.component.ts | 3 +- .../configurator/configurator.component.scss | 20 ++++++ ...onfigurator-ethernet-switch.component.html | 35 ++++++++++ .../configurator-ethernet-switch.component.ts | 63 ++++++++++++++++++ .../vpcs/configurator-vpcs.component.ts | 2 - 12 files changed, 247 insertions(+), 92 deletions(-) create mode 100644 src/app/components/preferences/common/ports/ports.component.html create mode 100644 src/app/components/preferences/common/ports/ports.component.scss create mode 100644 src/app/components/preferences/common/ports/ports.component.spec.ts create mode 100644 src/app/components/preferences/common/ports/ports.component.ts create mode 100644 src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index dc540c2f..a094098b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -214,6 +214,8 @@ import { SuspendNodeActionComponent } from './components/project-map/context-men import { ConfigActionComponent } from './components/project-map/context-menu/actions/config-action/config-action.component'; import { ConfiguratorDialogVpcsComponent } from './components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component'; import { ConfiguratorDialogEthernetHubComponent } from './components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component'; +import { ConfiguratorDialogEthernetSwitchComponent } from './components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component'; +import { PortsComponent } from './components/preferences/common/ports/ports.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -355,7 +357,9 @@ if (environment.production) { SuspendNodeActionComponent, ConfigActionComponent, ConfiguratorDialogVpcsComponent, - ConfiguratorDialogEthernetHubComponent + ConfiguratorDialogEthernetHubComponent, + ConfiguratorDialogEthernetSwitchComponent, + PortsComponent ], imports: [ BrowserModule, @@ -457,7 +461,8 @@ if (environment.production) { ChangeSymbolDialogComponent, EditProjectDialogComponent, ConfiguratorDialogVpcsComponent, - ConfiguratorDialogEthernetHubComponent + ConfiguratorDialogEthernetHubComponent, + ConfiguratorDialogEthernetSwitchComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.html b/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.html index f798570b..8089383b 100644 --- a/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.html +++ b/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.html @@ -57,69 +57,13 @@ - + Port settings - - - - - - - - - - - - - - - - - - - - - - - -
Port number {{element.port_number}} VLAN {{element.vlan}} Type {{element.type}} EtherType {{element.ethertype}}

- - - - - - - - - - {{type}} - - - - - - - {{type}} - - - - +
diff --git a/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.ts b/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.ts index f3a33a97..6ffd3415 100644 --- a/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.ts +++ b/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from "@angular/core"; +import { Component, OnInit, ViewChild } from "@angular/core"; import { ActivatedRoute, Router } from '@angular/router'; import { ServerService } from '../../../../../services/server.service'; import { Server } from '../../../../../models/server'; @@ -6,8 +6,8 @@ import { ToasterService } from '../../../../../services/toaster.service'; import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; import { BuiltInTemplatesService } from '../../../../../services/built-in-templates.service'; import { EthernetSwitchTemplate } from '../../../../../models/templates/ethernet-switch-template'; -import { PortsMappingEntity } from '../../../../../models/ethernetHub/ports-mapping-enity'; import { BuiltInTemplatesConfigurationService } from '../../../../../services/built-in-templates-configuration.service'; +import { PortsComponent } from '../../../common/ports/ports.component'; @Component({ @@ -16,20 +16,13 @@ import { BuiltInTemplatesConfigurationService } from '../../../../../services/bu styleUrls: ['./ethernet-switches-template-details.component.scss', '../../../preferences.component.scss'] }) export class EthernetSwitchesTemplateDetailsComponent implements OnInit { + @ViewChild(PortsComponent, {static: false}) portsComponent: PortsComponent; server: Server; ethernetSwitchTemplate: EthernetSwitchTemplate; inputForm: FormGroup; - ethernetPorts: PortsMappingEntity[] = []; - dataSource: PortsMappingEntity[] = []; - newPort: PortsMappingEntity; - isSymbolSelectionOpened: boolean = false; - categories = []; consoleTypes: string[] = []; - portTypes: string[] = []; - etherTypes: string[] = []; - displayedColumns: string[] = ['port_number', 'vlan', 'type', 'ethertype']; constructor( private route: ActivatedRoute, @@ -45,11 +38,6 @@ export class EthernetSwitchesTemplateDetailsComponent implements OnInit { defaultName: new FormControl('', Validators.required), symbol: new FormControl('', Validators.required) }); - - this.newPort = { - name: '', - port_number: 0, - }; } ngOnInit() { @@ -61,8 +49,6 @@ export class EthernetSwitchesTemplateDetailsComponent implements OnInit { this.getConfiguration(); this.builtInTemplatesService.getTemplate(this.server, template_id).subscribe((ethernetSwitchTemplate: EthernetSwitchTemplate) => { this.ethernetSwitchTemplate = ethernetSwitchTemplate; - this.ethernetPorts = this.ethernetSwitchTemplate.ports_mapping; - this.dataSource = this.ethernetSwitchTemplate.ports_mapping; }); }); } @@ -70,18 +56,6 @@ export class EthernetSwitchesTemplateDetailsComponent implements OnInit { getConfiguration() { this.categories = this.builtInTemplatesConfigurationService.getCategoriesForEthernetSwitches(); this.consoleTypes = this.builtInTemplatesConfigurationService.getConsoleTypesForEthernetSwitches(); - this.portTypes = this.builtInTemplatesConfigurationService.getPortTypesForEthernetSwitches(); - this.etherTypes = this.builtInTemplatesConfigurationService.getEtherTypesForEthernetSwitches(); - } - - onAdd() { - this.ethernetPorts.push(this.newPort); - this.dataSource = [...this.ethernetPorts]; - - this.newPort = { - name: '', - port_number: 0, - }; } goBack() { @@ -92,6 +66,7 @@ export class EthernetSwitchesTemplateDetailsComponent implements OnInit { if (this.inputForm.invalid) { this.toasterService.error(`Fill all required fields`); } else { + this.ethernetSwitchTemplate.ports_mapping = this.portsComponent.ethernetPorts; this.builtInTemplatesService.saveTemplate(this.server, this.ethernetSwitchTemplate).subscribe((ethernetSwitchTemplate: EthernetSwitchTemplate) => { this.toasterService.success("Changes saved"); }); diff --git a/src/app/components/preferences/common/ports/ports.component.html b/src/app/components/preferences/common/ports/ports.component.html new file mode 100644 index 00000000..2fcc2f00 --- /dev/null +++ b/src/app/components/preferences/common/ports/ports.component.html @@ -0,0 +1,66 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Port number {{element.port_number}} VLAN {{element.vlan}} Type {{element.type}} EtherType {{element.ethertype}} Actions + +

+ + + + + + + + + + {{type}} + + + + + + + {{type}} + + + + diff --git a/src/app/components/preferences/common/ports/ports.component.scss b/src/app/components/preferences/common/ports/ports.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/preferences/common/ports/ports.component.spec.ts b/src/app/components/preferences/common/ports/ports.component.spec.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/preferences/common/ports/ports.component.ts b/src/app/components/preferences/common/ports/ports.component.ts new file mode 100644 index 00000000..efc2d393 --- /dev/null +++ b/src/app/components/preferences/common/ports/ports.component.ts @@ -0,0 +1,48 @@ +import { Component, OnInit, Input, Output, EventEmitter } from "@angular/core"; +import { Server } from '../../../../models/server'; +import { PortsMappingEntity } from '../../../../models/ethernetHub/ports-mapping-enity'; +import { BuiltInTemplatesConfigurationService } from '../../../../services/built-in-templates-configuration.service'; + + +@Component({ + selector: 'app-ports', + templateUrl: './ports.component.html', + styleUrls: ['../../preferences.component.scss'] +}) +export class PortsComponent implements OnInit { + @Input() ethernetPorts: PortsMappingEntity[] = []; + newPort: PortsMappingEntity = { + name: '', + port_number: 0, + }; + + portTypes: string[] = []; + etherTypes: string[] = []; + displayedColumns: string[] = ['port_number', 'vlan', 'type', 'ethertype', 'action']; + + constructor( + private builtInTemplatesConfigurationService: BuiltInTemplatesConfigurationService + ) {} + + ngOnInit() { + this.getConfiguration(); + } + + getConfiguration() { + this.etherTypes = this.builtInTemplatesConfigurationService.getEtherTypesForEthernetSwitches(); + this.portTypes = this.builtInTemplatesConfigurationService.getPortTypesForEthernetSwitches(); + } + + onAdd() { + this.ethernetPorts.push(this.newPort); + + this.newPort = { + name: '', + port_number: 0, + }; + } + + delete(port: PortsMappingEntity) { + this.ethernetPorts = this.ethernetPorts.filter(n => n !== port); + } +} diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index 43cd50cd..c1bccc72 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -4,6 +4,7 @@ import { Node } from '../../../../../cartography/models/node'; import { MatDialog, MatDialogRef } from '@angular/material'; import { ConfiguratorDialogVpcsComponent } from '../../../node-editors/configurator/vpcs/configurator-vpcs.component'; import { ConfiguratorDialogEthernetHubComponent } from '../../../node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component'; +import { ConfiguratorDialogEthernetSwitchComponent } from '../../../node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component'; @Component({ @@ -27,7 +28,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'ethernet_hub') { this.dialogRef = this.dialog.open(ConfiguratorDialogEthernetHubComponent, this.conf); } else if (this.node.node_type === 'ethernet_switch') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogEthernetSwitchComponent, this.conf); } else if (this.node.node_type === 'cloud') { } else if (this.node.node_type === 'dynamips') { diff --git a/src/app/components/project-map/node-editors/configurator/configurator.component.scss b/src/app/components/project-map/node-editors/configurator/configurator.component.scss index ae93f5c6..d914988c 100644 --- a/src/app/components/project-map/node-editors/configurator/configurator.component.scss +++ b/src/app/components/project-map/node-editors/configurator/configurator.component.scss @@ -5,3 +5,23 @@ .select { width: 100%; } + +.default-content { + max-height: 400px; + overflow-y: scroll; + scrollbar-color: darkgrey #263238; + scrollbar-width: thin; +} + +::-webkit-scrollbar { + width: 0.5em; +} + +::-webkit-scrollbar-track { + -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); +} + +::-webkit-scrollbar-thumb { + background-color: darkgrey; + outline: 1px solid #263238; +} diff --git a/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html new file mode 100644 index 00000000..900d1abd --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html @@ -0,0 +1,35 @@ +

Configurator for node {{node.name}}

+ +
+
+
+ +
+ + + + + + + {{type}} + + + +
+ + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts new file mode 100644 index 00000000..41e27483 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts @@ -0,0 +1,63 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { BuiltInTemplatesConfigurationService } from '../../../../../services/built-in-templates-configuration.service'; +import { PortsComponent } from '../../../../../components/preferences/common/ports/ports.component'; + + +@Component({ + selector: 'app-configurator-ethernet-switch', + templateUrl: './configurator-ethernet-switch.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogEthernetSwitchComponent implements OnInit { + @ViewChild(PortsComponent, {static: false}) portsComponent: PortsComponent; + server: Server; + node: Node; + + inputForm: FormGroup; + consoleTypes: string[] = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private ethernetSwitchesConfigurationService: BuiltInTemplatesConfigurationService + ) { + this.inputForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.getConfiguration(); + }) + } + + getConfiguration() { + this.consoleTypes = this.ethernetSwitchesConfigurationService.getConsoleTypesForEthernetSwitches(); + } + + onSaveClick() { + if (this.inputForm.valid) { + this.node.properties.ports_mapping = this.portsComponent.ethernetPorts; + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} diff --git a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts index 042e60fd..0ff0526b 100644 --- a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts +++ b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts @@ -19,7 +19,6 @@ export class ConfiguratorDialogVpcsComponent implements OnInit { inputForm: FormGroup; consoleTypes: string[] = []; - categories = []; constructor( public dialogRef: MatDialogRef, @@ -42,7 +41,6 @@ export class ConfiguratorDialogVpcsComponent implements OnInit { getConfiguration() { this.consoleTypes = this.vpcsConfigurationService.getConsoleTypes(); - this.categories = this.vpcsConfigurationService.getCategories(); } onSaveClick() { From 32dc9e3c0750343ce9b78f9111c8865e9fde8958 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 10 Sep 2019 03:57:46 -0700 Subject: [PATCH 05/30] Update ethernet-switches-template-details.component.spec.ts --- .../ethernet-switches-template-details.component.spec.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.spec.ts b/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.spec.ts index 108d2f91..3eeef4f5 100644 --- a/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.spec.ts +++ b/src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.spec.ts @@ -17,6 +17,7 @@ import { BuiltInTemplatesService } from '../../../../../services/built-in-templa import { EthernetSwitchTemplate } from '../../../../../models/templates/ethernet-switch-template'; import { EthernetSwitchesTemplateDetailsComponent } from './ethernet-switches-template-details.component'; import { BuiltInTemplatesConfigurationService } from '../../../../../services/built-in-templates-configuration.service'; +import { PortsComponent } from '../../../common/ports/ports.component'; export class MockedBuiltInTemplatesService { public getTemplate(server: Server, template_id: string) { @@ -68,6 +69,7 @@ describe('EthernetSwitchesTemplateDetailsComponent', () => { it('should call save template', () => { spyOn(mockedBuiltInTemplatesService, 'saveTemplate').and.returnValue(of({} as EthernetSwitchTemplate)); + component.portsComponent = {ethernetPorts: []} as PortsComponent; component.inputForm.controls['templateName'].setValue('template name'); component.inputForm.controls['defaultName'].setValue('default name'); component.inputForm.controls['symbol'].setValue('symbol'); @@ -102,7 +104,7 @@ describe('EthernetSwitchesTemplateDetailsComponent', () => { expect(mockedBuiltInTemplatesService.saveTemplate).not.toHaveBeenCalled(); }); - it('should call save template when symbol path is empty', () => { + it('should not call save template when symbol path is empty', () => { spyOn(mockedBuiltInTemplatesService, 'saveTemplate').and.returnValue(of({} as EthernetSwitchTemplate)); component.inputForm.controls['templateName'].setValue('template name'); component.inputForm.controls['defaultName'].setValue('default name'); From 9ab7616d891cf4f7941510abfe0ed1df355f5ab0 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 10 Sep 2019 04:07:08 -0700 Subject: [PATCH 06/30] Fix for configurator name --- .../configurator-ethernet-switch.component.html | 2 +- .../ethernet-switch/configurator-ethernet-switch.component.ts | 3 ++- .../ethernet_hub/configurator-ethernet-hub.component.html | 2 +- .../ethernet_hub/configurator-ethernet-hub.component.ts | 2 ++ .../configurator/vpcs/configurator-vpcs.component.html | 2 +- .../configurator/vpcs/configurator-vpcs.component.ts | 3 ++- 6 files changed, 9 insertions(+), 5 deletions(-) diff --git a/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html index 900d1abd..826a0154 100644 --- a/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html +++ b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.html @@ -1,4 +1,4 @@ -

Configurator for node {{node.name}}

+

Configurator for node {{name}}

diff --git a/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts index 41e27483..484f6138 100644 --- a/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts +++ b/src/app/components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component.ts @@ -18,7 +18,7 @@ export class ConfiguratorDialogEthernetSwitchComponent implements OnInit { @ViewChild(PortsComponent, {static: false}) portsComponent: PortsComponent; server: Server; node: Node; - + name: string; inputForm: FormGroup; consoleTypes: string[] = []; @@ -37,6 +37,7 @@ export class ConfiguratorDialogEthernetSwitchComponent implements OnInit { ngOnInit() { this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { this.node = node; + this.name = this.node.name; this.getConfiguration(); }) } diff --git a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html index c60a7f67..13d7838c 100644 --- a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html +++ b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.html @@ -1,4 +1,4 @@ -

Configurator for node {{node.name}}

+

Configurator for node {{name}}

diff --git a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts index ebc74b47..fe6d969b 100644 --- a/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts +++ b/src/app/components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component.ts @@ -20,6 +20,7 @@ export class ConfiguratorDialogEthernetHubComponent implements OnInit { inputForm: FormGroup; consoleTypes: string[] = []; categories = []; + name: string; constructor( public dialogRef: MatDialogRef, @@ -36,6 +37,7 @@ export class ConfiguratorDialogEthernetHubComponent implements OnInit { ngOnInit() { this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { this.node = node; + this.name = this.node.name; this.numberOfPorts = this.node.ports.length; this.getConfiguration(); }) diff --git a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html index e4edc149..c431fe58 100644 --- a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html +++ b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.html @@ -1,4 +1,4 @@ -

Configurator for node {{node.name}}

+

Configurator for node {{name}}

diff --git a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts index 0ff0526b..9c802eed 100644 --- a/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts +++ b/src/app/components/project-map/node-editors/configurator/vpcs/configurator-vpcs.component.ts @@ -16,7 +16,7 @@ import { MatDialogRef } from '@angular/material'; export class ConfiguratorDialogVpcsComponent implements OnInit { server: Server; node: Node; - + name: string; inputForm: FormGroup; consoleTypes: string[] = []; @@ -35,6 +35,7 @@ export class ConfiguratorDialogVpcsComponent implements OnInit { ngOnInit() { this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { this.node = node; + this.name = node.name; this.getConfiguration(); }) } From 24ab40bfa99d511c8353e8984de1d098c8a6c4e9 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 10 Sep 2019 06:55:58 -0700 Subject: [PATCH 07/30] Support for virtualbox --- src/app/app.module.ts | 10 ++- src/app/cartography/models/node.ts | 1 + .../config-action/config-action.component.ts | 8 ++- .../switch/configurator-switch.component.html | 71 +++++++++++++++++++ .../switch/configurator-switch.component.ts | 54 ++++++++++++++ .../configurator-virtualbox.component.html | 70 ++++++++++++++++++ .../configurator-virtualbox.component.ts | 71 +++++++++++++++++++ 7 files changed, 280 insertions(+), 5 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts create mode 100644 src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index a094098b..21bb40ed 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -216,6 +216,8 @@ import { ConfiguratorDialogVpcsComponent } from './components/project-map/node-e import { ConfiguratorDialogEthernetHubComponent } from './components/project-map/node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component'; import { ConfiguratorDialogEthernetSwitchComponent } from './components/project-map/node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component'; import { PortsComponent } from './components/preferences/common/ports/ports.component'; +import { ConfiguratorDialogSwitchComponent } from './components/project-map/node-editors/configurator/switch/configurator-switch.component'; +import { ConfiguratorDialogVirtualBoxComponent } from './components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -359,7 +361,9 @@ if (environment.production) { ConfiguratorDialogVpcsComponent, ConfiguratorDialogEthernetHubComponent, ConfiguratorDialogEthernetSwitchComponent, - PortsComponent + PortsComponent, + ConfiguratorDialogSwitchComponent, + ConfiguratorDialogVirtualBoxComponent ], imports: [ BrowserModule, @@ -462,7 +466,9 @@ if (environment.production) { EditProjectDialogComponent, ConfiguratorDialogVpcsComponent, ConfiguratorDialogEthernetHubComponent, - ConfiguratorDialogEthernetSwitchComponent + ConfiguratorDialogEthernetSwitchComponent, + ConfiguratorDialogSwitchComponent, + ConfiguratorDialogVirtualBoxComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index 358a1dcc..fa537674 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -8,6 +8,7 @@ export class PortsMapping { export class Properties { ports_mapping: PortsMapping[]; + mappings: any; } export class Node { diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index c1bccc72..c638f319 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -5,6 +5,8 @@ import { MatDialog, MatDialogRef } from '@angular/material'; import { ConfiguratorDialogVpcsComponent } from '../../../node-editors/configurator/vpcs/configurator-vpcs.component'; import { ConfiguratorDialogEthernetHubComponent } from '../../../node-editors/configurator/ethernet_hub/configurator-ethernet-hub.component'; import { ConfiguratorDialogEthernetSwitchComponent } from '../../../node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component'; +import { ConfiguratorDialogSwitchComponent } from '../../../node-editors/configurator/switch/configurator-switch.component'; +import { ConfiguratorDialogVirtualBoxComponent } from '../../../node-editors/configurator/virtualbox/configurator-virtualbox.component'; @Component({ @@ -38,7 +40,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'qemu') { } else if (this.node.node_type === 'virtualbox') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogVirtualBoxComponent, this.conf); } else if (this.node.node_type === 'vmware') { } else if (this.node.node_type === 'docker') { @@ -46,9 +48,9 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'nat') { } else if (this.node.node_type === 'frame_relay_switch') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); } else if (this.node.node_type === 'atm_switch') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); } else if (this.node.node_type === 'traceng') { } diff --git a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html new file mode 100644 index 00000000..727083f0 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html @@ -0,0 +1,71 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts new file mode 100644 index 00000000..5b99d358 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts @@ -0,0 +1,54 @@ +import { Component, OnInit, Input } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; + + +@Component({ + selector: 'app-configurator-switch', + templateUrl: './configurator-switch.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogSwitchComponent implements OnInit { + server: Server; + node: Node; + name: string; + inputForm: FormGroup; + consoleTypes: string[] = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder + ) { + this.inputForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + }) + } + + onSaveClick() { + if (this.inputForm.valid) { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} diff --git a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html new file mode 100644 index 00000000..48dd570c --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html @@ -0,0 +1,70 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + +
+ + + + + + + {{type}} + + + + + Auto start console + + + + + + + + {{option[0]}} + + + +
+ + Start VM in headless mode + + + +
+ + + + + + + {{type}} + + + +
+
+ + Allow GNS3 to use any configured VirtualBox adapter + + + + + + + + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts new file mode 100644 index 00000000..d48c75e1 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts @@ -0,0 +1,71 @@ +import { Component, OnInit, Input } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { VirtualBoxConfigurationService } from '../../../../../services/virtual-box-configuration.service'; + + +@Component({ + selector: 'app-configurator-virtualbox', + templateUrl: './configurator-virtualbox.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogVirtualBoxComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + networkForm: FormGroup; + consoleTypes: string[] = []; + onCloseOptions = []; + networkTypes = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private virtualBoxConfigurationService: VirtualBoxConfigurationService + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required), + ram: new FormControl('', Validators.required) + }); + + this.networkForm = this.formBuilder.group({ + adapters: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + this.getConfiguration(); + }) + } + + getConfiguration() { + this.consoleTypes = this.virtualBoxConfigurationService.getConsoleTypes(); + this.onCloseOptions = this.virtualBoxConfigurationService.getOnCloseoptions(); + this.networkTypes = this.virtualBoxConfigurationService.getNetworkTypes(); + } + + onSaveClick() { + if (this.generalSettingsForm.valid) { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 838359b4ac3c4e81898f106eb995152113d574ac Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 11 Sep 2019 04:33:42 -0700 Subject: [PATCH 08/30] Code cleaned up --- src/app/app.module.ts | 4 ++- src/app/cartography/models/node.ts | 9 +++++ .../custom-adapters-table.component.html | 35 +++++++++++++++++++ .../custom-adapters-table.component.ts | 30 ++++++++++++++++ .../custom-adapters.component.html | 30 +++------------- .../qemu-vm-template-details.component.ts | 2 +- .../virtual-box-template-details.component.ts | 2 +- .../vmware-template-details.component.ts | 2 +- .../configurator/configurator.component.scss | 4 +++ .../configurator-virtualbox.component.html | 30 ++++++---------- .../configurator-virtualbox.component.ts | 2 ++ src/app/models/port.ts | 1 + 12 files changed, 103 insertions(+), 48 deletions(-) create mode 100644 src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.html create mode 100644 src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 21bb40ed..31d4bc25 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -218,6 +218,7 @@ import { ConfiguratorDialogEthernetSwitchComponent } from './components/project- import { PortsComponent } from './components/preferences/common/ports/ports.component'; import { ConfiguratorDialogSwitchComponent } from './components/project-map/node-editors/configurator/switch/configurator-switch.component'; import { ConfiguratorDialogVirtualBoxComponent } from './components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component'; +import { CustomAdaptersTableComponent } from './components/preferences/common/custom-adapters-table/custom-adapters-table.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -363,7 +364,8 @@ if (environment.production) { ConfiguratorDialogEthernetSwitchComponent, PortsComponent, ConfiguratorDialogSwitchComponent, - ConfiguratorDialogVirtualBoxComponent + ConfiguratorDialogVirtualBoxComponent, + CustomAdaptersTableComponent ], imports: [ BrowserModule, diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index fa537674..c464e865 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -7,6 +7,15 @@ export class PortsMapping { } export class Properties { + adapter_type: string; + adapters: number; + headless: boolean; + linked_clone: boolean; + on_close: string; + ram: number; + usage: string; + use_any_adapter: boolean; + vmname: string; ports_mapping: PortsMapping[]; mappings: any; } diff --git 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 new file mode 100644 index 00000000..67e35ebe --- /dev/null +++ b/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.html @@ -0,0 +1,35 @@ + + + + + + + + + + + + + + + + + + + + + + + +
Adapter number Adapter {{element.adapter_number}} Port name Ethernet {{element.adapter_number}} Adapter type + + + {{type}} + + + Actions + +
+ diff --git a/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts b/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts new file mode 100644 index 00000000..290262b2 --- /dev/null +++ b/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts @@ -0,0 +1,30 @@ +import { Component, Input, Output, EventEmitter } from '@angular/core'; +import { CustomAdapter } from '../../../../models/qemu/qemu-custom-adapter'; + + +@Component({ + selector: 'app-custom-adapters-table', + templateUrl: './custom-adapters-table.component.html', + styleUrls: ['../../preferences.component.scss'] +}) +export class CustomAdaptersTableComponent { + @Input() networkTypes = []; + @Input() displayedColumns: string[] = []; + @Input() adapters: CustomAdapter[] = []; + + public numberOfAdapters: number; + + onAdd() { + let adapter: CustomAdapter = { + adapter_number: this.adapters.length, + adapter_type: this.networkTypes[0] + } + this.adapters.push(adapter); + console.log(this.adapters); + this.adapters = [adapter]; + } + + delete(adapter: CustomAdapter) { + this.adapters = this.adapters.filter(elem => elem!== adapter); + } +} diff --git a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html index 29b52942..78e07b02 100644 --- a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html +++ b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html @@ -6,31 +6,11 @@
- - - - - - - - - - - - - - - - - - -
Adapter number Adapter {{element.adapter_number}} Port name Ethernet {{element.adapter_number}} Adapter type - - - {{type[1]}} ({{type[0]}}) - - -
+
diff --git a/src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.ts b/src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.ts index 0d26ab07..32caa4d9 100644 --- a/src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.ts +++ b/src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.ts @@ -31,7 +31,7 @@ export class QemuVmTemplateDetailsComponent implements OnInit { binaries: QemuBinary[] = []; activateCpuThrottling: boolean = true; isConfiguratorOpened: boolean = false; - displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type']; + displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; generalSettingsForm: FormGroup; @ViewChild("customAdaptersConfigurator", {static: false}) diff --git a/src/app/components/preferences/virtual-box/virtual-box-template-details/virtual-box-template-details.component.ts b/src/app/components/preferences/virtual-box/virtual-box-template-details/virtual-box-template-details.component.ts index 38c06674..d4469e15 100644 --- a/src/app/components/preferences/virtual-box/virtual-box-template-details/virtual-box-template-details.component.ts +++ b/src/app/components/preferences/virtual-box/virtual-box-template-details/virtual-box-template-details.component.ts @@ -24,7 +24,7 @@ export class VirtualBoxTemplateDetailsComponent implements OnInit { onCloseOptions = []; categories = []; networkTypes = []; - displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type']; + displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; isConfiguratorOpened: boolean = false; generalSettingsForm: FormGroup; networkForm: FormGroup diff --git a/src/app/components/preferences/vmware/vmware-template-details/vmware-template-details.component.ts b/src/app/components/preferences/vmware/vmware-template-details/vmware-template-details.component.ts index 724331dd..00bd2215 100644 --- a/src/app/components/preferences/vmware/vmware-template-details/vmware-template-details.component.ts +++ b/src/app/components/preferences/vmware/vmware-template-details/vmware-template-details.component.ts @@ -20,7 +20,7 @@ export class VmwareTemplateDetailsComponent implements OnInit { server: Server; vmwareTemplate: VmwareTemplate; generalSettingsForm: FormGroup; - displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type']; + displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; isConfiguratorOpened: boolean = false; isSymbolSelectionOpened: boolean = false; consoleTypes: string[] = []; diff --git a/src/app/components/project-map/node-editors/configurator/configurator.component.scss b/src/app/components/project-map/node-editors/configurator/configurator.component.scss index d914988c..f4fceb63 100644 --- a/src/app/components/project-map/node-editors/configurator/configurator.component.scss +++ b/src/app/components/project-map/node-editors/configurator/configurator.component.scss @@ -2,6 +2,10 @@ width: 100%; } +.configButton { + width: 100%; +} + .select { width: 100%; } diff --git a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html index 48dd570c..a7b20b57 100644 --- a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html +++ b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html @@ -4,7 +4,7 @@
- +
@@ -21,41 +21,33 @@ Auto start console - + - + {{option[0]}} - + Start VM in headless mode
-
- - - - - - - {{type}} - - - -
-
- + Allow GNS3 to use any configured VirtualBox adapter + - + diff --git a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts index d48c75e1..6119ea69 100644 --- a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts +++ b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts @@ -21,6 +21,8 @@ export class ConfiguratorDialogVirtualBoxComponent implements OnInit { networkForm: FormGroup; consoleTypes: string[] = []; onCloseOptions = []; + + displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; networkTypes = []; constructor( diff --git a/src/app/models/port.ts b/src/app/models/port.ts index 946fc56c..6b8c4429 100644 --- a/src/app/models/port.ts +++ b/src/app/models/port.ts @@ -1,5 +1,6 @@ export class Port { adapter_number: number; + adapter_type: string; link_type: string; name: string; port_number: number; From e90445462334c5e69b5c11e2a434044e06828f3a Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 11 Sep 2019 04:58:45 -0700 Subject: [PATCH 09/30] Fix for virtualbox --- src/app/cartography/models/node.ts | 2 ++ .../custom-adapters-table.component.ts | 4 +--- .../configurator-virtualbox.component.html | 5 +++-- .../configurator-virtualbox.component.ts | 17 +++++++++++++++-- src/app/services/node.service.ts | 10 ++++++++++ 5 files changed, 31 insertions(+), 7 deletions(-) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index c464e865..f7f15621 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -1,5 +1,6 @@ import { Label } from './label'; import { Port } from '../../models/port'; +import { CustomAdapter } from '../../models/qemu/qemu-custom-adapter'; export class PortsMapping { name: string; @@ -27,6 +28,7 @@ export class Node { console_auto_start: boolean; console_host: string; console_type: string; + custom_adapters?: CustomAdapter[]; first_port_name: string; height: number; label: Label; diff --git a/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts b/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts index 290262b2..f9ad5452 100644 --- a/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts +++ b/src/app/components/preferences/common/custom-adapters-table/custom-adapters-table.component.ts @@ -19,9 +19,7 @@ export class CustomAdaptersTableComponent { adapter_number: this.adapters.length, adapter_type: this.networkTypes[0] } - this.adapters.push(adapter); - console.log(this.adapters); - this.adapters = [adapter]; + this.adapters = this.adapters.concat([adapter]); } delete(adapter: CustomAdapter) { diff --git a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html index a7b20b57..991be342 100644 --- a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html +++ b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.html @@ -6,7 +6,7 @@ -
+
@@ -36,10 +36,11 @@ - +
Allow GNS3 to use any configured VirtualBox adapter , public nodeService: NodeService, @@ -58,7 +61,17 @@ export class ConfiguratorDialogVirtualBoxComponent implements OnInit { onSaveClick() { if (this.generalSettingsForm.valid) { - this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.node.custom_adapters = []; + this.customAdapters.adapters.forEach(n => { + this.node.custom_adapters.push({ + adapter_number: n.adapter_number, + adapter_type: n.adapter_type + }) + }); + + this.node.properties.adapters = this.node.custom_adapters.length; + + this.nodeService.updateNodeWithCustomAdapters(this.server, this.node).subscribe(() => { this.toasterService.success(`Node ${this.node.name} updated.`); this.onCancelClick(); }); diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index c94bd3c5..d07c19d6 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -94,6 +94,16 @@ export class NodeService { }); } + updateNodeWithCustomAdapters(server: Server, node: Node): Observable { + return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { + console_type: node.console_type, + console_auto_start: node.console_auto_start, + custom_adapters: node.custom_adapters, + name: node.name, + properties: node.properties + }); + } + delete(server: Server, node: Node) { return this.httpServer.delete(server, `/projects/${node.project_id}/nodes/${node.node_id}`); } From 35c96d1c90942ce66d736c4e0f4ef131d9e11d33 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 11 Sep 2019 05:40:23 -0700 Subject: [PATCH 10/30] Code cleaned up --- .../custom-adapters/custom-adapters.component.html | 1 + .../custom-adapters/custom-adapters.component.ts | 13 ++++++++++++- .../virtualbox/configurator-virtualbox.component.ts | 5 ----- 3 files changed, 13 insertions(+), 6 deletions(-) diff --git a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html index 78e07b02..53e1855b 100644 --- a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html +++ b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.html @@ -7,6 +7,7 @@
(); @Output() saveConfigurationEmitter = new EventEmitter(); + @ViewChild("customAdapters", {static: false}) customAdapters: CustomAdaptersTableComponent; + public adapters: CustomAdapter[]; public numberOfAdapters: number; @@ -21,6 +24,14 @@ export class CustomAdaptersComponent { } configureCustomAdapters(){ + this.adapters = []; + this.customAdapters.adapters.forEach(n => { + this.adapters.push({ + adapter_number: n.adapter_number, + adapter_type: n.adapter_type + }) + }); + this.saveConfigurationEmitter.emit(this.adapters); } } diff --git a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts index b99a9819..83ffeeed 100644 --- a/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts +++ b/src/app/components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component.ts @@ -19,7 +19,6 @@ export class ConfiguratorDialogVirtualBoxComponent implements OnInit { node: Node; name: string; generalSettingsForm: FormGroup; - networkForm: FormGroup; consoleTypes: string[] = []; onCloseOptions = []; @@ -39,10 +38,6 @@ export class ConfiguratorDialogVirtualBoxComponent implements OnInit { name: new FormControl('', Validators.required), ram: new FormControl('', Validators.required) }); - - this.networkForm = this.formBuilder.group({ - adapters: new FormControl('', Validators.required) - }); } ngOnInit() { From 41707d6724ba56868d4abd2aef45063c140ef2f5 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 11 Sep 2019 05:45:58 -0700 Subject: [PATCH 11/30] Update custom-adapters.component.spec.ts --- .../common/custom-adapters/custom-adapters.component.spec.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.spec.ts b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.spec.ts index 2ea2b4ca..08551de4 100644 --- a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.spec.ts +++ b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.spec.ts @@ -4,6 +4,7 @@ import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { CommonModule } from '@angular/common'; import { NO_ERRORS_SCHEMA } from '@angular/core'; import { CustomAdaptersComponent } from './custom-adapters.component'; +import { CustomAdaptersTableComponent } from '../custom-adapters-table/custom-adapters-table.component'; describe('Custom adapters component', () => { let component: CustomAdaptersComponent; @@ -31,6 +32,7 @@ describe('Custom adapters component', () => { it('should emit event when apply clicked', () => { spyOn(component.saveConfigurationEmitter, 'emit'); + component.customAdapters = {adapters: []} as CustomAdaptersTableComponent; component.configureCustomAdapters(); From 8fe6a3d517ddba26ddc4580a4ebc39f5d7d4df5d Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 11 Sep 2019 08:11:43 -0700 Subject: [PATCH 12/30] Basic implementation for qemu --- src/app/app.module.ts | 7 +- src/app/cartography/models/node.ts | 30 ++++ .../config-action/config-action.component.ts | 7 +- .../qemu/configurator-qemu.component.html | 157 ++++++++++++++++++ .../qemu/configurator-qemu.component.ts | 93 +++++++++++ 5 files changed, 289 insertions(+), 5 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 31d4bc25..b56aa954 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -219,6 +219,7 @@ import { PortsComponent } from './components/preferences/common/ports/ports.comp import { ConfiguratorDialogSwitchComponent } from './components/project-map/node-editors/configurator/switch/configurator-switch.component'; import { ConfiguratorDialogVirtualBoxComponent } from './components/project-map/node-editors/configurator/virtualbox/configurator-virtualbox.component'; import { CustomAdaptersTableComponent } from './components/preferences/common/custom-adapters-table/custom-adapters-table.component'; +import { ConfiguratorDialogQemuComponent } from './components/project-map/node-editors/configurator/qemu/configurator-qemu.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -365,7 +366,8 @@ if (environment.production) { PortsComponent, ConfiguratorDialogSwitchComponent, ConfiguratorDialogVirtualBoxComponent, - CustomAdaptersTableComponent + CustomAdaptersTableComponent, + ConfiguratorDialogQemuComponent ], imports: [ BrowserModule, @@ -470,7 +472,8 @@ if (environment.production) { ConfiguratorDialogEthernetHubComponent, ConfiguratorDialogEthernetSwitchComponent, ConfiguratorDialogSwitchComponent, - ConfiguratorDialogVirtualBoxComponent + ConfiguratorDialogVirtualBoxComponent, + ConfiguratorDialogQemuComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index f7f15621..266a099a 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -19,6 +19,36 @@ export class Properties { vmname: string; ports_mapping: PortsMapping[]; mappings: any; + bios_image: string; + bios_image_md5sum?: any; + boot_priority: string; + cdrom_image: string; + cdrom_image_md5sum?: any; + cpu_throttling: number; + cpus: number; + hda_disk_image: string; + hda_disk_image_md5sum: string; + hda_disk_interface: string; + hdb_disk_image: string; + hdb_disk_image_md5sum?: any; + hdb_disk_interface: string; + hdc_disk_image: string; + hdc_disk_image_md5sum?: any; + hdc_disk_interface: string; + hdd_disk_image: string; + hdd_disk_image_md5sum?: any; + hdd_disk_interface: string; + initrd: string; + initrd_md5sum?: any; + kernel_command_line: string; + kernel_image: string; + kernel_image_md5sum?: any; + legacy_networking: boolean; + mac_address: string; + options: string; + platform: string; + process_priority: string; + qemu_path: string; } export class Node { diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index c638f319..0bc7fb9c 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -7,6 +7,7 @@ import { ConfiguratorDialogEthernetHubComponent } from '../../../node-editors/co import { ConfiguratorDialogEthernetSwitchComponent } from '../../../node-editors/configurator/ethernet-switch/configurator-ethernet-switch.component'; import { ConfiguratorDialogSwitchComponent } from '../../../node-editors/configurator/switch/configurator-switch.component'; import { ConfiguratorDialogVirtualBoxComponent } from '../../../node-editors/configurator/virtualbox/configurator-virtualbox.component'; +import { ConfiguratorDialogQemuComponent } from '../../../node-editors/configurator/qemu/configurator-qemu.component'; @Component({ @@ -38,7 +39,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'iou') { } else if (this.node.node_type === 'qemu') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogQemuComponent, this.conf); } else if (this.node.node_type === 'virtualbox') { this.dialogRef = this.dialog.open(ConfiguratorDialogVirtualBoxComponent, this.conf); } else if (this.node.node_type === 'vmware') { @@ -48,9 +49,9 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'nat') { } else if (this.node.node_type === 'frame_relay_switch') { - this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); + this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); // to do } else if (this.node.node_type === 'atm_switch') { - this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); + this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); // to do } else if (this.node.node_type === 'traceng') { } diff --git 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 new file mode 100644 index 00000000..a4c3cb3a --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.html @@ -0,0 +1,157 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + +
+ + + + + + + + + + + + + + {{binary.path}} + + + + + + + {{priority[0]}} + + + + + + + {{option[0]}} + + + + + + + {{type}} + + + + + Auto start console + + + + + + + HDA (Primary Master) + + + + + + + + + {{interface}} + + + + + + + + + HDB (Primary Slave) + + + + + + + + + {{interface}} + + + + + + + + + HDC (Secondary Master) + + + + + + + + + {{interface}} + + + + + + + + + HDD (Secondary Slave) + + + + + + + + + {{interface}} + + + + + + + + + + +
+ Allow GNS3 to use any configured VirtualBox adapter + + + + + + + + + + + + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts new file mode 100644 index 00000000..c5926aef --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts @@ -0,0 +1,93 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { CustomAdaptersTableComponent } from '../../../../../components/preferences/common/custom-adapters-table/custom-adapters-table.component'; +import { QemuService } from '../../../../../services/qemu.service'; +import { QemuConfigurationService } from '../../../../../services/qemu-configuration.service'; +import { QemuBinary } from '../../../../../models/qemu/qemu-binary'; + + +@Component({ + selector: 'app-configurator-qemu', + templateUrl: './configurator-qemu.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogQemuComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + consoleTypes: string[] = []; + binaries: QemuBinary[] = []; + onCloseOptions = []; + bootPriorities = []; + diskInterfaces: string[] = []; + + displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; + networkTypes = []; + + @ViewChild("customAdapters", {static: false}) customAdapters: CustomAdaptersTableComponent; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private qemuService: QemuService, + private qemuConfigurationService: QemuConfigurationService + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required), + ram: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + this.getConfiguration(); + }) + + this.qemuService.getBinaries(this.server).subscribe((qemuBinaries: QemuBinary[]) => { + this.binaries = qemuBinaries; + }); + } + + getConfiguration() { + this.consoleTypes = this.qemuConfigurationService.getConsoleTypes(); + this.onCloseOptions = this.qemuConfigurationService.getOnCloseOptions(); + this.networkTypes = this.qemuConfigurationService.getNetworkTypes(); + this.bootPriorities = this.qemuConfigurationService.getBootPriorities(); + this.diskInterfaces = this.qemuConfigurationService.getDiskInterfaces(); + } + + onSaveClick() { + if (this.generalSettingsForm.valid) { + this.node.custom_adapters = []; + this.customAdapters.adapters.forEach(n => { + this.node.custom_adapters.push({ + adapter_number: n.adapter_number, + adapter_type: n.adapter_type + }) + }); + + this.node.properties.adapters = this.node.custom_adapters.length; + + this.nodeService.updateNodeWithCustomAdapters(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 4b90568b7b175681b682c35a8c75b46906965738 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 12 Sep 2019 04:26:00 -0700 Subject: [PATCH 13/30] Configurator for qemu --- .../configurator/configurator.component.scss | 13 ++ .../qemu/configurator-qemu.component.html | 121 +++++++++++++++++- .../qemu/configurator-qemu.component.ts | 22 +++- src/app/services/node.service.ts | 10 ++ 4 files changed, 158 insertions(+), 8 deletions(-) diff --git a/src/app/components/project-map/node-editors/configurator/configurator.component.scss b/src/app/components/project-map/node-editors/configurator/configurator.component.scss index f4fceb63..e4e49d62 100644 --- a/src/app/components/project-map/node-editors/configurator/configurator.component.scss +++ b/src/app/components/project-map/node-editors/configurator/configurator.component.scss @@ -17,6 +17,19 @@ scrollbar-width: thin; } +.file-button { + width: 18%; +} + +.file-name-form-field { + padding-left: 2%; + width: 80%; +} + +.nonvisible { + display: none; +} + ::-webkit-scrollbar { width: 0.5em; } diff --git 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 index a4c3cb3a..89236308 100644 --- 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 @@ -10,10 +10,10 @@ - - + + @@ -124,11 +124,25 @@ - +
+ + + + + +
-
- Allow GNS3 to use any configured VirtualBox adapter +
+ Use the legacy networking mode - + + + + Linux boot specific settings + + +
+ + + + + +
+
+ + + + + +
+ + + + + + + + + Bios + + +
+ + + + + +
+ + + + + + Optimization + + + + Activate CPU throttling + + + + + + + + {{priority}} + + + + + + + + + Additional settings + + + + + + + diff --git a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts index c5926aef..8367c196 100644 --- a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts +++ b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts @@ -58,10 +58,28 @@ export class ConfiguratorDialogQemuComponent implements OnInit { }); } + uploadCdromImageFile(event){ + this.node.properties.cdrom_image = event.target.files[0].name; + } + + uploadInitrdFile(event){ + this.node.properties.initrd = event.target.files[0].name; + } + + uploadKernelImageFile(event){ + this.node.properties.kernel_image = event.target.files[0].name; + } + + uploadBiosFile(event){ + this.node.properties.bios_image = event.target.files[0].name; + } + getConfiguration() { this.consoleTypes = this.qemuConfigurationService.getConsoleTypes(); this.onCloseOptions = this.qemuConfigurationService.getOnCloseOptions(); - this.networkTypes = this.qemuConfigurationService.getNetworkTypes(); + this.qemuConfigurationService.getNetworkTypes().forEach(n => { + this.networkTypes.push(n[0]); + }); this.bootPriorities = this.qemuConfigurationService.getBootPriorities(); this.diskInterfaces = this.qemuConfigurationService.getDiskInterfaces(); } @@ -78,7 +96,7 @@ export class ConfiguratorDialogQemuComponent implements OnInit { this.node.properties.adapters = this.node.custom_adapters.length; - this.nodeService.updateNodeWithCustomAdapters(this.server, this.node).subscribe(() => { + this.nodeService. updateNodeWithCustomAdapters(this.server, this.node).subscribe(() => { this.toasterService.success(`Node ${this.node.name} updated.`); this.onCancelClick(); }); diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index d07c19d6..bd6bed53 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -104,6 +104,16 @@ export class NodeService { }); } + updateQemuNode(server: Server, node: Node): Observable { + return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { + console_type: node.console_type, + console_auto_start: node.console_auto_start, + custom_adapters: node.custom_adapters, + name: node.name, + properties: node.properties + }); + } + delete(server: Server, node: Node) { return this.httpServer.delete(server, `/projects/${node.project_id}/nodes/${node.node_id}`); } From 36a8387ea29c09222479ff9146de2b9f1311cffa Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 12 Sep 2019 04:28:31 -0700 Subject: [PATCH 14/30] Update node.service.ts --- src/app/services/node.service.ts | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index bd6bed53..d07c19d6 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -104,16 +104,6 @@ export class NodeService { }); } - updateQemuNode(server: Server, node: Node): Observable { - return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { - console_type: node.console_type, - console_auto_start: node.console_auto_start, - custom_adapters: node.custom_adapters, - name: node.name, - properties: node.properties - }); - } - delete(server: Server, node: Node) { return this.httpServer.delete(server, `/projects/${node.project_id}/nodes/${node.node_id}`); } From aea8010e0a2db31677011d32782226559b5a12d0 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 12 Sep 2019 07:55:17 -0700 Subject: [PATCH 15/30] Configurator for switch --- .../cloud/configurator-cloud.component.html | 0 .../cloud/configurator-cloud.component.ts | 0 .../switch/configurator-switch.component.html | 17 ++++++++++--- .../switch/configurator-switch.component.ts | 25 ++++++++++++++++++- 4 files changed, 37 insertions(+), 5 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/cloud/configurator-cloud.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/cloud/configurator-cloud.component.ts diff --git a/src/app/components/project-map/node-editors/configurator/cloud/configurator-cloud.component.html b/src/app/components/project-map/node-editors/configurator/cloud/configurator-cloud.component.html new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/project-map/node-editors/configurator/cloud/configurator-cloud.component.ts b/src/app/components/project-map/node-editors/configurator/cloud/configurator-cloud.component.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html index 727083f0..9410a44f 100644 --- a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html +++ b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.html @@ -4,13 +4,22 @@
- +
+ +
+ + + +
+ +
+ Source + + + + + + + Destination + + + + + + +
+ +
diff --git a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts index 1ead27b8..b6215af3 100644 --- a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts +++ b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts @@ -10,18 +10,25 @@ import { MatDialogRef } from '@angular/material'; @Component({ selector: 'app-configurator-switch', templateUrl: './configurator-switch.component.html', - styleUrls: ['../configurator.component.scss'] + styleUrls: ['../configurator.component.scss', '../../../../preferences/preferences.component.scss'] }) export class ConfiguratorDialogSwitchComponent implements OnInit { server: Server; node: Node; name: string; + nameForm: FormGroup; inputForm: FormGroup; consoleTypes: string[] = []; nodeMappings = new Map(); + nodeMappingsDataSource: NodeMapping[] = []; dataSource = []; - displayedColumns = ['Port: DLCI', 'Port: DLCI '] + displayedColumns = ['portIn', 'portOut', 'actions'] + + sourcePort: string = ''; + sourceDlci: string = ''; + destinationPort: string = ''; + destinationDlci: string = ''; constructor( public dialogRef: MatDialogRef, @@ -29,8 +36,15 @@ export class ConfiguratorDialogSwitchComponent implements OnInit { private toasterService: ToasterService, private formBuilder: FormBuilder ) { + this.nameForm = this.formBuilder.group({ + name: new FormControl('', Validators.required), + }); + this.inputForm = this.formBuilder.group({ - name: new FormControl('', Validators.required) + sourcePort: new FormControl('', Validators.required), + sourceDlci: new FormControl('', Validators.required), + destinationPort: new FormControl('', Validators.required), + destinationDlci: new FormControl('', Validators.required), }); } @@ -43,11 +57,43 @@ export class ConfiguratorDialogSwitchComponent implements OnInit { Object.keys(mappings).forEach(key => { this.nodeMappings.set(key, mappings[key]); }); + + this.nodeMappings.forEach((value: string, key: string) => { + this.nodeMappingsDataSource.push({ + portIn: key, + portOut: value + }); + }); }); } - delete(elem) { - + delete(elem: NodeMapping) { + this.nodeMappingsDataSource = this.nodeMappingsDataSource.filter(n => n !== elem); + } + + add() { + if (this.inputForm.valid) { + let nodeMapping: NodeMapping = { + portIn: `${this.sourcePort}:${this.sourceDlci}`, + portOut: `${this.destinationPort}:${this.destinationDlci}` + }; + + if (this.nodeMappingsDataSource.filter(n => n.portIn === nodeMapping.portIn).length > 0) { + this.toasterService.error('Mapping already defined.'); + } else { + this.nodeMappingsDataSource = this.nodeMappingsDataSource.concat([nodeMapping]); + this.clearUserInput(); + } + } else { + this.toasterService.error('Fill all required fields.'); + } + } + + clearUserInput() { + this.sourcePort = ''; + this.sourceDlci = ''; + this.destinationPort = ''; + this.destinationDlci = ''; } strMapToObj(strMap) { @@ -59,7 +105,12 @@ export class ConfiguratorDialogSwitchComponent implements OnInit { } onSaveClick() { - if (this.inputForm.valid) { + if (this.nameForm.valid) { + this.nodeMappings.clear(); + this.nodeMappingsDataSource.forEach(elem => { + this.nodeMappings.set(elem.portIn, elem.portOut); + }); + this.node.properties.mappings = Array.from(this.nodeMappings).reduce((obj, [key, value]) => (Object.assign(obj, { [key]: value })), {}); this.nodeService.updateNode(this.server, this.node).subscribe(() => { @@ -75,3 +126,8 @@ export class ConfiguratorDialogSwitchComponent implements OnInit { this.dialogRef.close(); } } + +export interface NodeMapping { + portIn: string, + portOut: string +} From 75bf2ef3de72940678fb04da17227f61dda269bd Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Mon, 16 Sep 2019 04:00:05 -0700 Subject: [PATCH 19/30] Support for ATM switch added --- src/app/app.module.ts | 7 +- .../config-action/config-action.component.ts | 5 +- .../configurator-atm-switch.component.html | 109 ++++++++++++ .../configurator-atm-switch.component.ts | 164 ++++++++++++++++++ .../switch/configurator-switch.component.ts | 8 +- 5 files changed, 285 insertions(+), 8 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 08d89f07..30297819 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -222,6 +222,7 @@ import { CustomAdaptersTableComponent } from './components/preferences/common/cu import { ConfiguratorDialogQemuComponent } from './components/project-map/node-editors/configurator/qemu/configurator-qemu.component'; import { ConfiguratorDialogCloudComponent } from './components/project-map/node-editors/configurator/cloud/configurator-cloud.component'; import { UdpTunnelsComponent } from './components/preferences/common/udp-tunnels/udp-tunnels.component'; +import { ConfiguratorDialogAtmSwitchComponent } from './components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -371,7 +372,8 @@ if (environment.production) { CustomAdaptersTableComponent, ConfiguratorDialogQemuComponent, ConfiguratorDialogCloudComponent, - UdpTunnelsComponent + UdpTunnelsComponent, + ConfiguratorDialogAtmSwitchComponent ], imports: [ BrowserModule, @@ -478,7 +480,8 @@ if (environment.production) { ConfiguratorDialogSwitchComponent, ConfiguratorDialogVirtualBoxComponent, ConfiguratorDialogQemuComponent, - ConfiguratorDialogCloudComponent + ConfiguratorDialogCloudComponent, + ConfiguratorDialogAtmSwitchComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index 47263086..42712438 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -9,6 +9,7 @@ import { ConfiguratorDialogSwitchComponent } from '../../../node-editors/configu import { ConfiguratorDialogVirtualBoxComponent } from '../../../node-editors/configurator/virtualbox/configurator-virtualbox.component'; import { ConfiguratorDialogQemuComponent } from '../../../node-editors/configurator/qemu/configurator-qemu.component'; import { ConfiguratorDialogCloudComponent } from '../../../node-editors/configurator/cloud/configurator-cloud.component'; +import { ConfiguratorDialogAtmSwitchComponent } from '../../../node-editors/configurator/atm_switch/configurator-atm-switch.component'; @Component({ @@ -50,9 +51,9 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'nat') { } else if (this.node.node_type === 'frame_relay_switch') { - this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); // to do + this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); } else if (this.node.node_type === 'atm_switch') { - this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); // to do + this.dialogRef = this.dialog.open(ConfiguratorDialogAtmSwitchComponent, this.conf); } else if (this.node.node_type === 'traceng') { } diff --git a/src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.html b/src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.html new file mode 100644 index 00000000..26836351 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.html @@ -0,0 +1,109 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + + + + + + + + + + + + + + + + + +
Port : VPI : VCI {{element.portIn}} Port : VPI : VCI {{element.portOut}} Actions + +

+ +
+ + + +
+ + + Use VPI only (VP tunnel) + + +
+ Source + + + +
+
+ + + +
+
+ + + + Destination + + + +
+
+ + + +
+
+ + + +
+ + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.ts b/src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.ts new file mode 100644 index 00000000..98114c56 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component.ts @@ -0,0 +1,164 @@ +import { Component, OnInit, Input } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; + + +@Component({ + selector: 'app-configurator-atm-switch', + templateUrl: './configurator-atm-switch.component.html', + styleUrls: ['../configurator.component.scss', '../../../../preferences/preferences.component.scss'] +}) +export class ConfiguratorDialogAtmSwitchComponent implements OnInit { + server: Server; + node: Node; + name: string; + nameForm: FormGroup; + inputForm: FormGroup; + abstractForm: FormGroup; + consoleTypes: string[] = []; + + nodeMappings = new Map(); + nodeMappingsDataSource: NodeMapping[] = []; + dataSource = []; + displayedColumns = ['portIn', 'portOut', 'actions'] + + sourcePort: string = ''; + sourceVpi: string = ''; + sourceVci: string = ''; + destinationPort: string = ''; + destinationVpi: string = ''; + destinationVci: string = ''; + + useVpiOnly: boolean = false; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder + ) { + this.nameForm = this.formBuilder.group({ + name: new FormControl('', Validators.required), + }); + + this.inputForm = this.formBuilder.group({ + sourcePort: new FormControl('', Validators.required), + sourceVci: new FormControl('', Validators.required), + destinationPort: new FormControl('', Validators.required), + destinationVci: new FormControl('', Validators.required), + }); + + this.abstractForm = this.formBuilder.group({ + sourceVpi: new FormControl('', Validators.required), + destinationVpi: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + + let mappings = node.properties.mappings; + Object.keys(mappings).forEach(key => { + this.nodeMappings.set(key, mappings[key]); + }); + + this.nodeMappings.forEach((value: string, key: string) => { + this.nodeMappingsDataSource.push({ + portIn: key, + portOut: value + }); + }); + }); + } + + delete(elem: NodeMapping) { + this.nodeMappingsDataSource = this.nodeMappingsDataSource.filter(n => n !== elem); + } + + add() { + if (this.inputForm.valid) { + let nodeMapping: NodeMapping; + if (!this.useVpiOnly) { + if (this.abstractForm.valid) { + nodeMapping = { + portIn: `${this.sourcePort}:${this.sourceVpi}:${this.sourceVci}`, + portOut: `${this.destinationPort}:${this.destinationVpi}:${this.destinationVci}` + }; + + if (this.nodeMappingsDataSource.filter(n => n.portIn === nodeMapping.portIn).length > 0) { + this.toasterService.error('Mapping already defined.'); + } else { + this.nodeMappingsDataSource = this.nodeMappingsDataSource.concat([nodeMapping]); + this.clearUserInput(); + } + } else { + this.toasterService.error('Fill all required fields.'); + } + } else { + nodeMapping = { + portIn: `${this.sourcePort}:${this.sourceVci}`, + portOut: `${this.destinationPort}:${this.destinationVci}` + }; + + if (this.nodeMappingsDataSource.filter(n => n.portIn === nodeMapping.portIn).length > 0) { + this.toasterService.error('Mapping already defined.'); + } else { + this.nodeMappingsDataSource = this.nodeMappingsDataSource.concat([nodeMapping]); + this.clearUserInput(); + } + } + } else { + this.toasterService.error('Fill all required fields.'); + } + } + + clearUserInput() { + this.sourcePort = '0'; + this.sourceVpi = '0'; + this.sourceVci = '0'; + this.destinationPort = '0'; + this.destinationVpi = '0'; + this.sourceVci = '0'; + } + + strMapToObj(strMap) { + let obj = Object.create(null); + for (let [k,v] of strMap) { + obj[k] = v; + } + return obj; + } + + onSaveClick() { + if (this.nameForm.valid) { + this.nodeMappings.clear(); + this.nodeMappingsDataSource.forEach(elem => { + this.nodeMappings.set(elem.portIn, elem.portOut); + }); + + this.node.properties.mappings = Array.from(this.nodeMappings).reduce((obj, [key, value]) => (Object.assign(obj, { [key]: value })), {}); + + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} + +export interface NodeMapping { + portIn: string, + portOut: string +} diff --git a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts index b6215af3..744b423d 100644 --- a/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts +++ b/src/app/components/project-map/node-editors/configurator/switch/configurator-switch.component.ts @@ -90,10 +90,10 @@ export class ConfiguratorDialogSwitchComponent implements OnInit { } clearUserInput() { - this.sourcePort = ''; - this.sourceDlci = ''; - this.destinationPort = ''; - this.destinationDlci = ''; + this.sourcePort = '0'; + this.sourceDlci = '0'; + this.destinationPort = '0'; + this.destinationDlci = '0'; } strMapToObj(strMap) { From fb06398517339b0fd3e5a94f1a36c4be2c5161f3 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 17 Sep 2019 00:57:06 -0700 Subject: [PATCH 20/30] Configurator for VMware added --- src/app/app.module.ts | 7 +- .../config-action/config-action.component.ts | 3 +- .../vmware/configurator-vmware.component.html | 63 +++++++++++++++ .../vmware/configurator-vmware.component.ts | 80 +++++++++++++++++++ 4 files changed, 150 insertions(+), 3 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 30297819..6410bb63 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -223,6 +223,7 @@ import { ConfiguratorDialogQemuComponent } from './components/project-map/node-e import { ConfiguratorDialogCloudComponent } from './components/project-map/node-editors/configurator/cloud/configurator-cloud.component'; import { UdpTunnelsComponent } from './components/preferences/common/udp-tunnels/udp-tunnels.component'; import { ConfiguratorDialogAtmSwitchComponent } from './components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component'; +import { ConfiguratorDialogVmwareComponent } from './components/project-map/node-editors/configurator/vmware/configurator-vmware.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -373,7 +374,8 @@ if (environment.production) { ConfiguratorDialogQemuComponent, ConfiguratorDialogCloudComponent, UdpTunnelsComponent, - ConfiguratorDialogAtmSwitchComponent + ConfiguratorDialogAtmSwitchComponent, + ConfiguratorDialogVmwareComponent ], imports: [ BrowserModule, @@ -481,7 +483,8 @@ if (environment.production) { ConfiguratorDialogVirtualBoxComponent, ConfiguratorDialogQemuComponent, ConfiguratorDialogCloudComponent, - ConfiguratorDialogAtmSwitchComponent + ConfiguratorDialogAtmSwitchComponent, + ConfiguratorDialogVmwareComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index 42712438..53621f68 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -10,6 +10,7 @@ import { ConfiguratorDialogVirtualBoxComponent } from '../../../node-editors/con import { ConfiguratorDialogQemuComponent } from '../../../node-editors/configurator/qemu/configurator-qemu.component'; import { ConfiguratorDialogCloudComponent } from '../../../node-editors/configurator/cloud/configurator-cloud.component'; import { ConfiguratorDialogAtmSwitchComponent } from '../../../node-editors/configurator/atm_switch/configurator-atm-switch.component'; +import { ConfiguratorDialogVmwareComponent } from '../../../node-editors/configurator/vmware/configurator-vmware.component'; @Component({ @@ -45,7 +46,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'virtualbox') { this.dialogRef = this.dialog.open(ConfiguratorDialogVirtualBoxComponent, this.conf); } else if (this.node.node_type === 'vmware') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogVmwareComponent, this.conf); } else if (this.node.node_type === 'docker') { } else if (this.node.node_type === 'nat') { diff --git a/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html b/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html new file mode 100644 index 00000000..c872e58a --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html @@ -0,0 +1,63 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + +
+ + + + + + + {{type}} + + + + + Auto start console + + + + + {{option[0]}} + + + +
+ + Start VM in headless mode + + + Use a linked base VM (experimental) + + + +
+ Allow GNS3 to override non custom VMware adapter + + + + + + + + + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.ts b/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.ts new file mode 100644 index 00000000..707e36ff --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.ts @@ -0,0 +1,80 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { CustomAdaptersTableComponent } from '../../../../../components/preferences/common/custom-adapters-table/custom-adapters-table.component'; +import { VmwareConfigurationService } from '../../../../../services/vmware-configuration.service'; + + +@Component({ + selector: 'app-configurator-vmware', + templateUrl: './configurator-vmware.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogVmwareComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + consoleTypes: string[] = []; + onCloseOptions = []; + + displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; + networkTypes = []; + + @ViewChild("customAdapters", {static: false}) customAdapters: CustomAdaptersTableComponent; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private vmwareConfigurationService: VmwareConfigurationService + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + this.getConfiguration(); + }) + } + + getConfiguration() { + this.consoleTypes = this.vmwareConfigurationService.getConsoleTypes(); + this.onCloseOptions = this.vmwareConfigurationService.getOnCloseoptions(); + this.networkTypes = this.vmwareConfigurationService.getNetworkTypes(); + } + + onSaveClick() { + if (this.generalSettingsForm.valid) { + this.node.custom_adapters = []; + this.customAdapters.adapters.forEach(n => { + this.node.custom_adapters.push({ + adapter_number: n.adapter_number, + adapter_type: n.adapter_type + }) + }); + + this.node.properties.adapters = this.node.custom_adapters.length; + + this.nodeService.updateNodeWithCustomAdapters(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 94f179c74ff6d792b485c7981e57d45c0de7d60d Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 17 Sep 2019 01:53:30 -0700 Subject: [PATCH 21/30] Temporary fix for qemu template details page --- .../custom-adapters.component.ts | 6 ++ .../services/qemu-configuration.service.ts | 62 +++++++++++++------ 2 files changed, 48 insertions(+), 20 deletions(-) diff --git a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.ts b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.ts index e693a133..cdc00db9 100644 --- a/src/app/components/preferences/common/custom-adapters/custom-adapters.component.ts +++ b/src/app/components/preferences/common/custom-adapters/custom-adapters.component.ts @@ -19,12 +19,18 @@ export class CustomAdaptersComponent { public adapters: CustomAdapter[]; public numberOfAdapters: number; + constructor() { + console.log(this.networkTypes); + } + cancelConfigureCustomAdapters(){ this.closeConfiguratorEmitter.emit(false); } configureCustomAdapters(){ this.adapters = []; + console.log(this.customAdapters); + this.customAdapters.adapters.forEach(n => { this.adapters.push({ adapter_number: n.adapter_number, diff --git a/src/app/services/qemu-configuration.service.ts b/src/app/services/qemu-configuration.service.ts index 8c410031..3e73903d 100644 --- a/src/app/services/qemu-configuration.service.ts +++ b/src/app/services/qemu-configuration.service.ts @@ -11,26 +11,48 @@ export class QemuConfigurationService { } getNetworkTypes() { - 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"]]; + // 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", "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"]; return networkTypes; } From c1099b22bb53bad2acb145f8303da8e6cd42f596 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 17 Sep 2019 01:58:48 -0700 Subject: [PATCH 22/30] Update configurator-vmware.component.html --- .../configurator/vmware/configurator-vmware.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html b/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html index c872e58a..6750e2b5 100644 --- a/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html +++ b/src/app/components/project-map/node-editors/configurator/vmware/configurator-vmware.component.html @@ -30,7 +30,7 @@ Start VM in headless mode - +
Use a linked base VM (experimental) From 6f922078476239f20cf1277d26a245d4e2b7d58a Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 17 Sep 2019 04:15:50 -0700 Subject: [PATCH 23/30] Configurator for IOU added --- src/app/app.module.ts | 7 +- src/app/cartography/models/node.ts | 3 + .../config-action/config-action.component.ts | 3 +- .../iou/configurator-iou.component.html | 57 ++++++++++++++++ .../iou/configurator-iou.component.ts | 67 +++++++++++++++++++ 5 files changed, 134 insertions(+), 3 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 6410bb63..9b50cc04 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -224,6 +224,7 @@ import { ConfiguratorDialogCloudComponent } from './components/project-map/node- import { UdpTunnelsComponent } from './components/preferences/common/udp-tunnels/udp-tunnels.component'; import { ConfiguratorDialogAtmSwitchComponent } from './components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component'; import { ConfiguratorDialogVmwareComponent } from './components/project-map/node-editors/configurator/vmware/configurator-vmware.component'; +import { ConfiguratorDialogIouComponent } from './components/project-map/node-editors/configurator/iou/configurator-iou.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -375,7 +376,8 @@ if (environment.production) { ConfiguratorDialogCloudComponent, UdpTunnelsComponent, ConfiguratorDialogAtmSwitchComponent, - ConfiguratorDialogVmwareComponent + ConfiguratorDialogVmwareComponent, + ConfiguratorDialogIouComponent ], imports: [ BrowserModule, @@ -484,7 +486,8 @@ if (environment.production) { ConfiguratorDialogQemuComponent, ConfiguratorDialogCloudComponent, ConfiguratorDialogAtmSwitchComponent, - ConfiguratorDialogVmwareComponent + ConfiguratorDialogVmwareComponent, + ConfiguratorDialogIouComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index b875d9fb..f82d50b0 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -16,6 +16,7 @@ export class Properties { linked_clone: boolean; on_close: string; ram: number; + nvram: number; usage: string; use_any_adapter: boolean; vmname: string; @@ -61,6 +62,8 @@ export class Node { console_host: string; console_type: string; custom_adapters?: CustomAdapter[]; + ethernet_adapters?: any; + serial_adapters?: any; first_port_name: string; height: number; label: Label; diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index 53621f68..ee7c36ee 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -11,6 +11,7 @@ import { ConfiguratorDialogQemuComponent } from '../../../node-editors/configura import { ConfiguratorDialogCloudComponent } from '../../../node-editors/configurator/cloud/configurator-cloud.component'; import { ConfiguratorDialogAtmSwitchComponent } from '../../../node-editors/configurator/atm_switch/configurator-atm-switch.component'; import { ConfiguratorDialogVmwareComponent } from '../../../node-editors/configurator/vmware/configurator-vmware.component'; +import { ConfiguratorDialogIouComponent } from '../../../node-editors/configurator/iou/configurator-iou.component'; @Component({ @@ -40,7 +41,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'dynamips') { } else if (this.node.node_type === 'iou') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogIouComponent, this.conf); } else if (this.node.node_type === 'qemu') { this.dialogRef = this.dialog.open(ConfiguratorDialogQemuComponent, this.conf); } else if (this.node.node_type === 'virtualbox') { diff --git 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 new file mode 100644 index 00000000..5f44167e --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.html @@ -0,0 +1,57 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + +
+ + + +
+ + + + {{type}} + + + + + Auto start console +
+ + + + + + + + + +
+ + + + + + +
+ + + + + + + + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.ts b/src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.ts new file mode 100644 index 00000000..5f0421c0 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/iou/configurator-iou.component.ts @@ -0,0 +1,67 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { IouConfigurationService } from '../../../../../services/iou-configuration.service'; + + +@Component({ + selector: 'app-configurator-iou', + templateUrl: './configurator-iou.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogIouComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + networkForm: FormGroup; + consoleTypes: string[] = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private configurationService: IouConfigurationService + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + + this.networkForm = this.formBuilder.group({ + ethernetAdapters: new FormControl('', Validators.required), + serialAdapters: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + this.getConfiguration(); + }); + } + + getConfiguration() { + this.consoleTypes = this.configurationService.getConsoleTypes(); + } + + onSaveClick() { + if (this.generalSettingsForm.valid && this.networkForm.valid) { + this.nodeService. updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 125706dd7b290207c6504f768774e97315d41047 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Tue, 17 Sep 2019 06:27:34 -0700 Subject: [PATCH 24/30] Dialog for IOS added --- src/app/app.module.ts | 7 +- .../config-action/config-action.component.ts | 3 +- .../ios/configurator-ios.component.html | 51 ++++++++++++++ .../ios/configurator-ios.component.ts | 67 +++++++++++++++++++ src/app/services/node.service.ts | 1 + 5 files changed, 126 insertions(+), 3 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 9b50cc04..278f396f 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -225,6 +225,7 @@ import { UdpTunnelsComponent } from './components/preferences/common/udp-tunnels import { ConfiguratorDialogAtmSwitchComponent } from './components/project-map/node-editors/configurator/atm_switch/configurator-atm-switch.component'; import { ConfiguratorDialogVmwareComponent } from './components/project-map/node-editors/configurator/vmware/configurator-vmware.component'; import { ConfiguratorDialogIouComponent } from './components/project-map/node-editors/configurator/iou/configurator-iou.component'; +import { ConfiguratorDialogIosComponent } from './components/project-map/node-editors/configurator/ios/configurator-ios.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -377,7 +378,8 @@ if (environment.production) { UdpTunnelsComponent, ConfiguratorDialogAtmSwitchComponent, ConfiguratorDialogVmwareComponent, - ConfiguratorDialogIouComponent + ConfiguratorDialogIouComponent, + ConfiguratorDialogIosComponent ], imports: [ BrowserModule, @@ -487,7 +489,8 @@ if (environment.production) { ConfiguratorDialogCloudComponent, ConfiguratorDialogAtmSwitchComponent, ConfiguratorDialogVmwareComponent, - ConfiguratorDialogIouComponent + ConfiguratorDialogIouComponent, + ConfiguratorDialogIosComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index ee7c36ee..5168a8c6 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -12,6 +12,7 @@ import { ConfiguratorDialogCloudComponent } from '../../../node-editors/configur import { ConfiguratorDialogAtmSwitchComponent } from '../../../node-editors/configurator/atm_switch/configurator-atm-switch.component'; import { ConfiguratorDialogVmwareComponent } from '../../../node-editors/configurator/vmware/configurator-vmware.component'; import { ConfiguratorDialogIouComponent } from '../../../node-editors/configurator/iou/configurator-iou.component'; +import { ConfiguratorDialogIosComponent } from '../../../node-editors/configurator/ios/configurator-ios.component'; @Component({ @@ -39,7 +40,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'cloud') { this.dialogRef = this.dialog.open(ConfiguratorDialogCloudComponent, this.conf); } else if (this.node.node_type === 'dynamips') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogIosComponent, this.conf); } else if (this.node.node_type === 'iou') { this.dialogRef = this.dialog.open(ConfiguratorDialogIouComponent, this.conf); } else if (this.node.node_type === 'qemu') { diff --git a/src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.html b/src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.html new file mode 100644 index 00000000..089da3c8 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.html @@ -0,0 +1,51 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + +
+ + + +
+ + + + {{type}} + + + + + Auto start console +
+ + + +
+ + + + + + +
+ + + + + + + + + +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.ts b/src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.ts new file mode 100644 index 00000000..4af94677 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/ios/configurator-ios.component.ts @@ -0,0 +1,67 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { IosConfigurationService } from '../../../../../services/ios-configuration.service'; + + +@Component({ + selector: 'app-configurator-ios', + templateUrl: './configurator-ios.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogIosComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + memoryForm: FormGroup; + consoleTypes: string[] = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private configurationService: IosConfigurationService + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + + this.memoryForm = this.formBuilder.group({ + ram: new FormControl('', Validators.required), + nvram: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + this.getConfiguration(); + }); + } + + getConfiguration() { + this.consoleTypes = this.configurationService.getConsoleTypes(); + } + + onSaveClick() { + if (this.generalSettingsForm.valid && this.memoryForm.valid) { + this.nodeService. updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} diff --git a/src/app/services/node.service.ts b/src/app/services/node.service.ts index d07c19d6..950f0bcd 100644 --- a/src/app/services/node.service.ts +++ b/src/app/services/node.service.ts @@ -89,6 +89,7 @@ export class NodeService { updateNode(server: Server, node: Node): Observable { return this.httpServer.put(server, `/projects/${node.project_id}/nodes/${node.node_id}`, { console_type: node.console_type, + console_auto_start: node.console_auto_start, name: node.name, properties: node.properties }); From c8a2067847c9dae90674c5b979fafe543eea57be Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 18 Sep 2019 01:07:24 -0700 Subject: [PATCH 25/30] Configurator for docker added --- src/app/app.module.ts | 7 ++- src/app/cartography/models/node.ts | 2 + .../config-action/config-action.component.ts | 3 +- .../docker/configurator-docker.component.html | 54 ++++++++++++++++ .../docker/configurator-docker.component.ts | 63 +++++++++++++++++++ 5 files changed, 126 insertions(+), 3 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 278f396f..8e14f3e2 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -226,6 +226,7 @@ import { ConfiguratorDialogAtmSwitchComponent } from './components/project-map/n import { ConfiguratorDialogVmwareComponent } from './components/project-map/node-editors/configurator/vmware/configurator-vmware.component'; import { ConfiguratorDialogIouComponent } from './components/project-map/node-editors/configurator/iou/configurator-iou.component'; import { ConfiguratorDialogIosComponent } from './components/project-map/node-editors/configurator/ios/configurator-ios.component'; +import { ConfiguratorDialogDockerComponent } from './components/project-map/node-editors/configurator/docker/configurator-docker.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -379,7 +380,8 @@ if (environment.production) { ConfiguratorDialogAtmSwitchComponent, ConfiguratorDialogVmwareComponent, ConfiguratorDialogIouComponent, - ConfiguratorDialogIosComponent + ConfiguratorDialogIosComponent, + ConfiguratorDialogDockerComponent ], imports: [ BrowserModule, @@ -490,7 +492,8 @@ if (environment.production) { ConfiguratorDialogAtmSwitchComponent, ConfiguratorDialogVmwareComponent, ConfiguratorDialogIouComponent, - ConfiguratorDialogIosComponent + ConfiguratorDialogIosComponent, + ConfiguratorDialogDockerComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/cartography/models/node.ts b/src/app/cartography/models/node.ts index f82d50b0..86d0fa33 100644 --- a/src/app/cartography/models/node.ts +++ b/src/app/cartography/models/node.ts @@ -52,6 +52,8 @@ export class Properties { platform: string; process_priority: string; qemu_path: string; + environment: string; + extra_hosts: string; } export class Node { diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index 5168a8c6..ae039104 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -13,6 +13,7 @@ import { ConfiguratorDialogAtmSwitchComponent } from '../../../node-editors/conf import { ConfiguratorDialogVmwareComponent } from '../../../node-editors/configurator/vmware/configurator-vmware.component'; import { ConfiguratorDialogIouComponent } from '../../../node-editors/configurator/iou/configurator-iou.component'; import { ConfiguratorDialogIosComponent } from '../../../node-editors/configurator/ios/configurator-ios.component'; +import { ConfiguratorDialogDockerComponent } from '../../../node-editors/configurator/docker/configurator-docker.component'; @Component({ @@ -50,7 +51,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'vmware') { this.dialogRef = this.dialog.open(ConfiguratorDialogVmwareComponent, this.conf); } else if (this.node.node_type === 'docker') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogDockerComponent, this.conf); } else if (this.node.node_type === 'nat') { } else if (this.node.node_type === 'frame_relay_switch') { diff --git 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 new file mode 100644 index 00000000..296cee21 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.html @@ -0,0 +1,54 @@ +

Configurator for node {{name}}

+ +
+
+
+ + + +
+ + + + + + + + + + {{type}} + + + + + Auto start console + +
+
Environment
+ + + + + + +
Extra hosts
+ + + + + + + + + + + + +
+
+
+ +
+ + +
diff --git 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 new file mode 100644 index 00000000..07f25d73 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.ts @@ -0,0 +1,63 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { DockerConfigurationService } from '../../../../../services/docker-configuration.service'; + + +@Component({ + selector: 'app-configurator-docker', + templateUrl: './configurator-docker.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogDockerComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + consoleTypes: string[] = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private dockerConfigurationService: DockerConfigurationService + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required), + adapter: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + this.getConfiguration(); + }) + } + + getConfiguration() { + this.consoleTypes = this.dockerConfigurationService.getConsoleTypes(); + + } + + onSaveClick() { + if (this.generalSettingsForm.valid) { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 02fc46567b3c32e08142805981a14f2dace56118 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 18 Sep 2019 01:47:24 -0700 Subject: [PATCH 26/30] Configurator for nat added --- src/app/app.module.ts | 7 ++- .../config-action/config-action.component.ts | 3 +- .../nat/configurator-nat.component.html | 24 +++++++++ .../nat/configurator-nat.component.ts | 54 +++++++++++++++++++ 4 files changed, 85 insertions(+), 3 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 8e14f3e2..666b1326 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -227,6 +227,7 @@ import { ConfiguratorDialogVmwareComponent } from './components/project-map/node import { ConfiguratorDialogIouComponent } from './components/project-map/node-editors/configurator/iou/configurator-iou.component'; import { ConfiguratorDialogIosComponent } from './components/project-map/node-editors/configurator/ios/configurator-ios.component'; import { ConfiguratorDialogDockerComponent } from './components/project-map/node-editors/configurator/docker/configurator-docker.component'; +import { ConfiguratorDialogNatComponent } from './components/project-map/node-editors/configurator/nat/configurator-nat.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -381,7 +382,8 @@ if (environment.production) { ConfiguratorDialogVmwareComponent, ConfiguratorDialogIouComponent, ConfiguratorDialogIosComponent, - ConfiguratorDialogDockerComponent + ConfiguratorDialogDockerComponent, + ConfiguratorDialogNatComponent ], imports: [ BrowserModule, @@ -493,7 +495,8 @@ if (environment.production) { ConfiguratorDialogVmwareComponent, ConfiguratorDialogIouComponent, ConfiguratorDialogIosComponent, - ConfiguratorDialogDockerComponent + ConfiguratorDialogDockerComponent, + ConfiguratorDialogNatComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index ae039104..faf6f7dc 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -14,6 +14,7 @@ import { ConfiguratorDialogVmwareComponent } from '../../../node-editors/configu import { ConfiguratorDialogIouComponent } from '../../../node-editors/configurator/iou/configurator-iou.component'; import { ConfiguratorDialogIosComponent } from '../../../node-editors/configurator/ios/configurator-ios.component'; import { ConfiguratorDialogDockerComponent } from '../../../node-editors/configurator/docker/configurator-docker.component'; +import { ConfiguratorDialogNatComponent } from '../../../node-editors/configurator/nat/configurator-nat.component'; @Component({ @@ -53,7 +54,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'docker') { this.dialogRef = this.dialog.open(ConfiguratorDialogDockerComponent, this.conf); } else if (this.node.node_type === 'nat') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogNatComponent, this.conf); } else if (this.node.node_type === 'frame_relay_switch') { this.dialogRef = this.dialog.open(ConfiguratorDialogSwitchComponent, this.conf); } else if (this.node.node_type === 'atm_switch') { diff --git a/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.html b/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.html new file mode 100644 index 00000000..ff1164d0 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.html @@ -0,0 +1,24 @@ +

Configurator for node {{name}}

+ +
+
+
+ +
+ + + +
+ +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts b/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts new file mode 100644 index 00000000..55918146 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts @@ -0,0 +1,54 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; + + +@Component({ + selector: 'app-configurator-nat', + templateUrl: './configurator-nat.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogNatComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + consoleTypes: string[] = []; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + }) + } + + onSaveClick() { + if (this.generalSettingsForm.valid) { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 5ec9e0134add1630472f7615cd11c707ce9b8935 Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 18 Sep 2019 03:00:53 -0700 Subject: [PATCH 27/30] Configurator for traceng added --- src/app/app.module.ts | 7 ++- .../config-action/config-action.component.ts | 3 +- .../nat/configurator-nat.component.ts | 1 - .../configurator-traceng.component.html | 24 +++++++++ .../traceng/configurator-traceng.component.ts | 53 +++++++++++++++++++ 5 files changed, 84 insertions(+), 4 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 666b1326..8aca20e1 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -228,6 +228,7 @@ import { ConfiguratorDialogIouComponent } from './components/project-map/node-ed import { ConfiguratorDialogIosComponent } from './components/project-map/node-editors/configurator/ios/configurator-ios.component'; import { ConfiguratorDialogDockerComponent } from './components/project-map/node-editors/configurator/docker/configurator-docker.component'; import { ConfiguratorDialogNatComponent } from './components/project-map/node-editors/configurator/nat/configurator-nat.component'; +import { ConfiguratorDialogTracengComponent } from './components/project-map/node-editors/configurator/traceng/configurator-traceng.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -383,7 +384,8 @@ if (environment.production) { ConfiguratorDialogIouComponent, ConfiguratorDialogIosComponent, ConfiguratorDialogDockerComponent, - ConfiguratorDialogNatComponent + ConfiguratorDialogNatComponent, + ConfiguratorDialogTracengComponent ], imports: [ BrowserModule, @@ -496,7 +498,8 @@ if (environment.production) { ConfiguratorDialogIouComponent, ConfiguratorDialogIosComponent, ConfiguratorDialogDockerComponent, - ConfiguratorDialogNatComponent + ConfiguratorDialogNatComponent, + ConfiguratorDialogTracengComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts index faf6f7dc..f732f445 100644 --- a/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts +++ b/src/app/components/project-map/context-menu/actions/config-action/config-action.component.ts @@ -15,6 +15,7 @@ import { ConfiguratorDialogIouComponent } from '../../../node-editors/configurat import { ConfiguratorDialogIosComponent } from '../../../node-editors/configurator/ios/configurator-ios.component'; import { ConfiguratorDialogDockerComponent } from '../../../node-editors/configurator/docker/configurator-docker.component'; import { ConfiguratorDialogNatComponent } from '../../../node-editors/configurator/nat/configurator-nat.component'; +import { ConfiguratorDialogTracengComponent } from '../../../node-editors/configurator/traceng/configurator-traceng.component'; @Component({ @@ -60,7 +61,7 @@ export class ConfigActionComponent { } else if (this.node.node_type === 'atm_switch') { this.dialogRef = this.dialog.open(ConfiguratorDialogAtmSwitchComponent, this.conf); } else if (this.node.node_type === 'traceng') { - + this.dialogRef = this.dialog.open(ConfiguratorDialogTracengComponent, this.conf); } let instance = this.dialogRef.componentInstance; diff --git a/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts b/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts index 55918146..ea7b2ed7 100644 --- a/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts +++ b/src/app/components/project-map/node-editors/configurator/nat/configurator-nat.component.ts @@ -17,7 +17,6 @@ export class ConfiguratorDialogNatComponent implements OnInit { node: Node; name: string; generalSettingsForm: FormGroup; - consoleTypes: string[] = []; constructor( public dialogRef: MatDialogRef, diff --git a/src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.html b/src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.html new file mode 100644 index 00000000..ff1164d0 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.html @@ -0,0 +1,24 @@ +

Configurator for node {{name}}

+ +
+
+
+ +
+ + + +
+ +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.ts b/src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.ts new file mode 100644 index 00000000..47811847 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/traceng/configurator-traceng.component.ts @@ -0,0 +1,53 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Node } from '../../../../../cartography/models/node'; +import { Server } from '../../../../../models/server'; +import { NodeService } from '../../../../../services/node.service'; +import { ToasterService } from '../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; + + +@Component({ + selector: 'app-configurator-traceng', + templateUrl: './configurator-traceng.component.html', + styleUrls: ['../configurator.component.scss'] +}) +export class ConfiguratorDialogTracengComponent implements OnInit { + server: Server; + node: Node; + name: string; + generalSettingsForm: FormGroup; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder + ) { + this.generalSettingsForm = this.formBuilder.group({ + name: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.nodeService.getNode(this.server, this.node).subscribe((node: Node) => { + this.node = node; + this.name = node.name; + }) + } + + onSaveClick() { + if (this.generalSettingsForm.valid) { + this.nodeService.updateNode(this.server, this.node).subscribe(() => { + this.toasterService.success(`Node ${this.node.name} updated.`); + this.onCancelClick(); + }); + } else { + this.toasterService.error(`Fill all required fields.`); + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} From 074b1d840e9da0187065631f0880785d628bee2c Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Wed, 18 Sep 2019 05:37:51 -0700 Subject: [PATCH 28/30] Support for managing traceng templates added --- src/app/app-routing.module.ts | 9 +++ src/app/app.module.ts | 14 +++- .../preferences/preferences.component.html | 3 + .../add-traceng-template.component.html | 23 ++++++ .../add-traceng-template.component.scss | 0 .../add-traceng-template.component.ts | 67 +++++++++++++++++ .../traceng-preferences.component.html | 12 ++++ .../traceng-preferences.component.scss | 3 + .../traceng-preferences.component.ts | 32 +++++++++ .../traceng-template-details.component.html | 40 +++++++++++ .../traceng-template-details.component.scss | 0 .../traceng-template-details.component.ts | 71 +++++++++++++++++++ .../traceng-templates.component.html | 32 +++++++++ .../traceng-templates.component.scss | 0 .../traceng-templates.component.ts | 46 ++++++++++++ src/app/models/templates/traceng-template.ts | 12 ++++ src/app/services/template-mocks.service.ts | 18 +++++ src/app/services/traceng.service.spec.ts | 0 src/app/services/traceng.service.ts | 27 +++++++ 19 files changed, 407 insertions(+), 2 deletions(-) create mode 100644 src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.html create mode 100644 src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.scss create mode 100644 src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.ts create mode 100644 src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.html create mode 100644 src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.scss create mode 100644 src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.ts create mode 100644 src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.html create mode 100644 src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.scss create mode 100644 src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.ts create mode 100644 src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.html create mode 100644 src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.scss create mode 100644 src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.ts create mode 100644 src/app/models/templates/traceng-template.ts create mode 100644 src/app/services/traceng.service.spec.ts create mode 100644 src/app/services/traceng.service.ts diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 25db77e8..1dcf6b05 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -53,6 +53,10 @@ import { CopyIouTemplateComponent } from './components/preferences/ios-on-unix/c import { ListOfSnapshotsComponent } from './components/snapshots/list-of-snapshots/list-of-snapshots.component'; import { ConsoleComponent } from './components/settings/console/console.component'; import { HelpComponent } from './components/help/help.component'; +import { TracengPreferencesComponent } from './components/preferences/traceng/traceng-preferences/traceng-preferences.component'; +import { TracengTemplatesComponent } from './components/preferences/traceng/traceng-templates/traceng-templates.component'; +import { AddTracengTemplateComponent } from './components/preferences/traceng/add-traceng/add-traceng-template.component'; +import { TracengTemplateDetailsComponent } from './components/preferences/traceng/traceng-template-details/traceng-template-details.component'; const routes: Routes = [ { @@ -111,6 +115,11 @@ const routes: Routes = [ { path: 'server/:server_id/preferences/vmware/templates/:template_id', component: VmwareTemplateDetailsComponent }, { path: 'server/:server_id/preferences/vmware/addtemplate', component: AddVmwareTemplateComponent }, + // { path: 'server/:server_id/preferences/traceng', component: TracengPreferencesComponent }, + // { path: 'server/:server_id/preferences/traceng/templates', component: TracengTemplatesComponent }, + // { path: 'server/:server_id/preferences/traceng/templates/:template_id', component: TracengTemplateDetailsComponent }, + // { path: 'server/:server_id/preferences/traceng/addtemplate', component: AddTracengTemplateComponent }, + { path: 'server/:server_id/preferences/docker/templates', component: DockerTemplatesComponent }, { path: 'server/:server_id/preferences/docker/templates/:template_id', component: DockerTemplateDetailsComponent }, { path: 'server/:server_id/preferences/docker/templates/:template_id/copy', component: CopyDockerTemplateComponent }, diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 8aca20e1..5ce47b8e 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -229,6 +229,11 @@ import { ConfiguratorDialogIosComponent } from './components/project-map/node-ed import { ConfiguratorDialogDockerComponent } from './components/project-map/node-editors/configurator/docker/configurator-docker.component'; import { ConfiguratorDialogNatComponent } from './components/project-map/node-editors/configurator/nat/configurator-nat.component'; import { ConfiguratorDialogTracengComponent } from './components/project-map/node-editors/configurator/traceng/configurator-traceng.component'; +import { AddTracengTemplateComponent } from './components/preferences/traceng/add-traceng/add-traceng-template.component'; +import { TracengPreferencesComponent } from './components/preferences/traceng/traceng-preferences/traceng-preferences.component'; +import { TracengTemplatesComponent } from './components/preferences/traceng/traceng-templates/traceng-templates.component'; +import { TracengService } from './services/traceng.service'; +import { TracengTemplateDetailsComponent } from './components/preferences/traceng/traceng-template-details/traceng-template-details.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -385,7 +390,11 @@ if (environment.production) { ConfiguratorDialogIosComponent, ConfiguratorDialogDockerComponent, ConfiguratorDialogNatComponent, - ConfiguratorDialogTracengComponent + ConfiguratorDialogTracengComponent, + AddTracengTemplateComponent, + TracengPreferencesComponent, + TracengTemplatesComponent, + TracengTemplateDetailsComponent ], imports: [ BrowserModule, @@ -464,7 +473,8 @@ if (environment.production) { RotationValidator, MapSettingsService, InfoService, - ComputeService + ComputeService, + TracengService ], entryComponents: [ AddServerDialogComponent, diff --git a/src/app/components/preferences/preferences.component.html b/src/app/components/preferences/preferences.component.html index 7a23d808..3f4246a7 100644 --- a/src/app/components/preferences/preferences.component.html +++ b/src/app/components/preferences/preferences.component.html @@ -31,6 +31,9 @@ Docker +
diff --git a/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.html b/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.html new file mode 100644 index 00000000..96359baa --- /dev/null +++ b/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.html @@ -0,0 +1,23 @@ +
+
+
+

New VPCS node template

+
+
+
+ +
+ + + + + + +
+ +
+ + +
+
+
diff --git a/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.scss b/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.ts b/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.ts new file mode 100644 index 00000000..70fd2a10 --- /dev/null +++ b/src/app/components/preferences/traceng/add-traceng/add-traceng-template.component.ts @@ -0,0 +1,67 @@ +import { Component, OnInit } from "@angular/core"; +import { Server } from '../../../../models/server'; +import { ActivatedRoute, Router } from '@angular/router'; +import { ServerService } from '../../../../services/server.service'; +import { ToasterService } from '../../../../services/toaster.service'; +import { v4 as uuid } from 'uuid'; +import { TemplateMocksService } from '../../../../services/template-mocks.service'; +import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms'; +import { TracengService } from '../../../../services/traceng.service'; +import { TracengTemplate } from '../../../../models/templates/traceng-template'; + + +@Component({ + selector: 'app-add-traceng-template', + templateUrl: './add-traceng-template.component.html', + styleUrls: ['./add-traceng-template.component.scss', '../../preferences.component.scss'] +}) +export class AddTracengTemplateComponent implements OnInit { + server: Server; + templateName: string = ''; + ipAddress: string = ''; + templateNameForm: FormGroup + + constructor( + private route: ActivatedRoute, + private serverService: ServerService, + private tracengService: TracengService, + private router: Router, + private toasterService: ToasterService, + private templateMocksService: TemplateMocksService, + private formBuilder: FormBuilder + ) { + this.templateNameForm = this.formBuilder.group({ + templateName: new FormControl(null, [Validators.required]), + ipAddress: new FormControl(null, [Validators.required]) + }); + } + + ngOnInit() { + const server_id = this.route.snapshot.paramMap.get("server_id"); + this.serverService.get(parseInt(server_id, 10)).then((server: Server) => { + this.server = server; + }); + } + + goBack() { + this.router.navigate(['/server', this.server.id, 'preferences', 'traceng', 'templates']); + } + + addTemplate() { + if (!this.templateNameForm.invalid) { + this.templateName = this.templateNameForm.get('templateName').value; + this.ipAddress = this.templateNameForm.get('ipAddress').value; + let tracengTemplate: TracengTemplate = this.templateMocksService.getTracengTemplate(); + + tracengTemplate.template_id = uuid(); + tracengTemplate.name = this.templateName; + tracengTemplate.ip_address = this.ipAddress; + + this.tracengService.addTemplate(this.server, tracengTemplate).subscribe(() => { + this.goBack(); + }); + } else { + this.toasterService.error(`Fill all required fields`); + } + } +} diff --git a/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.html b/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.html new file mode 100644 index 00000000..4e94dbb2 --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.html @@ -0,0 +1,12 @@ +
+
+
+

TraceNG preferences

+
+
+
+ + + +
+
diff --git a/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.scss b/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.scss new file mode 100644 index 00000000..9c2173c2 --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.scss @@ -0,0 +1,3 @@ +.form-field { + width: 100%; +} diff --git a/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.ts b/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.ts new file mode 100644 index 00000000..a698d8af --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-preferences/traceng-preferences.component.ts @@ -0,0 +1,32 @@ +import { Component, OnInit } from "@angular/core"; +import { ActivatedRoute } from '@angular/router'; +import { Server } from '../../../../models/server'; +import { ServerService } from '../../../../services/server.service'; + + +@Component({ + selector: 'app-traceng-preferences', + templateUrl: './traceng-preferences.component.html', + styleUrls: ['./traceng-preferences.component.scss'] +}) +export class TracengPreferencesComponent implements OnInit { + server: Server; + tracengExecutable: string; + + constructor( + private route: ActivatedRoute, + private serverService: ServerService + ) {} + + ngOnInit() { + const server_id = this.route.snapshot.paramMap.get("server_id"); + + this.serverService.get(parseInt(server_id, 10)).then((server: Server) => { + this.server = server; + }); + } + + restoreDefaults(){ + this.tracengExecutable = ''; + } +} diff --git a/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.html b/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.html new file mode 100644 index 00000000..01e1acdc --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.html @@ -0,0 +1,40 @@ +
+
+
+

TraceNG device configuration

+
+
+
+ +
+ + + + + + + + + +

+
+ +
+ + +
+
+
+ diff --git a/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.scss b/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.ts b/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.ts new file mode 100644 index 00000000..3042bfce --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-template-details/traceng-template-details.component.ts @@ -0,0 +1,71 @@ +import { Component, OnInit } from "@angular/core"; +import { ActivatedRoute, Router } from '@angular/router'; +import { ServerService } from '../../../../services/server.service'; +import { Server } from '../../../../models/server'; +import { ToasterService } from '../../../../services/toaster.service'; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { TracengService } from '../../../../services/traceng.service'; +import { TracengTemplate } from '../../../../models/templates/traceng-template'; + + +@Component({ + selector: 'app-traceng-template-details', + templateUrl: './traceng-template-details.component.html', + styleUrls: ['./traceng-template-details.component.scss', '../../preferences.component.scss'] +}) +export class TracengTemplateDetailsComponent implements OnInit { + server: Server; + tracengTemplate: TracengTemplate; + inputForm: FormGroup; + isSymbolSelectionOpened: boolean = false; + + constructor( + private route: ActivatedRoute, + private serverService: ServerService, + private tracengService: TracengService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private router: Router + ) { + this.inputForm = this.formBuilder.group({ + templateName: new FormControl('', Validators.required), + defaultName: new FormControl('', Validators.required), + symbol: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + const server_id = this.route.snapshot.paramMap.get("server_id"); + const template_id = this.route.snapshot.paramMap.get("template_id"); + this.serverService.get(parseInt(server_id, 10)).then((server: Server) => { + this.server = server; + + this.tracengService.getTemplate(this.server, template_id).subscribe((tracengTemplate: TracengTemplate) => { + this.tracengTemplate = tracengTemplate; + }); + }); + } + + goBack() { + this.router.navigate(['/server', this.server.id, 'preferences', 'traceng', 'templates']); + } + + onSave() { + if (this.inputForm.invalid) { + this.toasterService.error(`Fill all required fields`); + } else { + this.tracengService.saveTemplate(this.server, this.tracengTemplate).subscribe((tracengTemplate: TracengTemplate) => { + this.toasterService.success("Changes saved"); + }); + } + } + + chooseSymbol() { + this.isSymbolSelectionOpened = !this.isSymbolSelectionOpened; + } + + symbolChanged(chosenSymbol: string) { + this.isSymbolSelectionOpened = !this.isSymbolSelectionOpened; + this.tracengTemplate.symbol = chosenSymbol; + } +} diff --git a/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.html b/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.html new file mode 100644 index 00000000..af922d9f --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.html @@ -0,0 +1,32 @@ +
+
+
+

TraceNG node templates

+ + +
+
+ +
+
+ +
+ {{template.name}} + + + + +
+ +
+
+
+ + diff --git a/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.scss b/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.ts b/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.ts new file mode 100644 index 00000000..b640193c --- /dev/null +++ b/src/app/components/preferences/traceng/traceng-templates/traceng-templates.component.ts @@ -0,0 +1,46 @@ +import { Component, OnInit, ViewChild } from "@angular/core"; +import { Server } from '../../../../models/server'; +import { ActivatedRoute } from '@angular/router'; +import { ServerService } from '../../../../services/server.service'; +import { DeleteTemplateComponent } from '../../common/delete-template-component/delete-template.component'; +import { TracengTemplate } from '../../../../models/templates/traceng-template'; +import { TracengService } from '../../../../services/traceng.service'; + +@Component({ + selector: 'app-traceng-templates', + templateUrl: './traceng-templates.component.html', + styleUrls: ['./traceng-templates.component.scss', '../../preferences.component.scss'] +}) +export class TracengTemplatesComponent implements OnInit { + server: Server; + tracengTemplates: TracengTemplate[] = []; + @ViewChild(DeleteTemplateComponent, {static: false}) deleteComponent: DeleteTemplateComponent; + + constructor( + private route: ActivatedRoute, + private serverService: ServerService, + private tracengService: TracengService + ) {} + + ngOnInit() { + const server_id = this.route.snapshot.paramMap.get("server_id"); + this.serverService.get(parseInt(server_id, 10)).then((server: Server) => { + this.server = server; + this.getTemplates(); + }); + } + + getTemplates() { + this.tracengService.getTemplates(this.server).subscribe((tracengTemplates: TracengTemplate[]) => { + this.tracengTemplates = tracengTemplates.filter((elem) => elem.template_type === 'traceng' && !elem.builtin); + }); + } + + deleteTemplate(template: TracengTemplate) { + this.deleteComponent.deleteItem(template.name, template.template_id); + } + + onDeleteEvent() { + this.getTemplates(); + } +} diff --git a/src/app/models/templates/traceng-template.ts b/src/app/models/templates/traceng-template.ts new file mode 100644 index 00000000..00eeb3c6 --- /dev/null +++ b/src/app/models/templates/traceng-template.ts @@ -0,0 +1,12 @@ +export interface TracengTemplate { + builtin: boolean; + category: string; + compute_id: string; + console_type: string; + default_name_format: string; + ip_address: string; + name: string; + symbol: string; + template_id: string; + template_type: string; +} diff --git a/src/app/services/template-mocks.service.ts b/src/app/services/template-mocks.service.ts index c61a0c02..e746ef0f 100644 --- a/src/app/services/template-mocks.service.ts +++ b/src/app/services/template-mocks.service.ts @@ -11,9 +11,27 @@ import { VmwareTemplate } from '../models/templates/vmware-template'; import { DockerTemplate } from '../models/templates/docker-template'; import { CustomAdapter } from '../models/qemu/qemu-custom-adapter'; import { IouTemplate } from '../models/templates/iou-template'; +import { TracengTemplate } from '../models/templates/traceng-template'; @Injectable() export class TemplateMocksService { + getTracengTemplate() : TracengTemplate { + let template: TracengTemplate = { + builtin: false, + category: 'guest', + compute_id: 'local', + console_type: 'none', + default_name_format: 'TraceNG{0}', + ip_address: '', + name: '', + symbol: ':/symbols/classic/traceng.svg', + template_id: '', + template_type: 'traceng' + }; + + return template; + } + getQemuTemplate() : Observable { let template : QemuTemplate = { adapter_type: 'e1000', diff --git a/src/app/services/traceng.service.spec.ts b/src/app/services/traceng.service.spec.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/app/services/traceng.service.ts b/src/app/services/traceng.service.ts new file mode 100644 index 00000000..2c33f12e --- /dev/null +++ b/src/app/services/traceng.service.ts @@ -0,0 +1,27 @@ +import { Injectable } from "@angular/core"; +import { HttpServer } from './http-server.service'; +import { Server } from '../models/server'; +import { Observable } from 'rxjs'; +import { HttpHeaders } from '@angular/common/http'; +import { TracengTemplate } from '../models/templates/traceng-template'; + +@Injectable() +export class TracengService { + constructor(private httpServer: HttpServer) {} + + getTemplates(server: Server): Observable { + return this.httpServer.get(server, '/templates') as Observable; + } + + getTemplate(server: Server, template_id: string): Observable { + return this.httpServer.get(server, `/templates/${template_id}`) as Observable; + } + + addTemplate(server: Server, vpcsTemplate: TracengTemplate): Observable { + return this.httpServer.post(server, `/templates`, vpcsTemplate) as Observable; + } + + saveTemplate(server: Server, vpcsTemplate: TracengTemplate): Observable { + return this.httpServer.put(server, `/templates/${vpcsTemplate.template_id}`, vpcsTemplate) as Observable; + } +} From 041b9bc27155ad1bd57b62f777b2185e363a04ce Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Thu, 19 Sep 2019 08:30:48 -0700 Subject: [PATCH 29/30] Qemu image configurator added --- src/app/app.module.ts | 7 +- .../configurator/configurator.component.scss | 4 + .../qemu/configurator-qemu.component.html | 2 + .../qemu/configurator-qemu.component.ts | 16 ++- .../qemu-image-creator.component.html | 107 ++++++++++++++++ .../qemu-image-creator.component.ts | 121 ++++++++++++++++++ src/app/models/qemu/qemu-img.ts | 12 ++ src/app/services/qemu.service.ts | 5 + 8 files changed, 271 insertions(+), 3 deletions(-) create mode 100644 src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.html create mode 100644 src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.ts create mode 100644 src/app/models/qemu/qemu-img.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 5ce47b8e..c40c48ad 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -234,6 +234,7 @@ import { TracengPreferencesComponent } from './components/preferences/traceng/tr import { TracengTemplatesComponent } from './components/preferences/traceng/traceng-templates/traceng-templates.component'; import { TracengService } from './services/traceng.service'; import { TracengTemplateDetailsComponent } from './components/preferences/traceng/traceng-template-details/traceng-template-details.component'; +import { QemuImageCreatorComponent } from './components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component'; if (environment.production) { Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', { @@ -394,7 +395,8 @@ if (environment.production) { AddTracengTemplateComponent, TracengPreferencesComponent, TracengTemplatesComponent, - TracengTemplateDetailsComponent + TracengTemplateDetailsComponent, + QemuImageCreatorComponent ], imports: [ BrowserModule, @@ -509,7 +511,8 @@ if (environment.production) { ConfiguratorDialogIosComponent, ConfiguratorDialogDockerComponent, ConfiguratorDialogNatComponent, - ConfiguratorDialogTracengComponent + ConfiguratorDialogTracengComponent, + QemuImageCreatorComponent ], bootstrap: [AppComponent] }) diff --git a/src/app/components/project-map/node-editors/configurator/configurator.component.scss b/src/app/components/project-map/node-editors/configurator/configurator.component.scss index e4e49d62..a7d34f67 100644 --- a/src/app/components/project-map/node-editors/configurator/configurator.component.scss +++ b/src/app/components/project-map/node-editors/configurator/configurator.component.scss @@ -30,6 +30,10 @@ display: none; } +mat-radio-button { + margin-right: 10px; +} + ::-webkit-scrollbar { width: 0.5em; } diff --git 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 index 89236308..2be7c35d 100644 --- 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 @@ -51,6 +51,8 @@
+ + HDA (Primary Master) diff --git a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts index 8367c196..36be884a 100644 --- a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts +++ b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts @@ -4,11 +4,12 @@ import { Node } from '../../../../../cartography/models/node'; import { Server } from '../../../../../models/server'; import { NodeService } from '../../../../../services/node.service'; import { ToasterService } from '../../../../../services/toaster.service'; -import { MatDialogRef } from '@angular/material'; +import { MatDialogRef, MatDialog } from '@angular/material'; import { CustomAdaptersTableComponent } from '../../../../../components/preferences/common/custom-adapters-table/custom-adapters-table.component'; import { QemuService } from '../../../../../services/qemu.service'; import { QemuConfigurationService } from '../../../../../services/qemu-configuration.service'; import { QemuBinary } from '../../../../../models/qemu/qemu-binary'; +import { QemuImageCreatorComponent } from './qemu-image-creator/qemu-image-creator.component'; @Component({ @@ -30,9 +31,16 @@ export class ConfiguratorDialogQemuComponent implements OnInit { displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; networkTypes = []; + private conf = { + autoFocus: false, + width: '800px' + }; + dialogRefQemuImageCreator; + @ViewChild("customAdapters", {static: false}) customAdapters: CustomAdaptersTableComponent; constructor( + private dialog: MatDialog, public dialogRef: MatDialogRef, public nodeService: NodeService, private toasterService: ToasterService, @@ -58,6 +66,12 @@ export class ConfiguratorDialogQemuComponent implements OnInit { }); } + openQemuImageCreator() { + this.dialogRefQemuImageCreator = this.dialog.open(QemuImageCreatorComponent, this.conf); + let instance = this.dialogRefQemuImageCreator.componentInstance; + instance.server = this.server; + } + uploadCdromImageFile(event){ this.node.properties.cdrom_image = event.target.files[0].name; } diff --git a/src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.html b/src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.html new file mode 100644 index 00000000..aec8fdd5 --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.html @@ -0,0 +1,107 @@ +

Qemu image configurator

+ +
+
+
+ +
+ + + +
+ + + + {{format}} + + + +
+ Size options + + + + {{preallocation}} + + + + + + + {{clusterSize.name}} + + + + Refcounts + + + + {{lazyRefcount}} + + + + + + + {{clusterSize.name}} + + + +
+
+ + Dynamic + Fixed + +
+
+ Adapter type
+ + IDE + LSI Logic + BusLogic + Legacy (ESX) +

+ Image file sizing mode
+ + Stream optimized + Split every 2GB (sparse) + Split every 2GB (flat) + Monolithic sparse + Monolithic flat +

+ + + {{option}} + + +
+
+ + + + + + +
+ +
+
+
+ +
+ + +
diff --git a/src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.ts b/src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.ts new file mode 100644 index 00000000..d5e59ecd --- /dev/null +++ b/src/app/components/project-map/node-editors/configurator/qemu/qemu-image-creator/qemu-image-creator.component.ts @@ -0,0 +1,121 @@ +import { Component, OnInit, Input, ViewChild } from "@angular/core"; +import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; +import { Server } from '../../../../../../models/server'; +import { NodeService } from '../../../../../../services/node.service'; +import { ToasterService } from '../../../../../../services/toaster.service'; +import { MatDialogRef } from '@angular/material'; +import { QemuService } from '../../../../../../services/qemu.service'; +import { QemuImg } from '../../../../../../models/qemu/qemu-img'; + + +@Component({ + selector: 'app-qemu-image-creator', + templateUrl: './qemu-image-creator.component.html', + styleUrls: ['../../configurator.component.scss'] +}) +export class QemuImageCreatorComponent implements OnInit { + server: Server; + qemuImg: QemuImg; + + formatOptions: string[] = ['qcow2', 'qcow', 'vhd', 'vdi', 'vmdk', 'raw']; + preallocationsOptions: string[] = ['off', 'metadata', 'falloc', 'full']; + clusterSizeOptions: ClusterSize[] = [ + { + name: '512', + value: 512 + }, + { + name: '1k', + value: 1024 + }, + { + name: '2k', + value: 2048 + }, + { + name: '4k', + value: 4096 + }, + { + name: '8k', + value: 8192 + }, + { + name: '16k', + value: 16384 + }, + { + name: '32k', + value: 32768 + }, + { + name: '64k', + value: 65536 + }, + { + name: '128k', + value: 131072 + }, + { + name: '256k', + value: 262144 + }, + { + name: '512k', + value: 524288 + }, + { + name: '1024k', + value: 1048576 + }, + { + name: '2048k', + value: 2097152 + } + ]; + lazyRefcountsOptions: string[] = ['off', 'on']; + refcountBitsOptions: number[] = [1,2,4,8,16,32,64]; + zeroedGrainOptions: string[] = ['on', 'off']; + inputForm: FormGroup; + + constructor( + public dialogRef: MatDialogRef, + public nodeService: NodeService, + private toasterService: ToasterService, + private formBuilder: FormBuilder, + private qemuService: QemuService + ) { + this.inputForm = this.formBuilder.group({ + qemu_img: new FormControl('', Validators.required), + path: new FormControl('', Validators.required), + size: new FormControl('', Validators.required) + }); + } + + ngOnInit() { + this.qemuImg = {} as QemuImg; + } + + setSubformat(subformat: string) { + this.qemuImg.subformat = subformat; + } + + onSaveClick() { + if (this.inputForm.valid && this.qemuImg.format) { + this.qemuService.addImage(this.server, this.qemuImg).subscribe(() => { + this.dialogRef.close(); + }); + } else { + this.toasterService.error('Fill all required fields.') + } + } + + onCancelClick() { + this.dialogRef.close(); + } +} + +export interface ClusterSize { + name: string; + value: number; +} diff --git a/src/app/models/qemu/qemu-img.ts b/src/app/models/qemu/qemu-img.ts new file mode 100644 index 00000000..c8d8d7d2 --- /dev/null +++ b/src/app/models/qemu/qemu-img.ts @@ -0,0 +1,12 @@ +export class QemuImg { + cluster_size: number; + format: string; + lazy_refcounts: string; + path: string; + preallocation: string; + qemu_img: string; + refcount_bits: number; + size: number; + subformat: string; + zeroed_grain: string; +} diff --git a/src/app/services/qemu.service.ts b/src/app/services/qemu.service.ts index d987016f..f82c0d50 100644 --- a/src/app/services/qemu.service.ts +++ b/src/app/services/qemu.service.ts @@ -5,6 +5,7 @@ import { QemuTemplate } from '../models/templates/qemu-template'; import { Server } from '../models/server'; import { QemuBinary } from '../models/qemu/qemu-binary'; import { QemuImage } from '../models/qemu/qemu-image'; +import { QemuImg } from '../models/qemu/qemu-img'; @Injectable() export class QemuService { @@ -26,6 +27,10 @@ export class QemuService { return this.httpServer.get(server, '/compute/qemu/images') as Observable; } + addImage(server: Server, qemuImg: QemuImg): Observable { + return this.httpServer.post(server, '/compute/qemu/img', qemuImg) as Observable; + } + addTemplate(server: Server, qemuTemplate: QemuTemplate): Observable { return this.httpServer.post(server, `/templates`, qemuTemplate) as Observable; } From 78767399fc9f92ccddb3cf66137096b4393cca0b Mon Sep 17 00:00:00 2001 From: Piotr Pekala Date: Fri, 20 Sep 2019 03:19:55 -0700 Subject: [PATCH 30/30] Qemu configurator extended --- .../configurator/configurator.component.scss | 4 +++ .../qemu/configurator-qemu.component.html | 34 ++++++++++++------- .../qemu/configurator-qemu.component.ts | 6 ++++ 3 files changed, 31 insertions(+), 13 deletions(-) diff --git a/src/app/components/project-map/node-editors/configurator/configurator.component.scss b/src/app/components/project-map/node-editors/configurator/configurator.component.scss index a7d34f67..7bae870f 100644 --- a/src/app/components/project-map/node-editors/configurator/configurator.component.scss +++ b/src/app/components/project-map/node-editors/configurator/configurator.component.scss @@ -21,6 +21,10 @@ width: 18%; } +.create-button { + width: 100%; +} + .file-name-form-field { padding-left: 2%; width: 80%; diff --git 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 index 2be7c35d..3a90ccf1 100644 --- 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 @@ -52,15 +52,17 @@ - + HDA (Primary Master) - - - + + + {{image.filename}} + + @@ -76,9 +78,11 @@ HDB (Primary Slave) - - - + + + {{image.filename}} + + @@ -94,9 +98,11 @@ HDC (Secondary Master) - - - + + + {{image.filename}} + + @@ -112,9 +118,11 @@ HDD (Secondary Slave) - - - + + + {{image.filename}} + + diff --git a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts index 36be884a..939e2ad0 100644 --- a/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts +++ b/src/app/components/project-map/node-editors/configurator/qemu/configurator-qemu.component.ts @@ -10,6 +10,7 @@ import { QemuService } from '../../../../../services/qemu.service'; import { QemuConfigurationService } from '../../../../../services/qemu-configuration.service'; import { QemuBinary } from '../../../../../models/qemu/qemu-binary'; import { QemuImageCreatorComponent } from './qemu-image-creator/qemu-image-creator.component'; +import { QemuImage } from '../../../../../models/qemu/qemu-image'; @Component({ @@ -30,6 +31,7 @@ export class ConfiguratorDialogQemuComponent implements OnInit { displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type', 'actions']; networkTypes = []; + qemuImages: QemuImage[] = []; private conf = { autoFocus: false, @@ -64,6 +66,10 @@ export class ConfiguratorDialogQemuComponent implements OnInit { this.qemuService.getBinaries(this.server).subscribe((qemuBinaries: QemuBinary[]) => { this.binaries = qemuBinaries; }); + + this.qemuService.getImages(this.server).subscribe((qemuImages: QemuImage[]) => { + this.qemuImages = qemuImages; + }); } openQemuImageCreator() {