ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2025-04-14 21:56:34 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Server type in template preferences

Browse Source
This commit is contained in:
piotrpekala7 2020-05-08 17:01:51 +02:00
parent afa9facb3a
commit c684577c57
13 changed files with 166 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/components/preferences/built-in/cloud-nodes/cloud-nodes-add-template/cloud-nodes-add-template.component.html
View File

@ -6,6 +6,11 @@
</div>
<div class="default-content">
<mat-card class="matCard">
<mat-radio-group class="radio-group">
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run the cloud node on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run the cloud node on the GNS3 VM</mat-radio-button>
</mat-radio-group>
<form [formGroup]="formGroup">
<mat-form-field class="form-field">
<input formControlName="templateName" matInput type="text" placeholder="Template name">

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

@ -8,6 +8,8 @@ import { TemplateMocksService } from '../../../../../services/template-mocks.ser
import { BuiltInTemplatesService } from '../../../../../services/built-in-templates.service';
import { CloudTemplate } from '../../../../../models/templates/cloud-template';
import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
import { ComputeService } from '../../../../../services/compute.service';
import { Compute } from '../../../../../models/compute';
@Component({
@ -19,6 +21,10 @@ export class CloudNodesAddTemplateComponent implements OnInit {
server: Server;
templateName: string = '';
formGroup: FormGroup;
isGns3VmAvailable: boolean = false;
isGns3VmChosen: boolean = false;
isLocalComputerChosen: boolean = true;
constructor(
private route: ActivatedRoute,
@ -27,7 +33,8 @@ export class CloudNodesAddTemplateComponent implements OnInit {
private router: Router,
private toasterService: ToasterService,
private templateMocksService: TemplateMocksService,
private formBuilder: FormBuilder
private formBuilder: FormBuilder,
private computeService: ComputeService
) {
this.formGroup = this.formBuilder.group({
templateName: new FormControl('', Validators.required)
@ -38,9 +45,23 @@ export class CloudNodesAddTemplateComponent implements OnInit {
const server_id = this.route.snapshot.paramMap.get("server_id");
this.serverService.get(parseInt(server_id, 10)).then((server: Server) => {
this.server = server;
this.computeService.getComputes(server).subscribe((computes: Compute[]) => {
if (computes.filter(compute => compute.compute_id === 'vm').length > 0) this.isGns3VmAvailable = true;
});
});
}
setServerType(serverType: string) {
if (serverType === 'gns3 vm' && this.isGns3VmAvailable) {
this.isGns3VmChosen = true;
this.isLocalComputerChosen = false;
} else {
this.isGns3VmChosen = false;
this.isLocalComputerChosen = true;
}
}
goBack() {
this.router.navigate(['/server', this.server.id, 'preferences', 'builtin', 'cloud-nodes']);
}
@ -55,6 +76,7 @@ export class CloudNodesAddTemplateComponent implements OnInit {
cloudTemplate.template_id = uuid();
cloudTemplate.name = this.formGroup.get('templateName').value;
cloudTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
this.builtInTemplatesService.addTemplate(this.server, cloudTemplate).subscribe((cloudNodeTemplate) => {
this.goBack();

5
src/app/components/preferences/built-in/ethernet-hubs/ethernet-hubs-add-template/ethernet-hubs-add-template.component.html
View File

@ -6,6 +6,11 @@
</div>
<div class="default-content">
<mat-card class="matCard">
<mat-radio-group class="radio-group">
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run the Ethernet Hub on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run the Ethernet Hub on the GNS3 VM</mat-radio-button>
</mat-radio-group>
<form [formGroup]="formGroup">
<mat-form-field class="form-field">
<input formControlName="templateName" matInput type="text" placeholder="Template name">

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

@ -8,6 +8,8 @@ import { TemplateMocksService } from '../../../../../services/template-mocks.ser
import { BuiltInTemplatesService } from '../../../../../services/built-in-templates.service';
import { EthernetHubTemplate } from '../../../../../models/templates/ethernet-hub-template';
import { FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms';
import { ComputeService } from '../../../../../services/compute.service';
import { Compute } from '../../../../../models/compute';
@Component({
@ -19,6 +21,10 @@ export class EthernetHubsAddTemplateComponent implements OnInit {
server: Server;
templateName: string = '';
formGroup: FormGroup;
isGns3VmAvailable: boolean = false;
isGns3VmChosen: boolean = false;
isLocalComputerChosen: boolean = true;
constructor(
private route: ActivatedRoute,
@ -27,7 +33,8 @@ export class EthernetHubsAddTemplateComponent implements OnInit {
private router: Router,
private toasterService: ToasterService,
private templateMocksService: TemplateMocksService,
private formBuilder: FormBuilder
private formBuilder: FormBuilder,
private computeService: ComputeService
) {
this.formGroup = this.formBuilder.group({
templateName: new FormControl('', Validators.required),
@ -39,9 +46,23 @@ export class EthernetHubsAddTemplateComponent implements OnInit {
const server_id = this.route.snapshot.paramMap.get("server_id");
this.serverService.get(parseInt(server_id, 10)).then((server: Server) => {
this.server = server;
this.computeService.getComputes(server).subscribe((computes: Compute[]) => {
if (computes.filter(compute => compute.compute_id === 'vm').length > 0) this.isGns3VmAvailable = true;
});
});
}
setServerType(serverType: string) {
if (serverType === 'gns3 vm' && this.isGns3VmAvailable) {
this.isGns3VmChosen = true;
this.isLocalComputerChosen = false;
} else {
this.isGns3VmChosen = false;
this.isLocalComputerChosen = true;
}
}
goBack() {
this.router.navigate(['/server', this.server.id, 'preferences', 'builtin', 'ethernet-hubs']);
}
@ -56,6 +77,7 @@ export class EthernetHubsAddTemplateComponent implements OnInit {
ethernetHubTemplate.template_id = uuid();
ethernetHubTemplate.name = this.formGroup.get('templateName').value;
ethernetHubTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
for(let i=0; i<this.formGroup.get('numberOfPorts').value; i++){
ethernetHubTemplate.ports_mapping.push({

5
src/app/components/preferences/built-in/ethernet-switches/ethernet-switches-add-template/ethernet-switches-add-template.component.html
View File

@ -6,6 +6,11 @@
</div>
<div class="default-content">
<mat-card class="matCard">
<mat-radio-group class="radio-group">
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run the Ethernet switch on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run the Ethernet switch on the GNS3 VM</mat-radio-button>
</mat-radio-group>
<form [formGroup]="formGroup">
<mat-form-field class="form-field">
<input formControlName="templateName" matInput type="text" placeholder="Template name">

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

@ -8,6 +8,8 @@ import { TemplateMocksService } from '../../../../../services/template-mocks.ser
import { BuiltInTemplatesService } from '../../../../../services/built-in-templates.service';
import { EthernetSwitchTemplate } from '../../../../../models/templates/ethernet-switch-template';
import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
import { ComputeService } from '../../../../../services/compute.service';
import { Compute } from '../../../../../models/compute';
@Component({
@ -19,6 +21,10 @@ export class EthernetSwitchesAddTemplateComponent implements OnInit {
server: Server;
templateName: string = '';
formGroup: FormGroup;
isGns3VmAvailable: boolean = false;
isGns3VmChosen: boolean = false;
isLocalComputerChosen: boolean = true;
constructor(
private route: ActivatedRoute,
@ -27,7 +33,8 @@ export class EthernetSwitchesAddTemplateComponent implements OnInit {
private router: Router,
private toasterService: ToasterService,
private templateMocksService: TemplateMocksService,
private formBuilder: FormBuilder
private formBuilder: FormBuilder,
private computeService: ComputeService
) {
this.formGroup = this.formBuilder.group({
templateName: new FormControl('', Validators.required),
@ -39,6 +46,10 @@ export class EthernetSwitchesAddTemplateComponent implements OnInit {
const server_id = this.route.snapshot.paramMap.get("server_id");
this.serverService.get(parseInt(server_id, 10)).then((server: Server) => {
this.server = server;
this.computeService.getComputes(server).subscribe((computes: Compute[]) => {
if (computes.filter(compute => compute.compute_id === 'vm').length > 0) this.isGns3VmAvailable = true;
});
});
}
@ -46,6 +57,16 @@ export class EthernetSwitchesAddTemplateComponent implements OnInit {
this.router.navigate(['/server', this.server.id, 'preferences', 'builtin', 'ethernet-switches']);
}
setServerType(serverType: string) {
if (serverType === 'gns3 vm' && this.isGns3VmAvailable) {
this.isGns3VmChosen = true;
this.isLocalComputerChosen = false;
} else {
this.isGns3VmChosen = false;
this.isLocalComputerChosen = true;
}
}
addTemplate() {
if (!this.formGroup.invalid) {
let ethernetSwitchTemplate: EthernetSwitchTemplate;
@ -56,6 +77,7 @@ export class EthernetSwitchesAddTemplateComponent implements OnInit {
ethernetSwitchTemplate.template_id = uuid();
ethernetSwitchTemplate.name = this.formGroup.get('templateName').value;
ethernetSwitchTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
for(let i=0; i<this.formGroup.get('numberOfPorts').value; i++){
ethernetSwitchTemplate.ports_mapping.push({

3
src/app/components/preferences/docker/add-docker-template/add-docker-template.component.html
View File

@ -10,7 +10,8 @@
<mat-step label="Server type">
<mat-radio-group class="radio-group">
<!-- <mat-radio-button class="radio-button" value="1" (click)="setServerType('remote computer')">Run this Docker container on a remote computer</mat-radio-button> -->
<mat-radio-button class="radio-button" value="2" (click)="setServerType('gns3 vm')" checked>Run this Docker container on the GNS3 VM</mat-radio-button>
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run this Docker container on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run this Docker container on the GNS3 VM</mat-radio-button>
</mat-radio-group>
</mat-step>
<mat-step label="Docker Virtual Machine">

7
src/app/components/preferences/dynamips/add-ios-template/add-ios-template.component.html
View File

@ -7,6 +7,13 @@
<div class="default-content" *ngIf="iosTemplate">
<div class="container mat-elevation-z8">
<mat-vertical-stepper [linear]="true">
<mat-step label="Server type">
<mat-radio-group class="radio-group">
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run this IOS router on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run this IOS router on the GNS3 VM</mat-radio-button>
</mat-radio-group>
</mat-step>
<mat-step label="IOS image">
<input
type="file"

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

@ -12,6 +12,8 @@ import { IosConfigurationService } from '../../../../services/ios-configuration.
import { IosImage } from '../../../../models/images/ios-image';
import { FileUploader, FileItem, ParsedResponseHeaders } from 'ng2-file-upload';
import { ServerResponse } from '../../../../models/serverResponse';
import { ComputeService } from '../../../../services/compute.service';
import { Compute } from '../../../../models/compute';
@Component({
selector: 'app-add-ios-template',
@ -44,6 +46,10 @@ export class AddIosTemplateComponent implements OnInit {
ciscoUrl: string = "https://cfn.cloudapps.cisco.com/ITDIT/CFN/jsp/SearchBySoftware.jsp";
uploader: FileUploader;
isGns3VmAvailable: boolean = false;
isGns3VmChosen: boolean = false;
isLocalComputerChosen: boolean = true;
constructor(
private route: ActivatedRoute,
private serverService: ServerService,
@ -52,7 +58,8 @@ export class AddIosTemplateComponent implements OnInit {
private formBuilder: FormBuilder,
private router: Router,
private templateMocksService: TemplateMocksService,
private iosConfigurationService: IosConfigurationService
private iosConfigurationService: IosConfigurationService,
private computeService: ComputeService
) {
this.iosTemplate = new IosTemplate();
@ -107,9 +114,23 @@ export class AddIosTemplateComponent implements OnInit {
this.chassis = this.iosConfigurationService.getChassis();
this.defaultRam = this.iosConfigurationService.getDefaultRamSettings();
});
this.computeService.getComputes(server).subscribe((computes: Compute[]) => {
if (computes.filter(compute => compute.compute_id === 'vm').length > 0) this.isGns3VmAvailable = true;
});
});
}
setServerType(serverType: string) {
if (serverType === 'gns3 vm' && this.isGns3VmAvailable) {
this.isGns3VmChosen = true;
this.isLocalComputerChosen = false;
} else {
this.isGns3VmChosen = false;
this.isLocalComputerChosen = true;
}
}
getImages() {
this.iosService.getImages(this.server).subscribe((images: IosImage[]) => {
this.iosImages = images;
@ -146,6 +167,8 @@ export class AddIosTemplateComponent implements OnInit {
if (this.networkAdaptersForTemplate.length>0) this.completeAdaptersData();
if (this.networkModulesForTemplate.length>0) this.completeModulesData();
this.iosTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
this.iosService.addTemplate(this.server, this.iosTemplate).subscribe((template: IosTemplate) => {
this.goBack();
});

4
src/app/components/preferences/ios-on-unix/add-iou-template/add-iou-template.component.html
View File

@ -9,8 +9,8 @@
<mat-vertical-stepper [linear]="true">
<mat-step label="Server type">
<mat-radio-group class="radio-group">
<mat-radio-button class="radio-button" value="1" (click)="setServerType('remote computer')">Run this IOU device on a remote computer</mat-radio-button><br/>
<mat-radio-button class="radio-button" value="2" (click)="setServerType('gns3 vm')" checked>Run this IOU device on the GNS3 VM</mat-radio-button>
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run this IOU device on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run this IOU device on the GNS3 VM</mat-radio-button>
</mat-radio-group>
</mat-step>
<mat-step label="Name">

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

@ -8,6 +8,8 @@ import { v4 as uuid } from 'uuid';
import { TemplateMocksService } from '../../../../services/template-mocks.service';
import { IouTemplate } from '../../../../models/templates/iou-template';
import { IouService } from '../../../../services/iou.service';
import { ComputeService } from '../../../../services/compute.service';
import { Compute } from '../../../../models/compute';
@Component({
@ -18,7 +20,6 @@ import { IouService } from '../../../../services/iou.service';
export class AddIouTemplateComponent implements OnInit {
server: Server;
iouTemplate: IouTemplate;
isGns3VmChosen: boolean = false;
isRemoteComputerChosen: boolean = false;
newImageSelected: boolean = false;
types: string[] = ['L2 image', 'L3 image'];
@ -27,6 +28,10 @@ export class AddIouTemplateComponent implements OnInit {
templateNameForm: FormGroup;
imageForm: FormGroup;
isGns3VmAvailable: boolean = false;
isGns3VmChosen: boolean = false;
isLocalComputerChosen: boolean = true;
constructor(
private route: ActivatedRoute,
@ -35,7 +40,8 @@ export class AddIouTemplateComponent implements OnInit {
private toasterService: ToasterService,
private router: Router,
private formBuilder: FormBuilder,
private templateMocksService: TemplateMocksService
private templateMocksService: TemplateMocksService,
private computeService: ComputeService
) {
this.iouTemplate = new IouTemplate();
@ -56,14 +62,20 @@ export class AddIouTemplateComponent implements OnInit {
this.templateMocksService.getIouTemplate().subscribe((iouTemplate: IouTemplate) => {
this.iouTemplate = iouTemplate;
})
this.computeService.getComputes(server).subscribe((computes: Compute[]) => {
if (computes.filter(compute => compute.compute_id === 'vm').length > 0) this.isGns3VmAvailable = true;
});
});
}
setServerType(serverType: string) {
if (serverType === 'gns3 vm') {
if (serverType === 'gns3 vm' && this.isGns3VmAvailable) {
this.isGns3VmChosen = true;
this.isLocalComputerChosen = false;
} else {
this.isRemoteComputerChosen = true;
this.isGns3VmChosen = false;
this.isLocalComputerChosen = true;
}
}
@ -84,6 +96,7 @@ export class AddIouTemplateComponent implements OnInit {
this.iouTemplate.template_id = uuid();
this.iouTemplate.name = this.templateNameForm.get("templateName").value;
this.iouTemplate.path = this.imageForm.get("imageName").value;
this.iouTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
this.iouService.addTemplate(this.server, this.iouTemplate).subscribe((template: IouTemplate) => {
this.goBack();

7
src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.html
View File

@ -7,6 +7,13 @@
<div class="default-content">
<div class="container mat-elevation-z8">
<mat-vertical-stepper [linear]="true">
<mat-step label="Server type">
<mat-radio-group class="radio-group">
<mat-radio-button class="radio-button" value="1" (click)="setServerType('local')" checked>Run this QEMU VM on your local computer</mat-radio-button>
<mat-radio-button [disabled]="!isGns3VmAvailable" class="radio-button" value="2" (click)="setServerType('gns3 vm')">Run this QEMU VM on the GNS3 VM</mat-radio-button>
</mat-radio-group>
</mat-step>
<mat-step label="QEMU VM Name">
<form [formGroup]="nameForm">
<mat-form-field class="form-field">

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

@ -11,6 +11,8 @@ import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms'
import { v4 as uuid } from 'uuid';
import { TemplateMocksService } from '../../../../services/template-mocks.service';
import { QemuConfigurationService } from '../../../../services/qemu-configuration.service';
import { ComputeService } from '../../../../services/compute.service';
import { Compute } from '../../../../models/compute';
@Component({
@ -33,6 +35,10 @@ export class AddQemuVmTemplateComponent implements OnInit {
nameForm: FormGroup;
memoryForm: FormGroup;
diskForm: FormGroup;
isGns3VmAvailable: boolean = false;
isGns3VmChosen: boolean = false;
isLocalComputerChosen: boolean = true;
constructor(
private route: ActivatedRoute,
@ -42,7 +48,8 @@ export class AddQemuVmTemplateComponent implements OnInit {
private router: Router,
private formBuilder: FormBuilder,
private templateMocksService: TemplateMocksService,
private configurationService: QemuConfigurationService
private configurationService: QemuConfigurationService,
private computeService: ComputeService
) {
this.qemuTemplate = new QemuTemplate();
@ -77,9 +84,23 @@ export class AddQemuVmTemplateComponent implements OnInit {
});
this.consoleTypes = this.configurationService.getConsoleTypes();
this.computeService.getComputes(server).subscribe((computes: Compute[]) => {
if (computes.filter(compute => compute.compute_id === 'vm').length > 0) this.isGns3VmAvailable = true;
});
});
}
setServerType(serverType: string) {
if (serverType === 'gns3 vm' && this.isGns3VmAvailable) {
this.isGns3VmChosen = true;
this.isLocalComputerChosen = false;
} else {
this.isGns3VmChosen = false;
this.isLocalComputerChosen = true;
}
}
setDiskImage(value: string) {
this.newImageSelected = value === "newImage";
}
@ -103,6 +124,7 @@ export class AddQemuVmTemplateComponent implements OnInit {
}
this.qemuTemplate.template_id = uuid();
this.qemuTemplate.name = this.nameForm.get("templateName").value;
this.qemuTemplate.compute_id = this.isGns3VmChosen ? 'vm' : 'local';
this.qemuService.addTemplate(this.server, this.qemuTemplate).subscribe((template: QemuTemplate) => {
this.goBack();