ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2024-12-31 01:57:00 +00:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Merge branch 'master-2.3' into Project-readme-support

Browse Source
This commit is contained in:
piotrpekala7 2020-10-19 16:57:25 +02:00
commit 1fc48b28b3
132 changed files with 3922 additions and 2864 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Dockerfile
View File

@ -1,5 +1,5 @@
# Dockerfile for GNS3 Web-ui development
FROM node:carbon
FROM node:stretch
# Create user
RUN useradd --user-group --create-home --shell /bin/false gns3-web-ui

3
README.md
View File

@ -6,6 +6,9 @@
[![CircleCI](https://circleci.com/gh/GNS3/gns3-web-ui/tree/master.png)](https://circleci.com/gh/GNS3/gns3-web-ui/tree/master.png)
[![codecov](https://codecov.io/gh/GNS3/gns3-web-ui/branch/master/graph/badge.svg)](https://codecov.io/gh/GNS3/gns3-web-ui)
[![Dependency](https://img.shields.io/librariesio/github/GNS3/gns3-web-ui)](https://libraries.io/github/GNS3/gns3-web-ui)
[![Packages versions](https://repology.org/badge/latest-versions/gns3.svg)](https://repology.org/metapackage/gns3/versions)
[![Packages](https://repology.org/badge/tiny-repos/gns3.svg)](https://repology.org/metapackage/gns3/versions)
Test WebUI implementation for GNS3.

102
package.json
View File

@ -1,6 +1,6 @@
{
"name": "gns3-web-ui",
"version": "2020.3.0-beta.2",
"version": "2.2.16dev1",
"author": {
"name": "GNS3 Technology Inc.",
"email": "developers@gns3.com"
@ -40,27 +40,27 @@
},
"private": true,
"dependencies": {
"@angular/animations": "^10.0.2",
"@angular/cdk": "^10.0.1",
"@angular/common": "^10.0.2",
"@angular/compiler": "^10.0.2",
"@angular/core": "^10.0.2",
"@angular/forms": "^10.0.2",
"@angular/animations": "^10.1.5",
"@angular/cdk": "^10.2.4",
"@angular/common": "^10.1.5",
"@angular/compiler": "^10.1.5",
"@angular/core": "^10.1.5",
"@angular/forms": "^10.1.5",
"@angular/http": "^7.2.16",
"@angular/material": "^10.0.1",
"@angular/platform-browser": "^10.0.2",
"@angular/platform-browser-dynamic": "^10.0.2",
"@angular/router": "^10.0.2",
"@sentry/browser": "^5.18.0",
"@types/jest": "^26.0.3",
"@types/mocha": "^7.0.2",
"angular-draggable-droppable": "^4.5.1",
"@angular/material": "^10.2.4",
"@angular/platform-browser": "^10.1.5",
"@angular/platform-browser-dynamic": "^10.1.5",
"@angular/router": "^10.1.5",
"@sentry/browser": "^5.26.0",
"@types/jest": "^26.0.14",
"@types/mocha": "^8.0.3",
"angular-draggable-droppable": "^4.5.4",
"angular-persistence": "^1.0.1",
"angular-resizable-element": "^3.3.2",
"angular-resizable-element": "^3.3.3",
"angular2-draggable": "^2.3.2",
"angular2-hotkeys": "^2.2.0",
"angular2-indexeddb": "^1.2.3",
"bootstrap": "4.5.0",
"bootstrap": "4.5.2",
"command-exists": "^1.2.9",
"core-js": "^3.6.5",
"css-tree": "^1.0.0-alpha.36",
@ -69,64 +69,64 @@
"ini": "^1.3.5",
"marked": "^1.1.1",
"material-design-icons": "^3.0.1",
"ng-circle-progress": "^1.5.1",
"ng-circle-progress": "^1.6.0",
"ng2-file-upload": "^1.3.0",
"ngx-childprocess": "^0.0.6",
"ngx-device-detector": "^1.4.5",
"ngx-device-detector": "^2.0.0",
"ngx-electron": "^2.1.1",
"node-fetch": "^2.6.0",
"notosans-fontface": "1.1.0",
"rxjs": "^6.5.5",
"rxjs-compat": "^6.5.5",
"save-html-as-image": "^1.3.3",
"node-fetch": "^2.6.1",
"notosans-fontface": "1.2.2",
"rxjs": "^6.6.3",
"rxjs-compat": "^6.6.3",
"save-html-as-image": "^1.3.4",
"save-svg-as-png": "^1.4.14",
"snyk": "^1.361.3",
"svg-crowbar": "^0.6.0",
"snyk": "^1.413.3",
"svg-crowbar": "^0.6.1",
"tree-kill": "^1.2.1",
"tslib": "^2.0.0",
"tslib": "^2.0.3",
"typeface-roboto": "^0.0.75",
"xterm": "^4.1.0",
"xterm": "^4.9.0",
"xterm-addon-attach": "^0.6.0",
"xterm-addon-fit": "^0.4.0",
"yargs": "^15.3.1",
"zone.js": "~0.10.3"
"yargs": "^16.0.3",
"zone.js": "~0.11.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1000.0",
"@angular/cli": "^10.0.0",
"@angular/compiler-cli": "^10.0.2",
"@angular/language-service": "^10.0.2",
"@sentry/cli": "^1.53.0",
"@sentry/electron": "^1.3.0",
"@types/jasmine": "^3.5.11",
"@angular-devkit/build-angular": "^0.1001.6",
"@angular/cli": "^10.1.6",
"@angular/compiler-cli": "^10.1.5",
"@angular/language-service": "^10.1.5",
"@sentry/cli": "^1.58.0",
"@sentry/electron": "^2.0.1",
"@types/jasmine": "^3.5.14",
"@types/jasminewd2": "^2.0.8",
"@types/node": "12.12.6",
"codelyzer": "^5.2.2",
"electron": "^9.0.5",
"electron-builder": "22.7.0",
"file-loader": "^6.0.0",
"jasmine-core": "^3.5.0",
"jasmine-spec-reporter": "^5.0.2",
"@types/node": "14.11.2",
"codelyzer": "^6.0.1",
"electron": "^10.1.3",
"electron-builder": "22.8.1",
"file-loader": "^6.1.1",
"jasmine-core": "^3.6.0",
"jasmine-spec-reporter": "^6.0.0",
"jquery": "^3.5.1",
"karma": "^5.1.0",
"karma": "^5.2.3",
"karma-chrome-launcher": "^3.1.0",
"karma-cli": "^2.0.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "^3.3.1",
"karma-jasmine": "^4.0.1",
"karma-jasmine-html-reporter": "^1.5.4",
"license-checker": "^25.0.1",
"node-sass": "^4.14.1",
"popper.js": "^1.16.1",
"prettier": "^2.0.5",
"prettier": "^2.1.2",
"protractor": "^7.0.0",
"replace": "^1.2.0",
"rxjs-tslint": "^0.1.8",
"ts-mockito": "^2.6.1",
"ts-node": "~8.10.2",
"tslint": "^6.1.2",
"ts-node": "~9.0.0",
"tslint": "^6.1.3",
"tslint-config-prettier": "^1.18.0",
"typescript": "^3.9.5",
"webpack": "^4.43.0"
"typescript": "^4.0.3",
"webpack": "^4.44.2"
},
"greenkeeper": {
"ignore": [

2
scripts/requirements.txt
View File

@ -5,3 +5,5 @@ packaging==19.0
appdirs==1.4.3
psutil==5.6.7
jsonschema==2.6.0 # lock down jsonschema, 3.0 makes problems
urllib3>=1.25.9 # not directly required, pinned by Snyk to avoid a vulnerability

27
src/ReleaseNotes.txt
View File

@ -1,6 +1,29 @@
GNS3 WebUI is web implementation of user interface for GNS3 software.
Current version: 2020.3.0-beta.1
Current version: 2020.4.0-beta.1
Bug Fixes & enhancements
- symbol is not properly selected in change symbol dialog
- issue when using the scroll wheel on the web console
- missing settings for Docker nodes
- error on servers page
What's new
- double click nodes to open the console
Current version: 2020.3.0-beta.3
Bug Fixes & enhancements
- direct download URL in template dialog
- fix for issues with suspnded nodes
- fix for bug with deleting templates
- fix for importing images
What's new
- Option to resize console
- Improvements in creating templates
GNS3 Web UI 2020.3.0-beta.1
Bug Fixes & enhancements
- refreshing list of templates after adding new template from project map 
@ -15,7 +38,7 @@ Bug Fixes & enhancements
What's new
- Option to import appliances
Current version: 2020.2.0-beta.5
GNS3 Web UI 2020.2.0-beta.5
Bug Fixes

4
src/app/app.component.spec.ts
View File

@ -2,14 +2,14 @@ import { TestBed, async, ComponentFixture } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
import { MatIconModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { SettingsService } from './services/settings.service';
import { PersistenceService } from 'angular-persistence';
import { ElectronService, NgxElectronModule } from 'ngx-electron';
import createSpyObj = jasmine.createSpyObj;
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { ProgressService } from './common/progress/progress.service';
import 'jasmine';
// import 'jasmine';
describe('AppComponent', () => {
let component: AppComponent;

23
src/app/app.module.ts
View File

@ -37,6 +37,7 @@ import { ProjectMapComponent } from './components/project-map/project-map.compon
import { ServersComponent } from './components/servers/servers.component';
import { AddServerDialogComponent } from './components/servers/add-server-dialog/add-server-dialog.component';
import { ContextMenuComponent } from './components/project-map/context-menu/context-menu.component';
import { ContextConsoleMenuComponent } from './components/project-map/context-console-menu/context-console-menu.component';
import { StartNodeActionComponent } from './components/project-map/context-menu/actions/start-node-action/start-node-action.component';
import { StopNodeActionComponent } from './components/project-map/context-menu/actions/stop-node-action/stop-node-action.component';
import { TemplateComponent } from './components/template/template.component';
@ -226,6 +227,8 @@ 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 { EditNetworkConfigurationDialogComponent } from './components/project-map/node-editors/configurator/docker/edit-network-configuration/edit-network-configuration.component';
import { ConfigureCustomAdaptersDialogComponent } from './components/project-map/node-editors/configurator/docker/configure-custom-adapters/configure-custom-adapters.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';
@ -249,7 +252,6 @@ import { AlignVerticallyActionComponent } from './components/project-map/context
import { ConfirmationBottomSheetComponent } from './components/projects/confirmation-bottomsheet/confirmation-bottomsheet.component';
import { TemplateFilter } from './filters/templateFilter.pipe';
import { NotificationService } from './services/notification.service';
import { DeviceDetectorModule } from 'ngx-device-detector';
import { ConfigDialogComponent } from './components/project-map/context-menu/dialogs/config-dialog/config-dialog.component';
import { Gns3vmComponent } from './components/preferences/gns3vm/gns3vm.component';
import { Gns3vmService } from './services/gns3vm.service';
@ -281,6 +283,10 @@ import { ApplianceInfoDialogComponent } from './components/project-map/new-templ
import { ResetLinkActionComponent } from './components/project-map/context-menu/actions/reset-link/reset-link-action.component';
import { ReadmeEditorComponent } from './components/projects/edit-project-dialog/readme-editor/readme-editor.component';
import { MarkedDirective } from './directives/marked.directive';
import { InformationDialogComponent } from './components/dialogs/information-dialog.component';
import { TemplateNameDialogComponent } from './components/project-map/new-template-dialog/template-name-dialog/template-name-dialog.component';
import { UpdatesService } from './services/updates.service';
@NgModule({
declarations: [
@ -297,6 +303,7 @@ import { MarkedDirective } from './directives/marked.directive';
DefaultLayoutComponent,
ProgressDialogComponent,
ContextMenuComponent,
ContextConsoleMenuComponent,
StartNodeActionComponent,
StopNodeActionComponent,
TemplateComponent,
@ -466,7 +473,11 @@ import { MarkedDirective } from './directives/marked.directive';
ChangeHostnameDialogComponent,
ApplianceInfoDialogComponent,
ReadmeEditorComponent,
MarkedDirective
MarkedDirective,
InformationDialogComponent,
TemplateNameDialogComponent,
ConfigureCustomAdaptersDialogComponent,
EditNetworkConfigurationDialogComponent
],
imports: [
BrowserModule,
@ -487,7 +498,6 @@ import { MarkedDirective } from './directives/marked.directive';
DragDropModule,
NgxChildProcessModule,
MATERIAL_IMPORTS,
DeviceDetectorModule.forRoot(),
NgCircleProgressModule.forRoot()
],
providers: [
@ -562,7 +572,8 @@ import { MarkedDirective } from './directives/marked.directive';
ServerResolve,
ConsoleGuard,
Title,
ApplianceService
ApplianceService,
UpdatesService
],
entryComponents: [
AddServerDialogComponent,
@ -608,7 +619,9 @@ import { MarkedDirective } from './directives/marked.directive';
AdbutlerComponent,
NewTemplateDialogComponent,
ChangeHostnameDialogComponent,
ApplianceInfoDialogComponent
ApplianceInfoDialogComponent,
ConfigureCustomAdaptersDialogComponent,
EditNetworkConfigurationDialogComponent
],
bootstrap: [AppComponent]
})

9
src/app/cartography/components/d3-map/d3-map.component.ts
View File

@ -104,6 +104,14 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
this.mapSettings.isReadOnly = value;
}
resize(val: boolean) {
if (val) {
this.svg.attr('height', window.innerHeight + window.scrollY - 16);
} else {
this.svg.attr('height', this.height);
}
}
ngOnChanges(changes: { [propKey: string]: SimpleChange }) {
if (
(changes['width'] && !changes['width'].isFirstChange()) ||
@ -158,6 +166,7 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
);
this.gridVisibility = localStorage.getItem('gridVisibility') === 'true' ? 1 : 0;
this.mapSettingsService.isScrollDisabled.subscribe(val => this.resize(val));
}
ngOnDestroy() {

2
src/app/cartography/models/node.ts
View File

@ -65,7 +65,7 @@ export class Node {
console_auto_start: boolean;
console_host: string;
console_type: string;
custom_adapters?: CustomAdapter[];
custom_adapters?: any[];
ethernet_adapters?: any;
serial_adapters?: any;
first_port_name: string;

7
src/app/cartography/widgets/node.ts
View File

@ -15,6 +15,7 @@ import { MapSettingsService } from '../../services/mapsettings.service';
@Injectable()
export class NodeWidget implements Widget {
public onContextMenu = new EventEmitter<NodeContextMenu>();
public onContextConsoleMenu = new EventEmitter<NodeContextMenu>();
public onNodeClicked = new EventEmitter<NodeClicked>();
constructor(
@ -85,13 +86,19 @@ export class NodeWidget implements Widget {
event.preventDefault();
self.onContextMenu.emit(new NodeContextMenu(event, n));
})
.on('dblclick', function(n: MapNode, i: number) {
event.preventDefault();
self.onContextConsoleMenu.emit(new NodeContextMenu(event, n));
})
.attr('xnode:href', (n: MapNode) => n.symbolUrl)
.attr('width', (n: MapNode) => {
if (n.nodeType === 'cloud' || n.nodeType === 'nat') return 120;
if (!n.width) return 60;
if (n.width > 64) return 64;
return n.width;
})
.attr('height', (n: MapNode) => {
if (n.nodeType === 'cloud' || n.nodeType === 'nat') return 60;
if (!n.height) return 60;
if (n.height > 64) return 64;
return n.height;

6
src/app/common/error-handlers/sentry-error-handler.ts
View File

@ -9,7 +9,7 @@ import * as Sentry from "@sentry/browser";
import { BrowserOptions, init } from '@sentry/browser';
const config = {
dsn: "https://b2b1cfd9b043491eb6b566fd8acee358@o19455.ingest.sentry.io/842726"
dsn: "https://d8be3a98530f49eb90968ff396db326c@o19455.ingest.sentry.io/842726"
};
init(config as BrowserOptions);
@ -59,12 +59,12 @@ export class SentryErrorHandler implements ErrorHandler {
// Capture handled exception and send it to Sentry.
const eventId = Sentry.captureException(extractedError);
// When in development mode, log the error to console for immediate feedback.
if (!environment.production) {
console.error(extractedError);
}
// Optionally show user dialog to provide details on what happened.
// Sentry.showReportDialog({ eventId });
}

2
src/app/common/error-handlers/toaster-error-handler.ts
View File

@ -5,7 +5,7 @@ import { SentryErrorHandler } from './sentry-error-handler';
@Injectable()
export class ToasterErrorHandler extends SentryErrorHandler {
handleError(err: any): void {
if (err.error && err.error.status && !(err.error.status === 403 || err.error.status === 404 || err.error.status === 405)) {
if (err.error && err.error.status && !(err.error.status === 400 || err.error.status === 403 || err.error.status === 404 || err.error.status === 409)) {
super.handleError(err);
}

2
src/app/common/progress/progress.component.scss
View File

@ -7,7 +7,7 @@
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1000;
z-index: 2000;
}
.loading-spinner,

3
src/app/common/progress/progress.component.spec.ts
View File

@ -1,7 +1,8 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ProgressComponent } from './progress.component';
import { MatIconModule, MatProgressSpinnerModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { ProgressService } from './progress.service';
import { RouterTestingModule } from '@angular/router/testing';
import { Router } from '@angular/router';

12
src/app/components/adbutler/adbutler.component.ts
View File

@ -14,6 +14,15 @@ export class AdbutlerComponent implements OnInit {
theme: string;
onLoad = new EventEmitter();
htmlCode: string;
staticCode: string = `<a href="https://try.solarwinds.com/gns3-free-toolset-giveaway?CMP=LEC-HAD-GNS3-SW_NA_X_NP_X_X_EN_STSGA_SW-ST-20200901_ST_OF1_TRY-NWSLTR">
Access Our Favorite Network Free Tools!
</a><br/>
Access 20+ network performance management, monitoring, and troubleshooting tools for FREE ($200 Value).<br/>
<button>
<a target="_blank" href="https://try.solarwinds.com/gns3-free-toolset-giveaway?CMP=LEC-HAD-GNS3-SW_NA_X_NP_X_X_EN_STSGA_SW-ST-20200901_ST_OF1_TRY-NWSLTR">
Check it out!
</a>
</button>`;
constructor(
private httpClient: HttpClient
@ -28,7 +37,8 @@ export class AdbutlerComponent implements OnInit {
this.htmlCode = response['placements'].placement_1.body;
this.ad.nativeElement.insertAdjacentHTML('beforeend', this.htmlCode);
} else {
this.onLoad.emit(false);
this.onLoad.emit(true);
this.htmlCode = this.staticCode;
}
},
error => {}

0
src/app/components/dialogs/information-dialog.component.css Normal file
View File

7
src/app/components/dialogs/information-dialog.component.html Normal file
View File

@ -0,0 +1,7 @@
<span>{{ confirmationMessage }}</span>
<div mat-dialog-actions>
<button mat-button class="cancelButton" (click)="onNoClick()" color="accent">No</button>
<button mat-button class="confirmButton" (click)="onYesClick()" tabindex="2" mat-raised-button color="primary">
Yes
</button>
</div>

22
src/app/components/dialogs/information-dialog.component.ts Normal file
View File

@ -0,0 +1,22 @@
import { Component, OnInit, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
@Component({
selector: 'app-information-dialog',
templateUrl: 'information-dialog.component.html',
styleUrls: ['information-dialog.component.css']
})
export class InformationDialogComponent implements OnInit {
public confirmationMessage: string;
constructor(public dialogRef: MatDialogRef<InformationDialogComponent>) {}
ngOnInit() {}
onNoClick(): void {
this.dialogRef.close(false);
}
onYesClick(): void {
this.dialogRef.close(true);
}
}

5
src/app/components/preferences/built-in/built-in-preferences.component.spec.ts
View File

@ -1,5 +1,8 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatCheckboxModule, MatIconModule, MatToolbarModule, MatMenuModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ActivatedRoute } from '@angular/router';
import { CommonModule } from '@angular/common';

9
src/app/components/preferences/built-in/cloud-nodes/cloud-nodes-add-template/cloud-nodes-add-template.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
@ -17,6 +20,8 @@ import { BuiltInTemplatesService } from '../../../../../services/built-in-templa
import { ToasterService } from '../../../../../services/toaster.service';
import { TemplateMocksService } from '../../../../../services/template-mocks.service';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ComputeService } from '../../../../../services/compute.service';
import {MockedComputeService} from '../../../../preferences/vpcs/add-vpcs-template/add-vpcs-template.component.spec'
export class MockedBuiltInTemplatesService {
public addTemplate(server: Server, cloudTemplate: CloudTemplate) {
@ -31,6 +36,7 @@ describe('CloudNodesAddTemplateComponent', () => {
let mockedServerService = new MockedServerService;
let mockedBuiltInTemplatesService = new MockedBuiltInTemplatesService;
let mockedToasterService = new MockedToasterService;
let mockedComputeService = new MockedComputeService();
let activatedRoute = new MockedActivatedRoute().get();
beforeEach(async(() => {
@ -51,6 +57,7 @@ describe('CloudNodesAddTemplateComponent', () => {
{ provide: ServerService, useValue: mockedServerService },
{ provide: BuiltInTemplatesService, useValue: mockedBuiltInTemplatesService },
{ provide: ToasterService, useValue: mockedToasterService },
{ provide: ComputeService, useValue: mockedComputeService },
{ provide: TemplateMocksService, useClass: TemplateMocksService }
],
declarations: [

6
src/app/components/preferences/built-in/cloud-nodes/cloud-nodes-template-details/cloud-nodes-template-details.component.spec.ts
View File

@ -1,5 +1,9 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/built-in/cloud-nodes/cloud-nodes-templates/cloud-nodes-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

9
src/app/components/preferences/built-in/ethernet-hubs/ethernet-hubs-add-template/ethernet-hubs-add-template.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
@ -17,6 +20,8 @@ import { TemplateMocksService } from '../../../../../services/template-mocks.ser
import { EthernetHubTemplate } from '../../../../../models/templates/ethernet-hub-template';
import { EthernetHubsAddTemplateComponent } from './ethernet-hubs-add-template.component';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { ComputeService } from '../../../../../services/compute.service';
import {MockedComputeService} from '../../../../preferences/vpcs/add-vpcs-template/add-vpcs-template.component.spec';
export class MockedBuiltInTemplatesService {
public addTemplate(server: Server, ethernetHubTemplate: EthernetHubTemplate) {
@ -31,6 +36,7 @@ describe('EthernetHubsAddTemplateComponent', () => {
let mockedServerService = new MockedServerService;
let mockedBuiltInTemplatesService = new MockedBuiltInTemplatesService;
let mockedToasterService = new MockedToasterService;
let mockedComputeService = new MockedComputeService();
let activatedRoute = new MockedActivatedRoute().get();
beforeEach(async(() => {
@ -53,6 +59,7 @@ describe('EthernetHubsAddTemplateComponent', () => {
{ provide: ServerService, useValue: mockedServerService },
{ provide: BuiltInTemplatesService, useValue: mockedBuiltInTemplatesService },
{ provide: ToasterService, useValue: mockedToasterService},
{ provide: ComputeService, useValue: mockedComputeService },
{ provide: TemplateMocksService, useClass: TemplateMocksService }
],
declarations: [

6
src/app/components/preferences/built-in/ethernet-hubs/ethernet-hubs-template-details/ethernet-hubs-template-details.component.spec.ts
View File

@ -1,5 +1,9 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/built-in/ethernet-hubs/ethernet-hubs-templates/ethernet-hubs-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

11
src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-add-template/ethernet-switches-add-template.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
@ -17,6 +20,8 @@ import { TemplateMocksService } from '../../../../../services/template-mocks.ser
import { EthernetSwitchTemplate } from '../../../../../models/templates/ethernet-switch-template';
import { EthernetSwitchesAddTemplateComponent } from './ethernet-switches-add-template.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ComputeService } from '../../../../../services/compute.service';
import {MockedComputeService} from '../../../../preferences/vpcs/add-vpcs-template/add-vpcs-template.component.spec';
export class MockedBuiltInTemplatesService {
public addTemplate(server: Server, ethernetHubTemplate: EthernetSwitchTemplate) {
@ -31,6 +36,7 @@ describe('EthernetSwitchesAddTemplateComponent', () => {
let mockedServerService = new MockedServerService;
let mockedBuiltInTemplatesService = new MockedBuiltInTemplatesService;
let mockedToasterService = new MockedToasterService;
let mockedComputeService = new MockedComputeService();
let activatedRoute = new MockedActivatedRoute().get();
beforeEach(async(() => {
@ -53,6 +59,7 @@ describe('EthernetSwitchesAddTemplateComponent', () => {
{ provide: ServerService, useValue: mockedServerService },
{ provide: BuiltInTemplatesService, useValue: mockedBuiltInTemplatesService },
{ provide: ToasterService, useValue: mockedToasterService},
{ provide: ComputeService, useValue: mockedComputeService },
{ provide: TemplateMocksService, useClass: TemplateMocksService }
],
declarations: [
@ -96,7 +103,7 @@ describe('EthernetSwitchesAddTemplateComponent', () => {
expect(mockedToasterService.error).toHaveBeenCalled();
});
it('should not call add template when number of ports is missing', () => {
xit('should not call add template when number of ports is missing', () => {
spyOn(mockedBuiltInTemplatesService, 'addTemplate').and.returnValue(of({} as EthernetSwitchTemplate));
spyOn(mockedToasterService, 'error');
component.formGroup.controls['templateName'].setValue('template name');

6
src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-template-details/ethernet-switches-template-details.component.spec.ts
View File

@ -1,5 +1,9 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-templates/ethernet-switches-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

6
src/app/components/preferences/common/custom-adapters/custom-adapters.component.spec.ts
View File

@ -1,5 +1,9 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatCheckboxModule, MatIconModule, MatToolbarModule, MatMenuModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { CommonModule } from '@angular/common';
import { NO_ERRORS_SCHEMA } from '@angular/core';

8
src/app/components/preferences/common/delete-template-component/delete-template.component.ts
View File

@ -33,11 +33,9 @@ export class DeleteTemplateComponent {
dialogRef.afterClosed().subscribe((answer: boolean) => {
if (answer) {
this.templateService.deleteTemplate(this.server, templateId).subscribe((answer: boolean) => {
if(answer) {
this.deleteEvent.emit(templateId);
this.toasterService.success(`Template ${templateName} deleted.`);
}
this.templateService.deleteTemplate(this.server, templateId).subscribe((answer) => {
this.deleteEvent.emit(templateId);
this.toasterService.success(`Template ${templateName} deleted.`);
});
}
});

5
src/app/components/preferences/common/symbols/symbols.component.scss
View File

@ -21,8 +21,7 @@
.buttonSelected {
border-width: 3px;
border-color: #0097a7;
width: 77px;
background: #0097a7!important;
}
.image {
@ -33,7 +32,7 @@
}
.imageSelected {
margin-left: -3px;
margin-left: 0px;
}
.wrapper {

5
src/app/components/preferences/common/symbols/symbols.component.spec.ts
View File

@ -1,5 +1,8 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatCheckboxModule, MatIconModule, MatToolbarModule, MatMenuModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { of } from 'rxjs';
import { CommonModule } from '@angular/common';

13
src/app/components/preferences/docker/add-docker-template/add-docker-template.component.spec.ts
View File

@ -1,5 +1,16 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatInputModule, MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatSelectModule, MatFormFieldModule, MatAutocompleteModule, MatTableModule, MatStepperModule, MatRadioModule, MatCommonModule } from '@angular/material';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatCommonModule } from '@angular/material/core';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/docker/docker-template-details/docker-template-details.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/docker/docker-templates/docker-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

11
src/app/components/preferences/dynamips/add-ios-template/add-ios-template.component.spec.ts
View File

@ -1,5 +1,14 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatInputModule, MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatSelectModule, MatFormFieldModule, MatAutocompleteModule, MatTableModule, MatStepperModule } from '@angular/material';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/dynamips/dynamips-preferences/dynamips-preferences.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/dynamips/ios-template-details/ios-template-details.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/dynamips/ios-templates/ios-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/general/general-preferences.component.spec.ts
View File

@ -1,5 +1,8 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatCheckboxModule, MatIconModule, MatToolbarModule, MatMenuModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ActivatedRoute } from '@angular/router';
import { CommonModule } from '@angular/common';

11
src/app/components/preferences/ios-on-unix/add-iou-template/add-iou-template.component.spec.ts
View File

@ -1,5 +1,14 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatInputModule, MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatSelectModule, MatFormFieldModule, MatAutocompleteModule, MatTableModule, MatStepperModule } from '@angular/material';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/ios-on-unix/iou-template-details/iou-template-details.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/ios-on-unix/iou-templates/iou-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/preferences.component.spec.ts
View File

@ -1,5 +1,8 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatCheckboxModule, MatIconModule, MatToolbarModule, MatMenuModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { PreferencesComponent } from './preferences.component';
import { ActivatedRoute } from '@angular/router';

10
src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.spec.ts
View File

@ -1,5 +1,13 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatSelectModule, MatAutocompleteModule, MatFormFieldModule, MatInputModule, MatStepperModule } from '@angular/material';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatStepperModule } from '@angular/material/stepper';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

2
src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.ts
View File

@ -146,7 +146,7 @@ export class AddQemuVmTemplateComponent implements OnInit {
addTemplate() {
if (!this.nameForm.invalid && !this.memoryForm.invalid && (this.selectedImage || this.chosenImage)) {
this.qemuTemplate.ram = this.memoryForm.get("ramMemory").value;
this.qemuTemplate.ram = +this.memoryForm.get("ramMemory").value;
this.qemuTemplate.qemu_path = this.selectedBinary.path;
if (this.newImageSelected) {
this.qemuTemplate.hda_disk_image = this.diskForm.get("fileName").value;

5
src/app/components/preferences/qemu/qemu-preferences/qemu-preferences.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

6
src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.spec.ts
View File

@ -1,5 +1,9 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/virtual-box/add-virtual-box-template/add-virtual-box-template.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/virtual-box/virtual-box-preferences/virtual-box-prefernces.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

6
src/app/components/preferences/virtual-box/virtual-box-template-details/virtual-box-template-details.component.spec.ts
View File

@ -1,5 +1,9 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/virtual-box/virtual-box-templates/virtual-box-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/vmware/add-vmware-template/add-vmware.component.template.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/vmware/vmware-preferences/vmware-preferences.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

6
src/app/components/preferences/vmware/vmware-template-details/vmware-template-details.component.spec.ts
View File

@ -1,5 +1,9 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatTableModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/vmware/vmware-templates/vmware-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

14
src/app/components/preferences/vpcs/add-vpcs-template/add-vpcs-template.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
@ -17,6 +20,13 @@ import { MockedToasterService } from '../../../../services/toaster.service.spec'
import { VpcsTemplate } from '../../../../models/templates/vpcs-template';
import { MockedActivatedRoute } from '../../preferences.component.spec';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ComputeService } from '../../../../services/compute.service';
export class MockedComputeService {
getComputes(server: Server) {
return of([]);
}
}
export class MockedVpcsService {
public addTemplate(server: Server, vpcsTemplate: VpcsTemplate) {
@ -32,6 +42,7 @@ describe('AddVpcsTemplateComponent', () => {
let mockedVpcsService = new MockedVpcsService;
let mockedToasterService = new MockedToasterService;
let activatedRoute = new MockedActivatedRoute().get();
let mockedComputeService = new MockedComputeService();
beforeEach(async(() => {
TestBed.configureTestingModule({
@ -51,6 +62,7 @@ describe('AddVpcsTemplateComponent', () => {
{ provide: ServerService, useValue: mockedServerService },
{ provide: VpcsService, useValue: mockedVpcsService },
{ provide: ToasterService, useValue: mockedToasterService },
{ provide: ComputeService, useValue: mockedComputeService },
{ provide: TemplateMocksService, useClass: TemplateMocksService }
],
declarations: [

5
src/app/components/preferences/vpcs/vpcs-preferences/vpcs-preferences.component.spec.ts
View File

@ -1,6 +1,9 @@
import { VpcsPreferencesComponent } from "./vpcs-preferences.component";
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/vpcs/vpcs-template-details/vpcs-template-details.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

5
src/app/components/preferences/vpcs/vpcs-templates/vpcs-templates.component.spec.ts
View File

@ -1,5 +1,8 @@
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';

20
src/app/components/project-map/console-wrapper/console-wrapper.component.html
View File

@ -3,7 +3,7 @@
(document:mousemove)="dragWidget($event)"
(document:mouseup)="toggleDragging(false)">
</div>
<!-- Option with resizing
<!-- Option with resizing -->
<div
class="consoleWrapper"
[ngClass]="{lightTheme: isLightThemeEnabled}"
@ -14,14 +14,14 @@
[resizeEdges]="{ right: true, left: true, bottom: true, top: true }"
[enableGhostResize]="true"
(resizeStart)="toggleDragging(false)"
(resizeEnd)="onResizeEnd($event)"> -->
<div
(resizeEnd)="onResizeEnd($event)">
<!-- <div
class="consoleWrapper"
[ngClass]="{lightTheme: isLightThemeEnabled}"
(mousedown)="toggleDragging(true)"
[ngStyle]="style">
[ngStyle]="style"> -->
<div class="consoleHeader">
<div class="consoleHeader" [ngClass]="{lightThemeConsoleHeader: isLightThemeEnabled}">
<mat-tab-group class="tabs" [selectedIndex]="selected.value" (selectedIndexChange)="selected.setValue($event)">
<mat-tab>
<ng-template mat-tab-label>
@ -32,7 +32,7 @@
<mat-tab *ngFor="let node of nodes; let index = index" [label]="tab">
<ng-template mat-tab-label>
<div class="col" style="margin-left: 20px;">{{node.name}}</div>
<button style="color:white" mat-icon-button (click)="removeTab(index)">
<button [ngClass]="{lightThemeConsoleHeader: isLightThemeEnabled}" style="color:white" mat-icon-button (click)="removeTab(index)">
<mat-icon>close</mat-icon>
</button>
</ng-template>
@ -40,20 +40,20 @@
</mat-tab-group>
<button *ngIf="!isMinimized" style="color:white" mat-icon-button (click)="minimize(true)">
<button *ngIf="!isMinimized" [ngClass]="{lightThemeConsoleHeader: isLightThemeEnabled}" style="color:white" mat-icon-button (click)="minimize(true)">
<mat-icon>remove</mat-icon>
</button>
<button *ngIf="isMinimized" style="color:white" mat-icon-button (click)="minimize(false)">
<button *ngIf="isMinimized" [ngClass]="{lightThemeConsoleHeader: isLightThemeEnabled}" style="color:white" mat-icon-button (click)="minimize(false)">
<mat-icon>web_asset</mat-icon>
</button>
<button style="color:white" mat-icon-button (click)="close()">
<button [ngClass]="{lightThemeConsoleHeader: isLightThemeEnabled}" style="color:white" mat-icon-button (click)="close()">
<mat-icon>close</mat-icon>
</button>
</div>
<app-log-console [hidden]="!(selected.value===0) || isMinimized" [server]="server" [project]="project"></app-log-console>
<div [hidden]="isMinimized" *ngFor="let node of nodes; let index = index">
<div (mouseover)="disableScroll($event)" (mouseout)="enableScroll($event)" class="xterm-console" [hidden]="isMinimized" *ngFor="let node of nodes; let index = index">
<app-web-console [hidden]="!(selected.value===(index+1))" [server]="server" [node]="nodes[index]"></app-web-console>
</div>
</div>

29
src/app/components/project-map/console-wrapper/console-wrapper.component.scss
View File

@ -5,7 +5,7 @@
left: 20px;
height: 180px;
width: 600px;
background: #263238;
background: #000000!important;
color: white;
overflow: hidden;
font-size: 12px;
@ -38,10 +38,31 @@
display: flex;
padding: 2px;
justify-content: space-between;
background: #263238!important;
}
.lightThemeConsoleHeader {
background: white!important;
color: black!important;
}
:host ::ng-deep .mat-tab-label {
height: 3rem !important;
min-width: 8rem !important;
}
:host ::ng-deep .mat-tab-label.mat-tab-label-active {
border-bottom: 2px solid #0097a7;
box-sizing: border-box;
font-weight: 1200;
}
:host ::ng-deep .mat-ink-bar {
display: none !important;
}
.tabs {
width: 630px;
width: 80%;
}
.console {
@ -54,6 +75,10 @@
scrollbar-width: thin;
}
.xterm-console {
background: black;
}
.consoleInput {
width: 100%;
height: 30px;

33
src/app/components/project-map/console-wrapper/console-wrapper.component.ts
View File

@ -7,6 +7,7 @@ import { ThemeService } from '../../../services/theme.service';
import { FormControl } from '@angular/forms';
import { NodeConsoleService } from '../../../services/nodeConsole.service';
import { Node } from '../../../cartography/models/node';
import { MapSettingsService } from '../../../services/mapsettings.service';
@Component({
@ -24,15 +25,17 @@ export class ConsoleWrapperComponent implements OnInit {
public style: object = {};
public styleInside: object = { height: `120px` };
public isDraggingEnabled: boolean = false;
public isLightThemeEnabled: boolean = false;
public isMinimized: boolean = false;
public resizedWidth: number = 720;
public resizedHeight: number = 480;
constructor(
private consoleService: NodeConsoleService,
private themeService: ThemeService
private themeService: ThemeService,
private mapSettingsService: MapSettingsService
) {}
nodes: Node[] = [];
@ -55,9 +58,9 @@ export class ConsoleWrapperComponent implements OnInit {
minimize(value: boolean) {
this.isMinimized = value;
if (!value) {
this.style = { bottom: '20px', left: '20px', width: '720px', height: '460px'};
this.style = { bottom: '20px', left: '20px', width: `${this.resizedWidth}px`, height: `${this.resizedHeight}px`}
} else {
this.style = { bottom: '20px', left: '20px', width: '720px', height: '56px'};
this.style = { bottom: '20px', left: '20px', width: `${this.resizedWidth}px`, height: '56px'};
}
}
@ -113,8 +116,8 @@ export class ConsoleWrapperComponent implements OnInit {
if (
event.rectangle.width &&
event.rectangle.height &&
(event.rectangle.width < 720 ||
event.rectangle.height < 460)
(event.rectangle.width < 500 ||
event.rectangle.height < 100)
) {
return false;
}
@ -134,9 +137,25 @@ export class ConsoleWrapperComponent implements OnInit {
height: `${event.rectangle.height - 60}px`,
width: `${event.rectangle.width}px`
};
this.consoleService.consoleResized.next({
width: event.rectangle.width,
height: event.rectangle.height - 53
});
this.resizedWidth = event.rectangle.width;
this.resizedHeight = event.rectangle.height;
}
close() {
this.closeConsole.emit(false);
}
enableScroll(e) {
this.mapSettingsService.isScrollDisabled.next(false);
}
disableScroll(e) {
this.mapSettingsService.isScrollDisabled.next(true);
}
}

22
src/app/components/project-map/context-console-menu/context-console-menu.component.html Normal file
View File

@ -0,0 +1,22 @@
<div class="context-menu" [style.left]="leftPosition" [style.top]="topPosition">
<span [matMenuTriggerFor]="contextConsoleMenu"></span>
<mat-menu #contextConsoleMenu="matMenu" class="context-menu-items">
<span class="title">
Choose default behavior for double click on node
</span>
<button mat-menu-item (click)="openConsole()">
<mat-icon>web_asset</mat-icon>
<span>Open console</span>
</button>
<button mat-menu-item (click)="openWebConsole()">
<mat-icon>http</mat-icon>
<span>Open web console</span>
</button>
<button mat-menu-item (click)="openWebConsoleInNewTab()">
<mat-icon>http</mat-icon>
<span>Open web console in new tab</span>
</button>
</mat-menu>
</div>
<template [hidden]="true" #container></template>

12
src/app/components/project-map/context-console-menu/context-console-menu.component.scss Normal file
View File

@ -0,0 +1,12 @@
.context-menu {
position: absolute;
min-height: 0px;
}
.mat-menu-panel ng-trigger ng-trigger-transformMenu ng-tns-c7-5 context-menu-items mat-menu-after mat-menu-below ng-star-inserted mat-elevation-z4 {
min-height: 0px!important;
}
.title {
margin: 10px;
}

109
src/app/components/project-map/context-console-menu/context-console-menu.component.spec.ts Normal file
View File

@ -0,0 +1,109 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { BrowserModule } from '@angular/platform-browser';
import { ChangeDetectorRef, NO_ERRORS_SCHEMA } from '@angular/core';
import { ProjectService } from '../../../services/project.service';
import { MockedProjectService } from '../../projects/add-blank-project-dialog/add-blank-project-dialog.component.spec';
import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
import { Server } from '../../../models/server';
import { ElectronService } from 'ngx-electron';
import { ContextConsoleMenuComponent } from './context-console-menu.component';
import { MapSettingsService } from '../../../services/mapsettings.service';
import { NodeConsoleService } from '../../../services/nodeConsole.service';
import { ConsoleService } from '../../../services/settings/console.service';
import { ToasterService } from '../../../services/toaster.service';
import { MockedToasterService } from '../../../services/toaster.service.spec';
import { Router } from '@angular/router';
import { Node } from '../../../cartography/models/node';
import { ConsoleDeviceActionComponent } from '../context-menu/actions/console-device-action/console-device-action.component';
import { ConsoleDeviceActionBrowserComponent } from '../context-menu/actions/console-device-action-browser/console-device-action-browser.component';
fdescribe('ContextConsoleMenuComponent', () => {
let component: ContextConsoleMenuComponent;
let fixture: ComponentFixture<ContextConsoleMenuComponent>;
let toasterService: MockedToasterService = new MockedToasterService();
let router = {
url: '',
navigate: jasmine.createSpy('navigate')
};
let node = {
status: 'started'
};
let mapSettingsService = new MapSettingsService();
beforeEach(async(() => {
const electronMock = {
isElectronApp: true
};
TestBed.configureTestingModule({
imports: [MatMenuModule, BrowserModule],
providers: [
{ provide: ChangeDetectorRef },
{ provide: ProjectService, useClass: MockedProjectService },
{ provide: ElectronService, useValue: electronMock },
{ provide: MapSettingsService, useValue: mapSettingsService },
{ provide: NodeConsoleService },
{ provide: ConsoleService },
{ provide: ToasterService, useValue: toasterService },
{ provide: Router, useValue: router }
],
declarations: [
ContextConsoleMenuComponent,
ConsoleDeviceActionComponent,
ConsoleDeviceActionBrowserComponent
],
schemas: [NO_ERRORS_SCHEMA]
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ContextConsoleMenuComponent);
component = fixture.componentInstance;
component.server = {location: 'local'} as Server;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should define property if running in electron ', () => {
expect(component.isElectronApp).toBeTruthy();
});
it('should open menu if there is no default settings', () => {
let spy = spyOn(component.contextConsoleMenu, 'openMenu');
localStorage.removeItem('consoleContextMenu');
component.openMenu(node as unknown as Node, 0, 0);
expect(spy.calls.any()).toBeTruthy();
});
it('should call open web console when web console action in settings', () => {
let spy = spyOn(component, 'openWebConsole');
mapSettingsService.setConsoleContextMenuAction('web console');
component.openMenu(node as unknown as Node, 0, 0);
expect(spy.calls.any()).toBeTruthy();
});
it('should call open web console in new tab when web console in new tab action in settings', () => {
let spy = spyOn(component, 'openWebConsoleInNewTab');
mapSettingsService.setConsoleContextMenuAction('web console in new tab');
component.openMenu(node as unknown as Node, 0, 0);
expect(spy.calls.any()).toBeTruthy();
});
it('should call open console when console action in settings', () => {
let spy = spyOn(component, 'openConsole');
mapSettingsService.setConsoleContextMenuAction('console');
component.openMenu(node as unknown as Node, 0, 0);
expect(spy.calls.any()).toBeTruthy();
});
});

112
src/app/components/project-map/context-console-menu/context-console-menu.component.ts Normal file
View File

@ -0,0 +1,112 @@
import { ChangeDetectorRef, Component, ComponentFactory, ComponentRef, Input, OnInit, ViewChild, ViewContainerRef } from '@angular/core';
import { MatMenuTrigger } from '@angular/material/menu';
import { DomSanitizer } from '@angular/platform-browser';
import { Node } from '../../../cartography/models/node';
import { Server } from '../../../models/server';
import { Project } from '../../../models/project';
import { MapSettingsService } from '../../../services/mapsettings.service';
import { ElectronService } from 'ngx-electron';
import { NodeConsoleService } from '../../../services/nodeConsole.service';
import { ToasterService } from '../../../services/toaster.service';
import { Router } from '@angular/router';
import { ComponentFactoryResolver } from '@angular/core';
import { ConsoleDeviceActionComponent } from '../context-menu/actions/console-device-action/console-device-action.component';
import { ConsoleDeviceActionBrowserComponent } from '../context-menu/actions/console-device-action-browser/console-device-action-browser.component';
@Component({
selector: 'app-context-console-menu',
templateUrl: './context-console-menu.component.html',
styleUrls: ['./context-console-menu.component.scss']
})
export class ContextConsoleMenuComponent implements OnInit {
@Input() project: Project;
@Input() server: Server;
@ViewChild(MatMenuTrigger) contextConsoleMenu: MatMenuTrigger;
@ViewChild("container", { read: ViewContainerRef }) container;
componentRef: ComponentRef<ConsoleDeviceActionComponent>;
componentBrowserRef: ComponentRef<ConsoleDeviceActionBrowserComponent>;
topPosition;
leftPosition;
isElectronApp = false;
node: Node;;
constructor(
private sanitizer: DomSanitizer,
private changeDetector: ChangeDetectorRef,
private mapSettingsService: MapSettingsService,
private electronService: ElectronService,
private consoleService: NodeConsoleService,
private toasterService: ToasterService,
private router: Router,
private resolver: ComponentFactoryResolver
) {}
ngOnInit() {
this.setPosition(0, 0);
this.isElectronApp = this.electronService.isElectronApp;
}
public setPosition(top: number, left: number) {
this.topPosition = this.sanitizer.bypassSecurityTrustStyle(top + 'px');
this.leftPosition = this.sanitizer.bypassSecurityTrustStyle(left + 'px');
this.changeDetector.detectChanges();
}
public openMenu(node: Node, top: number, left: number) {
this.node = node;
let action = this.mapSettingsService.getConsoleContextManuAction();
if (action) {
if (action === 'web console') {
this.openWebConsole();
} else if (action === 'web console in new tab') {
this.openWebConsoleInNewTab();
} else if (action === 'console') {
this.openConsole();
}
} else {
this.setPosition(top, left);
this.contextConsoleMenu.openMenu();
}
}
openConsole() {
this.mapSettingsService.setConsoleContextMenuAction('console');
if (this.isElectronApp) {
const factory: ComponentFactory<ConsoleDeviceActionComponent> = this.resolver.resolveComponentFactory(ConsoleDeviceActionComponent);
this.componentRef = this.container.createComponent(factory);
this.componentRef.instance.server = this.server;
this.componentRef.instance.nodes = [this.node];
this.componentRef.instance.console();
} else {
const factory: ComponentFactory<ConsoleDeviceActionBrowserComponent> = this.resolver.resolveComponentFactory(ConsoleDeviceActionBrowserComponent);
this.componentBrowserRef = this.container.createComponent(factory);
this.componentBrowserRef.instance.server = this.server;
this.componentBrowserRef.instance.node = this.node;
this.componentBrowserRef.instance.openConsole();
}
}
openWebConsole() {
this.mapSettingsService.setConsoleContextMenuAction('web console');
if (this.node.status === 'started') {
this.mapSettingsService.logConsoleSubject.next(true);
this.consoleService.openConsoleForNode(this.node);
} else {
this.toasterService.error('To open console please start the node');
}
}
openWebConsoleInNewTab() {
this.mapSettingsService.setConsoleContextMenuAction('web console in new tab');
if (this.node.status === 'started') {
let url = this.router.url.split('/');
let urlString = `/static/web-ui/${url[1]}/${url[2]}/${url[3]}/${url[4]}/nodes/${this.node.node_id}`
window.open(urlString);
} else {
this.toasterService.error('To open console please start the node');
}
}
}

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

@ -1,6 +1,9 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { BringToFrontActionComponent } from './bring-to-front-action.component';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MockedDrawingService, MockedDrawingsDataSource, MockedNodesDataSource, MockedNodeService } from '../../../project-map.component.spec';

12
src/app/components/project-map/context-menu/actions/console-device-action-browser/console-device-action-browser.component.ts
View File

@ -33,12 +33,12 @@ export class ConsoleDeviceActionBrowserComponent {
this.node.console_host = this.server.host;
}
if (this.node.console_type === "telnet") {
location.assign(`gns3+telnet://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`);
} else if (this.node.console_type === "vnc") {
location.assign(`gns3+vnc://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`);
} else if(this.node.console_type === "spice") {
location.assign(`gns3+spice://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`);
if (this.node.console_type === "telnet" || this.node.console_type === "vnc" || this.node.console_type === "spice") {
try {
location.assign(`gns3+${this.node.console_type}://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`);
} catch (e) {
this.toasterService.error(e);
}
} else {
this.toasterService.error("Supported console types: telnet, vnc, spice.");
}

2
src/app/components/project-map/context-menu/actions/console-device-action/console-device-action.component.spec.ts
View File

@ -1,5 +1,5 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatIconModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { ElectronService } from 'ngx-electron';
import { ConsoleDeviceActionComponent } from './console-device-action.component';

3
src/app/components/project-map/context-menu/actions/delete-action/delete-action.component.spec.ts
View File

@ -1,6 +1,7 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { DeleteActionComponent } from './delete-action.component';
import { MatIconModule, MatMenuModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource';
import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource';

3
src/app/components/project-map/context-menu/actions/duplicate-action/duplicate-action.component.spec.ts
View File

@ -1,5 +1,6 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatIconModule, MatMenuModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource';
import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource';

2
src/app/components/project-map/context-menu/actions/start-node-action/start-node-action.component.ts
View File

@ -25,7 +25,7 @@ export class StartNodeActionComponent implements OnInit, OnChanges {
if(changes.nodes) {
this.isNodeWithStoppedStatus = false;
this.nodes.forEach((node) => {
if (node.status === 'stopped') {
if (node.status === 'stopped' || node.status === 'suspended') {
this.isNodeWithStoppedStatus = true;
}
});

2
src/app/components/project-map/context-menu/context-menu.component.scss
View File

@ -5,4 +5,4 @@
.mat-menu-panel ng-trigger ng-trigger-transformMenu ng-tns-c7-5 context-menu-items mat-menu-after mat-menu-below ng-star-inserted mat-elevation-z4 {
min-height: 0px!important;
}
}

2
src/app/components/project-map/context-menu/context-menu.component.spec.ts
View File

@ -4,7 +4,7 @@ import { BrowserModule } from '@angular/platform-browser';
import { ChangeDetectorRef, NO_ERRORS_SCHEMA } from '@angular/core';
import { ProjectService } from '../../../services/project.service';
import { MockedProjectService } from '../../projects/add-blank-project-dialog/add-blank-project-dialog.component.spec';
import { MatMenuModule, MatMenuTrigger } from '@angular/material';
import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
import { Drawing } from '../../../cartography/models/drawing';
import { RectElement } from '../../../cartography/models/drawings/rect-element';
import { TextElement } from '../../../cartography/models/drawings/text-element';

8
src/app/components/project-map/log-console/log-console.component.spec.ts
View File

@ -1,7 +1,7 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { BrowserModule } from '@angular/platform-browser';
import { NO_ERRORS_SCHEMA, EventEmitter, inject } from '@angular/core';
import { MatMenuModule } from '@angular/material';
import { MatMenuModule } from '@angular/material/menu';
import { Server } from '../../../models/server';
import { LogConsoleComponent } from './log-console.component';
import { ProjectWebServiceHandler, WebServiceMessage } from '../../../handlers/project-web-service-handler';
@ -13,6 +13,7 @@ import { LogEventsDataSource } from './log-events-datasource';
import { HttpServer, ServerErrorHandler } from '../../../services/http-server.service';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { HttpClient } from '@angular/common/http';
import { NodeConsoleService } from '../../../services/nodeConsole.service';
export class MockedProjectWebServiceHandler {
public nodeNotificationEmitter = new EventEmitter<WebServiceMessage>();
@ -41,7 +42,8 @@ describe('LogConsoleComponent', () => {
{ provide: NodeService, useValue: mockedNodeService },
{ provide: NodesDataSource, useValue: mockedNodesDataSource },
{ provide: LogEventsDataSource, useClass: LogEventsDataSource },
{ provide: HttpServer, useValue: httpServer }
{ provide: HttpServer, useValue: httpServer },
{ provide: NodeConsoleService }
],
declarations: [LogConsoleComponent],
schemas: [NO_ERRORS_SCHEMA]
@ -74,7 +76,7 @@ describe('LogConsoleComponent', () => {
component.handleCommand();
expect(component.showMessage).toHaveBeenCalledWith({type: 'command', message: 'Current version: 2020.2.0-beta.1'});
expect(component.showMessage).toHaveBeenCalledWith({type: 'command', message: 'Current version: 2020.3.0-beta.4'});
});
it('should call show message when unknown command entered', () => {

10
src/app/components/project-map/log-console/log-console.component.ts
View File

@ -16,6 +16,7 @@ import { ResizeEvent } from 'angular-resizable-element';
import { ThemeService } from '../../../services/theme.service';
import { FormControl } from '@angular/forms';
import { version } from '../../../version';
import { NodeConsoleService } from '../../../services/nodeConsole.service';
@Component({
@ -63,10 +64,17 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {
private logEventsDataSource: LogEventsDataSource,
private httpService: HttpServer,
private themeService: ThemeService,
private cd: ChangeDetectorRef
private cd: ChangeDetectorRef,
private nodeConsoleService: NodeConsoleService,
private changeDetectorRef: ChangeDetectorRef
) {}
ngOnInit() {
this.nodeConsoleService.consoleResized.subscribe(ev => {
this.style = { bottom: '20px', left: '20px', width: `${ev.width}px`, height: `${ev.height - 70}px`};
this.changeDetectorRef.detectChanges();
});
this.themeService.getActualTheme() === 'light' ? this.isLightThemeEnabled = true : this.isLightThemeEnabled = false
this.style = { bottom: '20px', left: '20px', width: '720px', height: '340px'};

16
src/app/components/project-map/new-template-dialog/new-template-dialog.component.html
View File

@ -106,6 +106,7 @@
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button [hidden]="action!=='install'" (click)="updateAppliances()">Update from online registry</button>
<button mat-button (click)="onCloseClick()">Cancel</button>
</div>
</mat-step>
@ -139,7 +140,10 @@
</mat-select>
</div>
<div>
Install required files <br/>
Install required files
<button mat-icon-button matTooltip="Refresh list of images" matTooltipClass="custom-tooltip" (click)="refreshImages()">
<mat-icon aria-label="Refresh list of images">refresh</mat-icon>
</button><br/>
<div>
<div *ngFor="let version of applianceToInstall.versions">
<div class="list-item">
@ -216,7 +220,10 @@
</mat-radio-group>
</div>
<div>
Install required files
Install required files
<button mat-icon-button matTooltip="Refresh list of images" matTooltipClass="custom-tooltip" (click)="refreshImages()">
<mat-icon aria-label="Refresh list of images">refresh</mat-icon>
</button><br/>
<mat-list>
<mat-list-item *ngFor="let image of applianceToInstall.images">
<div class="list-item">
@ -249,7 +256,10 @@
</mat-radio-group>
</div>
<div>
Install required files
Install required files
<button mat-icon-button matTooltip="Refresh list of images" matTooltipClass="custom-tooltip" (click)="refreshImages()">
<mat-icon aria-label="Refresh list of images">refresh</mat-icon>
</button><br/>
<mat-list>
<mat-list-item *ngFor="let image of applianceToInstall.images">
<div class="list-item">

247
src/app/components/project-map/new-template-dialog/new-template-dialog.component.ts
View File

@ -27,6 +27,9 @@ import { IouTemplate } from '../../../models/templates/iou-template';
import { TemplateService } from '../../../services/template.service';
import { Template } from '../../../models/template';
import { ComputeService } from '../../../services/compute.service';
import { InformationDialogComponent } from '../../../components/dialogs/information-dialog.component';
import { ProgressService } from '../../../common/progress/progress.service';
import { TemplateNameDialogComponent } from './template-name-dialog/template-name-dialog.component';
@Component({
selector: 'app-new-template-dialog',
@ -76,6 +79,8 @@ export class NewTemplateDialogComponent implements OnInit {
private iosImages: Image[] = [];
private iouImages: Image[] = [];
private templates: Template[] = [];
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
@ViewChild('stepper', {static: true}) stepper: MatStepper;
@ -90,10 +95,16 @@ export class NewTemplateDialogComponent implements OnInit {
private iouService: IouService,
private templateService: TemplateService,
public dialog: MatDialog,
private computeService: ComputeService
private computeService: ComputeService,
private changeDetectorRef: ChangeDetectorRef,
private progressService: ProgressService
) {}
ngOnInit() {
this.templateService.list(this.server).subscribe((templates) => {
this.templates = templates;
});
this.computeService.getComputes(this.server).subscribe((computes) => {
computes.forEach(compute => {
if (compute.compute_id === 'vm') {
@ -154,13 +165,42 @@ export class NewTemplateDialogComponent implements OnInit {
this.uploaderImage.onErrorItem = (item: FileItem, response: string, status: number, headers: ParsedResponseHeaders) => {
this.toasterService.error('An error has occured');
this.progressService.deactivate();
};
this.uploaderImage.onSuccessItem = (item: FileItem, response: string, status: number, headers: ParsedResponseHeaders) => {
this.toasterService.success('Image imported succesfully');
this.refreshImages();
this.progressService.deactivate();
};
}
updateAppliances() {
this.progressService.activate();
this.applianceService.updateAppliances(this.server).subscribe((appliances) => {
this.appliances = appliances;
this.progressService.deactivate();
this.toasterService.success('Appliances are up-to-date.');
}, error => {
this.progressService.deactivate();
this.toasterService.error('Appliances were not updated correctly.');
});
}
refreshImages() {
this.qemuService.getImages(this.server).subscribe((qemuImages) => {
this.qemuImages = qemuImages;
});
this.iosService.getImages(this.server).subscribe((iosImages) => {
this.iosImages = iosImages;
});
this.iouService.getImages(this.server).subscribe((iouImages) => {
this.iouImages = iouImages;
});
}
getAppliance(url: string) {
let str = url.split('/v2');
let appliancePath = str[str.length-1];
@ -257,6 +297,30 @@ export class NewTemplateDialogComponent implements OnInit {
this.applianceToInstall = object;
setTimeout(() => {
this.stepper.next();
if (this.applianceToInstall.qemu) {
setTimeout(() => {
if (this.qemuBinaries.length) {
if (this.applianceToInstall.qemu.arch === 'x86_64') {
let filtered_binaries = this.qemuBinaries.filter(n => n.path.includes('qemu-system-x86_64'));
if (filtered_binaries.length) {
this.selectedBinary = filtered_binaries[0];
}
} else if (this.applianceToInstall.qemu.arch === 'i386') {
let filtered_binaries = this.qemuBinaries.filter(n => n.path.includes('qemu-system-i386'));
if (filtered_binaries.length) {
this.selectedBinary = filtered_binaries[0];
}
} else if (this.applianceToInstall.qemu.arch === 'x86_64') {
let filtered_binaries = this.qemuBinaries.filter(n => n.path.includes('qemu-system-arm'));
if (filtered_binaries.length) {
this.selectedBinary = filtered_binaries[0];
}
} else {
this.selectedBinary = this.qemuBinaries[0];
}
}
}, 100);
}
}, 100);
}
@ -287,42 +351,64 @@ export class NewTemplateDialogComponent implements OnInit {
(itemToUpload as any).options.disableMultipart = true;
this.uploaderImage.uploadItem(itemToUpload);
this.progressService.activate();
};
fileReader.readAsText(file);
}
checkImage(image: Image): boolean {
if (this.applianceToInstall.qemu) {
if (this.qemuImages.filter(n => n.filename === image.filename).length > 0) return true;
} else if (this.applianceToInstall.dynamips) {
if (this.iosImages.filter(n => n.filename === image.filename).length > 0) return true;
} else if (this.applianceToInstall.iou) {
if (this.iouImages.filter(n => n.filename === image.filename).length > 0) return true;
}
return false;
}
checkImageFromVersion(image: string): boolean {
let imageToInstall = this.applianceToInstall.images.filter(n => n.filename === image)[0];
if (this.applianceToInstall.qemu) {
if (this.qemuImages.filter(n => n.filename === image).length > 0) return true;
if (this.qemuImages.filter(n => n.md5sum === imageToInstall.md5sum).length > 0) return true;
} else if (this.applianceToInstall.dynamips) {
if (this.iosImages.filter(n => n.filename === image).length > 0) return true;
if (this.iosImages.filter(n => n.md5sum === imageToInstall.md5sum).length > 0) return true;
} else if (this.applianceToInstall.iou) {
if (this.iouImages.filter(n => n.filename === image).length > 0) return true;
if (this.iouImages.filter(n => n.md5sum === imageToInstall.md5sum).length > 0) return true;
}
return false;
}
checkImages(version: Version): boolean {
if (this.checkImageFromVersion(version.images.hda_disk_image) && this.checkImageFromVersion(version.images.hdb_disk_image)) return true;
if (version.images.hdb_disk_image) {
if (this.checkImageFromVersion(version.images.hda_disk_image) && this.checkImageFromVersion(version.images.hdb_disk_image)) return true;
}
if (this.checkImageFromVersion(version.images.hda_disk_image)) return true;
return false;
}
openConfirmationDialog(message: string, link: string) {
const dialogRef = this.dialog.open(InformationDialogComponent, {
width: '400px',
height: '200px',
autoFocus: false,
disableClose: true
});
dialogRef.componentInstance.confirmationMessage = message;
dialogRef.afterClosed().subscribe((answer: boolean) => {
if (answer) {
window.open(link);
}
});
}
downloadImage(image: Image) {
window.open(image.download_url);
const directDownloadMessage: string = "Download will redirect you where the required file can be downloaded, you may have to be registered with the vendor in order to download the file.";
const compressionMessage: string = `The file is compressed with ${image.compression}, it must be uncompressed first.`;
if (image.direct_download_url) {
if (image.compression) {
this.openConfirmationDialog(compressionMessage, image.direct_download_url);
} else {
window.open(image.direct_download_url);
}
} else {
this.openConfirmationDialog(directDownloadMessage, image.download_url);
}
}
downloadImageFromVersion(image: string) {
@ -331,16 +417,22 @@ export class NewTemplateDialogComponent implements OnInit {
});
}
getCategory() {
if (this.applianceToInstall.category === 'multilayer_switch') {
return 'switch';
}
return this.applianceToInstall.category;
}
createIouTemplate (image: Image) {
let iouTemplate: IouTemplate = new IouTemplate();
iouTemplate.name = this.applianceToInstall.name;
iouTemplate.nvram = this.applianceToInstall.iou.nvram;
iouTemplate.ram = this.applianceToInstall.iou.ram;
iouTemplate.ethernet_adapters = this.applianceToInstall.iou.ethernet_adapters;
iouTemplate.serial_adapters = this.applianceToInstall.iou.serial_adapters;
iouTemplate.startup_config = this.applianceToInstall.iou.startup_config;
iouTemplate.builtin = this.applianceToInstall.builtin;
iouTemplate.category = this.applianceToInstall.category;
iouTemplate.category = this.getCategory();
iouTemplate.default_name_format = this.applianceToInstall.port_name_format;
iouTemplate.symbol = this.applianceToInstall.symbol;
iouTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
@ -348,16 +440,33 @@ export class NewTemplateDialogComponent implements OnInit {
iouTemplate.path = image.filename;
iouTemplate.template_type = 'iou';
this.iouService.addTemplate(this.server, iouTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template);
this.toasterService.success('Template added');
this.dialogRef.close();
const dialogRef = this.dialog.open(TemplateNameDialogComponent, {
width: '400px',
height: '250px',
autoFocus: false,
disableClose: true,
data: {
name: this.applianceToInstall.name
}
});
dialogRef.componentInstance.server = this.server;
dialogRef.afterClosed().subscribe((answer: string) => {
if (answer) {
iouTemplate.name = answer;
this.iouService.addTemplate(this.server, iouTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template);
this.toasterService.success('Template added');
this.dialogRef.close();
});
} else{
return false;
}
});
}
createIosTemplate(image: Image) {
let iosTemplate: IosTemplate = new IosTemplate();
iosTemplate.name = this.applianceToInstall.name;
iosTemplate.chassis = this.applianceToInstall.dynamips.chassis;
iosTemplate.nvram = this.applianceToInstall.dynamips.nvram;
iosTemplate.platform = this.applianceToInstall.dynamips.platform;
@ -372,7 +481,7 @@ export class NewTemplateDialogComponent implements OnInit {
iosTemplate.slot6 = this.applianceToInstall.dynamips.slot6;
iosTemplate.slot7 = this.applianceToInstall.dynamips.slot7;
iosTemplate.builtin = this.applianceToInstall.builtin;
iosTemplate.category = this.applianceToInstall.category;
iosTemplate.category = this.getCategory();
iosTemplate.default_name_format = this.applianceToInstall.port_name_format;
iosTemplate.symbol = this.applianceToInstall.symbol;
iosTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
@ -380,20 +489,37 @@ export class NewTemplateDialogComponent implements OnInit {
iosTemplate.image = image.filename;
iosTemplate.template_type = 'dynamips';
this.iosService.addTemplate(this.server, iosTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template as any as Template);
this.toasterService.success('Template added');
this.dialogRef.close();
const dialogRef = this.dialog.open(TemplateNameDialogComponent, {
width: '400px',
height: '250px',
autoFocus: false,
disableClose: true,
data: {
name: this.applianceToInstall.name
}
});
dialogRef.componentInstance.server = this.server;
dialogRef.afterClosed().subscribe((answer: string) => {
if (answer) {
iosTemplate.name = answer;
this.iosService.addTemplate(this.server, iosTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template as any as Template);
this.toasterService.success('Template added');
this.dialogRef.close();
});
} else{
return false;
}
});
}
createDockerTemplate() {
let dockerTemplate: DockerTemplate = new DockerTemplate();
dockerTemplate.name = this.applianceToInstall.name;
dockerTemplate.adapters = this.applianceToInstall.docker.adapters;
dockerTemplate.console_type = this.applianceToInstall.docker.console_type;
dockerTemplate.builtin = this.applianceToInstall.builtin;
dockerTemplate.category = this.applianceToInstall.category;
dockerTemplate.category = this.getCategory();
dockerTemplate.default_name_format = this.applianceToInstall.port_name_format;
dockerTemplate.symbol = this.applianceToInstall.symbol;
dockerTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
@ -401,10 +527,28 @@ export class NewTemplateDialogComponent implements OnInit {
dockerTemplate.image = this.applianceToInstall.docker.image;
dockerTemplate.template_type = 'docker';
this.dockerService.addTemplate(this.server, dockerTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template as any as Template);
this.toasterService.success('Template added');
this.dialogRef.close();
const dialogRef = this.dialog.open(TemplateNameDialogComponent, {
width: '400px',
height: '250px',
autoFocus: false,
disableClose: true,
data: {
name: this.applianceToInstall.name
}
});
dialogRef.componentInstance.server = this.server;
dialogRef.afterClosed().subscribe((answer: string) => {
if (answer) {
dockerTemplate.name = answer;
this.dockerService.addTemplate(this.server, dockerTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template as any as Template);
this.toasterService.success('Template added');
this.dialogRef.close();
});
} else{
return false;
}
});
}
@ -418,8 +562,8 @@ export class NewTemplateDialogComponent implements OnInit {
this.toasterService.error('Please select QEMU binary first');
return;
}
let qemuTemplate: QemuTemplate = new QemuTemplate();
qemuTemplate.name = this.applianceToInstall.name;
qemuTemplate.ram = this.applianceToInstall.qemu.ram;
qemuTemplate.adapters = this.applianceToInstall.qemu.adapters;
qemuTemplate.adapter_type = this.applianceToInstall.qemu.adapter_type;
@ -430,7 +574,7 @@ export class NewTemplateDialogComponent implements OnInit {
qemuTemplate.hdc_disk_interface = this.applianceToInstall.qemu.hdc_disk_interface;
qemuTemplate.hdd_disk_interface = this.applianceToInstall.qemu.hdd_disk_interface;
qemuTemplate.builtin = this.applianceToInstall.builtin;
qemuTemplate.category = this.applianceToInstall.category;
qemuTemplate.category = this.getCategory();
qemuTemplate.first_port_name = this.applianceToInstall.first_port_name;
qemuTemplate.port_name_format = this.applianceToInstall.port_name_format;
qemuTemplate.symbol = this.applianceToInstall.symbol;
@ -442,10 +586,29 @@ export class NewTemplateDialogComponent implements OnInit {
qemuTemplate.template_type = 'qemu';
qemuTemplate.usage = this.applianceToInstall.usage;
this.qemuService.addTemplate(this.server, qemuTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template as any as Template);
this.toasterService.success('Template added');
this.dialogRef.close();
const dialogRef = this.dialog.open(TemplateNameDialogComponent, {
width: '400px',
height: '250px',
autoFocus: false,
disableClose: true,
data: {
name: this.applianceToInstall.name
}
});
dialogRef.componentInstance.server = this.server;
dialogRef.afterClosed().subscribe((answer: string) => {
if (answer) {
qemuTemplate.name = answer;
this.qemuService.addTemplate(this.server, qemuTemplate).subscribe((template) => {
this.templateService.newTemplateCreated.next(template as any as Template);
this.toasterService.success('Template added');
this.dialogRef.close();
});
} else{
return false;
}
});
}
}

26
src/app/components/project-map/new-template-dialog/template-name-dialog/template-name-dialog.component.html Normal file
View File

@ -0,0 +1,26 @@
<h1 mat-dialog-title>Please enter name for the new template</h1>
<form [formGroup]="templateNameForm" class="file-name-form">
<mat-form-field class="file-name-form-field">
<input
matInput
(keydown)="onKeyDown($event)"
type="text"
formControlName="templateName"
[ngClass]="{ 'is-invalid': form.templateName?.errors }"
placeholder="Template name"
/>
<mat-error *ngIf="form.templateName?.touched && form.templateName?.errors && form.templateName?.errors.required"
>Template name is required</mat-error
>
<mat-error *ngIf="form.templateName?.errors && form.templateName?.errors.invalidName"
>Template name is incorrect</mat-error
>
<mat-error *ngIf="form.templateName?.errors && form.templateName?.errors.templateExist"
>Template with this name exists</mat-error
>
</mat-form-field>
<div mat-dialog-actions>
<button mat-button (click)="onNoClick()" color="accent">Cancel</button>
<button mat-button (click)="onAddClick()" tabindex="2" class="add-project-button" mat-raised-button color="primary">Add template</button>
</div>
</form>

7
src/app/components/project-map/new-template-dialog/template-name-dialog/template-name-dialog.component.scss Normal file
View File

@ -0,0 +1,7 @@
.file-name-form-field {
width: 100%;
}
.project-snackbar {
background: #2196F3;
}

76
src/app/components/project-map/new-template-dialog/template-name-dialog/template-name-dialog.component.ts Normal file
View File

@ -0,0 +1,76 @@
import { Component, OnInit, EventEmitter, Inject } from '@angular/core';
import { Router } from '@angular/router';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
import { Server } from '../../../../models/server';
import { v4 as uuid } from 'uuid';
import { ProjectNameValidator } from '../../../projects/models/projectNameValidator';
import { ToasterService } from '../../../../services/toaster.service';
import { TemplateService } from '../../../../services/template.service';
import { templateNameAsyncValidator } from '../../../../validators/template-name-async-validator';
import { Template } from '../../../../models/template';
@Component({
selector: 'app-template-name-dialog',
templateUrl: './template-name-dialog.component.html',
styleUrls: ['./template-name-dialog.component.scss'],
providers: [ProjectNameValidator]
})
export class TemplateNameDialogComponent implements OnInit {
server: Server;
templateNameForm: FormGroup;
constructor(
public dialogRef: MatDialogRef<TemplateNameDialogComponent>,
private router: Router,
private dialog: MatDialog,
private toasterService: ToasterService,
private formBuilder: FormBuilder,
private templateNameValidator: ProjectNameValidator,
private templateService: TemplateService,
@Inject(MAT_DIALOG_DATA) public data: any
) {}
ngOnInit() {
let name = this.data['name'];
this.templateNameForm = this.formBuilder.group({
templateName: new FormControl(name, [Validators.required, this.templateNameValidator.get], [templateNameAsyncValidator(this.server, this.templateService)])
});
setTimeout(() => {
this.templateNameForm.controls['templateName'].markAsTouched();
}, 100);
}
get form() {
return this.templateNameForm.controls;
}
onAddClick(): void {
if (this.templateNameForm.invalid) {
this.toasterService.error('Please enter correct name for new template');
return;
}
this.templateService.list(this.server).subscribe((templates: Template[]) => {
const templateName = this.templateNameForm.controls['templateName'].value;
let existingProject = templates.find(t => t.name === templateName);
if (existingProject) {
this.toasterService.error('Template with this name exists');
} else {
this.dialogRef.close(this.templateNameForm.controls['templateName'].value);
}
});
}
onNoClick(): void {
this.dialogRef.close();
}
onKeyDown(event) {
if (event.key === "Enter") {
this.onAddClick();
}
}
}

14
src/app/components/project-map/node-editors/config-editor/config-editor.component.spec.ts
View File

@ -1,13 +1,9 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Server } from '../../../../models/server';
import {
MatDialogModule,
MatFormFieldModule,
MatDialogRef,
MAT_DIALOG_DATA,
MatSnackBarModule,
MatTabsModule
} from '@angular/material';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatTabsModule } from '@angular/material/tabs';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ToasterService } from '../../../../services/toaster.service';
import { of } from 'rxjs/internal/observable/of';
@ -42,7 +38,7 @@ describe('ConfigEditorDialogComponent', () => {
],
providers: [
{ provide: MatDialogRef, useValue: dialogRef },
{ provide: MAT_DIALOG_DATA },
{ provide: MAT_DIALOG_DATA, useValue: [] },
{ provide: NodeService, useValue: mockedNodeService },
{ provide: ToasterService, useValue: toaster }
],

34
src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.html
View File

@ -11,17 +11,26 @@
<input matInput formControlName="name" type="text" [(ngModel)]="node.name" placeholder="Name">
</mat-form-field>
<mat-form-field class="form-field">
<input matInput formControlName="startCommand" type="text" [(ngModel)]="node.properties.start_command" placeholder="Start command">
</mat-form-field>
<mat-form-field class="form-field">
<input formControlName="adapter" matInput type="number" [(ngModel)]="node.properties.adapters" placeholder="Adapters">
</mat-form-field>
<mat-form-field class="form-field">
<input formControlName="memory" matInput type="number" [(ngModel)]="node.properties.memory" placeholder="Maximum memory">
<span matSuffix>MB</span>
</mat-form-field>
<mat-form-field class="form-field">
<input formControlName="cpus" matInput type="number" [(ngModel)]="node.properties.cpus" placeholder="Maximum CPUs">
</mat-form-field>
<button mat-button class="form-field" (click)="configureCustomAdapters()">
Configure custom adapters
</button>
<mat-form-field class="select">
<mat-select [ngModelOptions]="{standalone: true}" placeholder="Console type" [(ngModel)]="node.console_type">
@ -33,6 +42,26 @@
<mat-checkbox [ngModelOptions]="{standalone: true}" [(ngModel)]="node.console_auto_start">
Auto start console
</mat-checkbox>
<mat-form-field class="form-field">
<mat-select [ngModelOptions]="{standalone: true}" placeholder="VNC console resolution" [(ngModel)]="node.properties.console_resolution">
<mat-option *ngFor="let resolution of consoleResolutions" [value]="resolution">
{{resolution}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="form-field">
<input formControlName="consoleHttpPort" matInput type="number" [(ngModel)]="node.properties.console_http_port" placeholder="HTTP port in the container">
</mat-form-field>
<mat-form-field class="form-field">
<input matInput formControlName="consoleHttpPath" type="text" [(ngModel)]="node.properties.console_http_path" placeholder="HTTP path">
</mat-form-field>
<button mat-button class="form-field" (click)="editNetworkConfiguration()">
Edit network configuration
</button>
</form>
<h6>Environment</h6>
<mat-form-field class="form-field">
@ -44,6 +73,11 @@
<h6>Extra hosts</h6>
<mat-form-field class="form-field">
<textarea matInput type="text" [(ngModel)]="node.properties.extra_hosts"></textarea>
</mat-form-field><br/>
<h6>Additional directories</h6>
<mat-form-field class="form-field">
<textarea matInput type="text" [(ngModel)]="node.properties.extra_volumes"></textarea>
</mat-form-field>
</mat-tab>

50
src/app/components/project-map/node-editors/configurator/docker/configurator-docker.component.ts
View File

@ -4,8 +4,11 @@ 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/dialog';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { DockerConfigurationService } from '../../../../../services/docker-configuration.service';
import { NonNegativeValidator } from '../../../../../validators/non-negative-validator';
import { EditNetworkConfigurationDialogComponent } from './edit-network-configuration/edit-network-configuration.component';
import { ConfigureCustomAdaptersDialogComponent } from './configure-custom-adapters/configure-custom-adapters.component';
@Component({
@ -19,19 +22,39 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
name: string;
generalSettingsForm: FormGroup;
consoleTypes: string[] = [];
consoleResolutions: string[] = [
'640x480',
'800x600',
'1024x768',
'1280x800',
'1280x1024',
'1366x768',
'1920x1080'
];
private conf = {
autoFocus: false,
width: '800px',
disableClose: true
};
dialogRef;
constructor(
public dialogRef: MatDialogRef<ConfiguratorDialogDockerComponent>,
public dialogReference: MatDialogRef<ConfiguratorDialogDockerComponent>,
public nodeService: NodeService,
private toasterService: ToasterService,
private formBuilder: FormBuilder,
private dockerConfigurationService: DockerConfigurationService
private dockerConfigurationService: DockerConfigurationService,
private nonNegativeValidator: NonNegativeValidator,
private dialog: MatDialog
) {
this.generalSettingsForm = this.formBuilder.group({
name: new FormControl('', Validators.required),
adapter: new FormControl('', Validators.required),
memory: new FormControl(''),
cpus: new FormControl('')
memory: new FormControl('', nonNegativeValidator.get),
cpus: new FormControl('', nonNegativeValidator.get),
startCommand: new FormControl('', Validators.required),
consoleHttpPort: new FormControl('', Validators.required),
consoleHttpPath: new FormControl('', Validators.required)
});
}
@ -40,6 +63,7 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
this.node = node;
this.name = node.name;
this.getConfiguration();
if (!this.node.properties.cpus) this.node.properties.cpus = 0.0;
});
}
@ -47,6 +71,20 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
this.consoleTypes = this.dockerConfigurationService.getConsoleTypes();
}
configureCustomAdapters() {
this.dialogRef = this.dialog.open(ConfigureCustomAdaptersDialogComponent, this.conf);
let instance = this.dialogRef.componentInstance;
instance.server = this.server;
instance.node = this.node;
}
editNetworkConfiguration() {
this.dialogRef = this.dialog.open(EditNetworkConfigurationDialogComponent, this.conf);
let instance = this.dialogRef.componentInstance;
instance.server = this.server;
instance.node = this.node;
}
onSaveClick() {
if (this.generalSettingsForm.valid) {
this.nodeService.updateNode(this.server, this.node).subscribe(() => {
@ -59,6 +97,6 @@ export class ConfiguratorDialogDockerComponent implements OnInit {
}
onCancelClick() {
this.dialogRef.close();
this.dialogReference.close();
}
}

32
src/app/components/project-map/node-editors/configurator/docker/configure-custom-adapters/configure-custom-adapters.component.html Normal file
View File

@ -0,0 +1,32 @@
<h1 mat-dialog-title>Configure custom adapters for node {{node.name}}</h1>
<div *ngIf="node" class="modal-form-container">
<div class="header">
<span class="column">
Adapter number
</span>
<span class="column">
Port name
</span>
</div>
<div>
<mat-list>
<mat-list-item *ngFor="let adapter of adapters; index as i">
<div class="header">
<span class="column">
Adapter {{adapter.adapter_number}}
</span>
<span class="column">
<input matInput type="text" [(ngModel)]="adapter.port_name" placeholder="Edit port name">
</span>
</div>
</mat-list-item>
</mat-list>
</div>
</div>
<div mat-dialog-actions>
<button mat-button (click)="onCancelClick()" color="accent">Cancel</button>
<button mat-button (click)="onSaveClick()" tabindex="2" mat-raised-button color="primary">Apply</button>
</div>

21
src/app/components/project-map/node-editors/configurator/docker/configure-custom-adapters/configure-custom-adapters.component.scss Normal file
View File

@ -0,0 +1,21 @@
th {
border: 0px!important;
}
th.mat-header-cell {
padding-bottom: 15px;
}
td.mat-cell {
padding-top: 15px;
}
.header {
display: flex;
justify-content: space-between;
width: 100%;
}
.column {
width: 50%;
}

60
src/app/components/project-map/node-editors/configurator/docker/configure-custom-adapters/configure-custom-adapters.component.ts Normal file
View File

@ -0,0 +1,60 @@
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/dialog';
import { DockerConfigurationService } from '../../../../../../services/docker-configuration.service';
@Component({
selector: 'app-configure-custom-adapters',
templateUrl: './configure-custom-adapters.component.html',
styleUrls: ['./configure-custom-adapters.component.scss']
})
export class ConfigureCustomAdaptersDialogComponent implements OnInit {
server: Server;
node: Node;
displayedColumns: string[] = ['adapter_number', 'port_name'];
adapters: CustomAdapter[] = [];
constructor(
public dialogRef: MatDialogRef<ConfigureCustomAdaptersDialogComponent>,
public nodeService: NodeService,
private toasterService: ToasterService,
private formBuilder: FormBuilder,
private dockerConfigurationService: DockerConfigurationService
) {}
ngOnInit() {
let i: number = 0;
if (!this.node.custom_adapters) {
this.node.ports.forEach((port) => {
this.adapters.push({
adapter_number: i,
port_name: ''
});
});
} else {
this.adapters = this.node.custom_adapters;
}
}
onSaveClick() {
this.node.custom_adapters = this.adapters;
this.nodeService.updateNodeWithCustomAdapters(this.server, this.node).subscribe(() => {
this.onCancelClick();
this.toasterService.success(`Configuration saved for node ${this.node.name}`);
});
}
onCancelClick() {
this.dialogRef.close();
}
}
export class CustomAdapter {
adapter_number: number;
port_name: string;
}

10
src/app/components/project-map/node-editors/configurator/docker/edit-network-configuration/edit-network-configuration.component.html Normal file
View File

@ -0,0 +1,10 @@
<h1 mat-dialog-title>Edit network configuration for node {{node.name}}</h1>
<div *ngIf="node" class="modal-form-container">
<textarea matInput [(ngModel)]="configuration" class="textArea" type="text"></textarea>
</div>
<div mat-dialog-actions>
<button mat-button (click)="onCancelClick()" color="accent">Cancel</button>
<button mat-button (click)="onSaveClick()" tabindex="2" mat-raised-button color="primary">Apply</button>
</div>

4
src/app/components/project-map/node-editors/configurator/docker/edit-network-configuration/edit-network-configuration.component.scss Normal file
View File

@ -0,0 +1,4 @@
.textArea {
width: 100%;
height: 350px;
}

43
src/app/components/project-map/node-editors/configurator/docker/edit-network-configuration/edit-network-configuration.component.ts Normal file
View File

@ -0,0 +1,43 @@
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/dialog';
import { DockerConfigurationService } from '../../../../../../services/docker-configuration.service';
@Component({
selector: 'app-edit-network-configuration',
templateUrl: './edit-network-configuration.component.html',
styleUrls: ['./edit-network-configuration.component.scss']
})
export class EditNetworkConfigurationDialogComponent implements OnInit {
server: Server;
node: Node;
configuration: string;
constructor(
public dialogRef: MatDialogRef<EditNetworkConfigurationDialogComponent>,
public nodeService: NodeService,
private toasterService: ToasterService
) {}
ngOnInit() {
this.nodeService.getNetworkConfiguration(this.server, this.node).subscribe((response: string) => {
this.configuration = response;
});
}
onSaveClick() {
this.nodeService.saveNetworkConfiguration(this.server, this.node, this.configuration).subscribe((response: string) => {
this.onCancelClick();
this.toasterService.success(`Configuration for node ${this.node.name} saved.`);
});
}
onCancelClick() {
this.dialogRef.close();
}
}

5
src/app/components/project-map/nodes-menu/nodes-menu.component.spec.ts
View File

@ -2,7 +2,8 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { NodesMenuComponent } from './nodes-menu.component';
import { MockedToasterService } from '../../../services/toaster.service.spec';
import { MockedNodeService, MockedNodesDataSource } from '../project-map.component.spec';
import { MatButtonModule, MatIconModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { NO_ERRORS_SCHEMA } from '@angular/core';
@ -14,7 +15,7 @@ import { ServerService } from '../../../services/server.service';
import { SettingsService } from '../../../services/settings.service';
import { ElectronService } from 'ngx-electron';
describe('NodesMenuComponent', () => {
xdescribe('NodesMenuComponent', () => {
let component: NodesMenuComponent;
let fixture: ComponentFixture<NodesMenuComponent>;
let mockedToasterService: MockedToasterService = new MockedToasterService();

6
src/app/components/project-map/packet-capturing/packet-filters/packet-filters.component.spec.ts
View File

@ -1,6 +1,10 @@
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { NO_ERRORS_SCHEMA } from '@angular/core';

6
src/app/components/project-map/packet-capturing/start-capture/start-capture.component.spec.ts
View File

@ -1,7 +1,11 @@
import { StartCaptureDialogComponent } from "./start-capture.component";
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ToasterService } from '../../../../services/toaster.service';

6
src/app/components/project-map/project-map-menu/project-map-menu.component.spec.ts
View File

@ -2,7 +2,11 @@ import { ProjectMapMenuComponent } from "./project-map-menu.component";
import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { MockedDrawingService } from '../project-map.component.spec';
import { MapSettingsService } from '../../../services/mapsettings.service';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatDialogModule } from '@angular/material';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CommonModule } from '@angular/common';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { DrawingService } from '../../../services/drawing.service';

5
src/app/components/project-map/project-map.component.html
View File

@ -59,6 +59,10 @@
<mat-icon>info</mat-icon>
<span>Go to system status</span>
</button>
<button mat-menu-item routerLink="/settings">
<mat-icon>settings</mat-icon>
<span>Go to settings</span>
</button>
<button mat-menu-item (click)="addNewTemplate()">
<mat-icon>control_point</mat-icon>
<span>New template</span>
@ -179,6 +183,7 @@
</div>
<app-context-menu [project]="project" [server]="server"></app-context-menu>
<app-context-console-menu [project]="project" [server]="server"></app-context-console-menu>
</div>
<div [ngClass]="{lightTheme: isLightThemeEnabled}" class="zoom-buttons">

10
src/app/components/project-map/project-map.component.spec.ts
View File

@ -1,7 +1,12 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ProjectMapComponent } from './project-map.component';
import { MatIconModule, MatToolbarModule, MatMenuModule, MatCheckboxModule, MatDialogModule, MatBottomSheetModule } from '@angular/material';
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ServerService } from '../../services/server.service';
import { ProjectService } from '../../services/project.service';
@ -57,6 +62,7 @@ import { MapNodesDataSource, MapLinksDataSource, MapDrawingsDataSource, MapSymbo
import { EthernetLinkWidget } from '../../cartography/widgets/links/ethernet-link';
import { SerialLinkWidget } from '../../cartography/widgets/links/serial-link';
import { NotificationService } from '../../services/notification.service';
import {} from 'mousetrap';
export class MockedProgressService {
public activate() {}
@ -238,7 +244,7 @@ export class MockedLinksDataSource {
clear() {}
}
describe('ProjectMapComponent', () => {
xdescribe('ProjectMapComponent', () => {
let component: ProjectMapComponent;
let fixture: ComponentFixture<ProjectMapComponent>;
let drawingService = new MockedDrawingService();

10
src/app/components/project-map/project-map.component.ts
View File

@ -13,6 +13,7 @@ import { ProjectService } from '../../services/project.service';
import { Server } from '../../models/server';
import { Drawing } from '../../cartography/models/drawing';
import { ContextMenuComponent } from './context-menu/context-menu.component';
import { ContextConsoleMenuComponent } from './context-console-menu/context-console-menu.component';
import { Template } from '../../models/template';
import { NodeService } from '../../services/node.service';
import { Symbol } from '../../models/symbol';
@ -112,6 +113,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
public isLightThemeEnabled: boolean = false;
@ViewChild(ContextMenuComponent) contextMenu: ContextMenuComponent;
@ViewChild(ContextConsoleMenuComponent) consoleContextMenu: ContextConsoleMenuComponent;
@ViewChild(D3MapComponent) mapChild: D3MapComponent;
@ViewChild(ProjectMapMenuComponent) projectMapMenuComponent: ProjectMapMenuComponent;
@ -437,6 +439,11 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
this.contextMenu.openMenuForListOfElements(drawings, nodes, labels, links, event.pageY, event.pageX);
});
const onContextConsoleMenu = this.nodeWidget.onContextConsoleMenu.subscribe((eventNode: NodeContextMenu) => {
const node = this.mapNodeToNode.convert(eventNode.node);
this.consoleContextMenu.openMenu(node, eventNode.event.pageY, eventNode.event.pageX);
});
this.projectMapSubscription.add(onLinkContextMenu);
this.projectMapSubscription.add(onEthernetLinkContextMenu);
this.projectMapSubscription.add(onSerialLinkContextMenu);
@ -445,6 +452,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
this.projectMapSubscription.add(onContextMenu);
this.projectMapSubscription.add(onLabelContextMenu);
this.projectMapSubscription.add(onInterfaceLabelContextMenu);
this.projectMapSubscription.add(onContextConsoleMenu);
this.mapChangeDetectorRef.detectChanges();
}
@ -880,7 +888,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
public addNewTemplate() {
const dialogRef = this.dialog.open(NewTemplateDialogComponent, {
width: '1000px',
maxHeight: '500px',
maxHeight: '700px',
autoFocus: false,
disableClose: true
});

2
src/app/components/project-map/web-console/web-console.component.html
View File

@ -1 +1 @@
<div #terminal id="terminal"></div>
<div class="lightTheme" #terminal id="terminal"></div>

Some files were not shown because too many files have changed in this diff Show More