Components for Vpcs templates

src/app/app-routing.module.ts

@@ -13,6 +13,8 @@ import { QemuVmTemplatesComponent } from './components/preferences/qemu/qemu-vm-
 import { QemuVmTemplateDetailsComponent } from './components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component';
 import { AddQemuVmTemplateComponent } from './components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component';
 import { GeneralPreferencesComponent } from './components/preferences/general/general-preferences.component';
+import { VpcsPreferencesComponent } from './components/preferences/vpcs/vpcs-preferences/vpcs-preferences.component';
+import { VpcsTemplatesComponent } from './components/preferences/vpcs/vpcs-templates/vpcs-templates.component';
 
 const routes: Routes = [
   {
@@ -25,12 +27,15 @@ const routes: Routes = [
       { path: 'server/:server_id/projects', component: ProjectsComponent },
       { path: 'settings', component: SettingsComponent },
       { path: 'server/:server_id/preferences', component: PreferencesComponent },
+      { path: 'server/:server_id/preferences/general', component: GeneralPreferencesComponent },
       // temporary disabled
       // { path: 'server/:server_id/preferences/qemu', component: QemuPreferencesComponent },
-      { path: 'server/:server_id/preferences/general', component: GeneralPreferencesComponent },
       { path: 'server/:server_id/preferences/qemu/templates', component: QemuVmTemplatesComponent },
       { path: 'server/:server_id/preferences/qemu/templates/:template_id', component: QemuVmTemplateDetailsComponent },
-      { path: 'server/:server_id/preferences/qemu/addtemplate', component: AddQemuVmTemplateComponent }
+      { path: 'server/:server_id/preferences/qemu/addtemplate', component: AddQemuVmTemplateComponent },
+      // temporary disabled
+      //{ path: 'server/:server_id/preferences/vpcs', component: VpcsPreferencesComponent }
+      { path: 'server/:server_id/preferences/vpcs/templates', component: VpcsTemplatesComponent }
     ]
   },
   { path: 'server/:server_id/project/:project_id', component: ProjectMapComponent }

src/app/app.module.ts

@@ -97,6 +97,8 @@ import { AddQemuVmTemplateComponent } from './components/preferences/qemu/add-qe
 import { QemuVmTemplateDetailsComponent } from './components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component';
 import { QemuService } from './services/qemu.service';
 import { GeneralPreferencesComponent } from './components/preferences/general/general-preferences.component';
+import { VpcsPreferencesComponent } from './components/preferences/vpcs/vpcs-preferences/vpcs-preferences.component';
+import { VpcsTemplatesComponent } from './components/preferences/vpcs/vpcs-templates/vpcs-templates.component';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -154,7 +156,9 @@ if (environment.production) {
     QemuVmTemplatesComponent,
     AddQemuVmTemplateComponent,
     QemuVmTemplateDetailsComponent,
-    GeneralPreferencesComponent
+    GeneralPreferencesComponent,
+    VpcsPreferencesComponent,
+    VpcsTemplatesComponent
   ],
   imports: [
     BrowserModule,

src/app/components/preferences/preferences.component.html

@@ -12,21 +12,16 @@
                         General
                     </button>
                 </mat-list-item>
+                <mat-list-item>
+                    <button mat-button routerLink="/server/{{serverId}}/preferences/vpcs/templates">
+                        VPCS
+                    </button>
+                </mat-list-item>
                 <mat-list-item>
                     <button mat-button routerLink="/server/{{serverId}}/preferences/qemu/templates">
                         QEMU
                     </button>
                 </mat-list-item>
-                <mat-list-item>
-                    <button mat-button routerLink="/server/{{serverId}}/preferences/virtualbox">
-                        VirtualBox
-                    </button>
-                </mat-list-item>
-                <mat-list-item>
-                    <button mat-button routerLink="/server/{{serverId}}/preferences/vmware">
-                        VMware
-                    </button>
-                </mat-list-item>
             </mat-nav-list>
         </div>
     </div>

src/app/components/preferences/vpcs/vpcs-preferences/vpcs-preferences.component.html

@@ -0,0 +1,12 @@
+<div class="content">
+    <div class="default-header">
+        <div class="row">
+            <h1 class="col">VPCS preferences</h1>
+        </div>
+    </div>
+    <div class="default-content">
+        <mat-form-field class="form-field">
+            <input matInput type="text" [(ngModel)]="vpcsExecutable" placeholder="Path to VPCS executable"/>
+        </mat-form-field>
+    </div>
+</div>

src/app/components/preferences/vpcs/vpcs-preferences/vpcs-preferences.component.scss

@@ -0,0 +1,3 @@
+.form-field {
+    width: 100%;
+}

src/app/components/preferences/vpcs/vpcs-preferences/vpcs-preferences.component.ts

@@ -0,0 +1,42 @@
+import { Component, OnInit } from "@angular/core";
+import { ServerSettingsService } from '../../../../services/server-settings.service';
+import { ActivatedRoute, ParamMap } from '@angular/router';
+import { Server } from '../../../../models/server';
+import { switchMap } from 'rxjs/operators';
+import { ServerService } from '../../../../services/server.service';
+import { ToasterService } from '../../../../services/toaster.service';
+
+
+@Component({
+    selector: 'app-vpcs-preferences',
+    templateUrl: './vpcs-preferences.component.html',
+    styleUrls: ['./vpcs-preferences.component.scss']
+})
+export class VpcsPreferencesComponent implements OnInit {
+    server: Server;
+    vpcsExecutable: string;
+
+    constructor(
+        private route: ActivatedRoute,
+        private serverService: ServerService,
+        private serverSettingsService: ServerSettingsService,
+        private toasterService: ToasterService
+    ) {}
+
+    ngOnInit() {
+        this.route.paramMap
+        .pipe(
+          switchMap((params: ParamMap) => {
+            const server_id = params.get('server_id');
+            return this.serverService.get(parseInt(server_id, 10));
+          })
+        )
+        .subscribe((server: Server) => {
+            this.server = server;
+        });
+    }
+
+    restoreDefaults(){
+        this.vpcsExecutable = '';
+    }
+}

src/app/components/preferences/vpcs/vpcs-templates/vpcs-templates.component.html

@@ -0,0 +1,17 @@
+<div class="content">
+    <div class="default-header">
+        <div class="row">
+            <h1 class="col">VPCS node templates</h1>
+            <button *ngIf="server" class="top-button" routerLink="/server/{{server.id}}/preferences/vpcs/addtemplate" mat-raised-button color="primary">Add VPCS template</button>
+        </div>
+    </div>
+    <div class="default-content">
+        <div class="example-container mat-elevation-z8">
+            <mat-nav-list *ngIf="server">
+                <mat-list-item *ngFor='let template of vpcsTemplates' routerLink="{{template.template_id}}">
+                    {{template.name}}
+                </mat-list-item>
+            </mat-nav-list>
+        </div>
+    </div>
+</div>

src/app/components/preferences/vpcs/vpcs-templates/vpcs-templates.component.scss

@@ -0,0 +1,4 @@
+.top-button {
+    height: 36px;
+    margin-top: 22px
+}

src/app/components/preferences/vpcs/vpcs-templates/vpcs-templates.component.ts

@@ -0,0 +1,36 @@
+import { Component, OnInit } from "@angular/core";
+import { Server } from '../../../../models/server';
+import { ActivatedRoute, ParamMap } from '@angular/router';
+import { ServerService } from '../../../../services/server.service';
+import { switchMap } from 'rxjs/operators';
+import { QemuTemplate } from '../../../../models/templates/qemu-template';
+import { QemuService } from '../../../../services/qemu.service';
+
+
+@Component({
+    selector: 'app-vpcs-templates',
+    templateUrl: './vpcs-templates.component.html',
+    styleUrls: ['./vpcs-templates.component.scss']
+})
+export class VpcsTemplatesComponent implements OnInit {
+    server: Server;
+    vpcsTemplates: QemuTemplate[] = [];
+
+    constructor(
+        private route: ActivatedRoute,
+        private serverService: ServerService
+    ) {}
+
+    ngOnInit() {
+        this.route.paramMap
+        .pipe(
+          switchMap((params: ParamMap) => {
+            const server_id = params.get('server_id');
+            return this.serverService.get(parseInt(server_id, 10));
+          })
+        )
+        .subscribe((server: Server) => {
+            this.server = server;
+        });
+    }
+}

src/app/models/templates/virtualbox-template.ts

@@ -0,0 +1,25 @@
+export interface VirtualBoxTemplate {
+    adapter_type: string;
+    adapters: number;
+    builtin: boolean;
+    category: string;
+    compute_id: string;
+    console_auto_start: boolean;
+    console_type: string;
+    custom_adapters?: (null)[] | null;
+    default_name_format: string;
+    first_port_name: string;
+    headless: boolean;
+    linked_clone: boolean;
+    name: string;
+    on_close: string;
+    port_name_format: string;
+    port_segment_size: number;
+    ram: number;
+    symbol: string;
+    template_id: string;
+    template_type: string;
+    usage: string;
+    use_any_adapter: boolean;
+    vmname: string;
+}

src/app/models/templates/vpcs-template.ts

@@ -0,0 +1,13 @@
+export interface VpcsTemplate {
+    base_script_file: string;
+    builtin: boolean;
+    category: string;
+    compute_id: string;
+    console_auto_start: boolean;
+    console_type: string;
+    default_name_format: string;
+    name: string;
+    symbol: string;
+    template_id: string;
+    template_type: string;
+}

src/app/services/vpcs.service.ts

@@ -0,0 +1,14 @@
+import { Injectable } from "@angular/core";
+import { HttpServer } from './http-server.service';
+import { Server } from '../models/server';
+import { VpcsTemplate } from '../models/templates/vpcs-template';
+import { Observable } from 'rxjs';
+
+@Injectable()
+export class VpcsService {
+    constructor(private httpServer: HttpServer) {}
+
+    getTemplates(server: Server): Observable<VpcsTemplate[]> {
+        return this.httpServer.get<VpcsTemplate[]>(server, '/templates') as Observable<VpcsTemplate[]>;
+    }
+}