Configuration for adapters added

src/app/app-routing.module.ts

@@ -12,6 +12,7 @@ import { QemuPreferencesComponent } from './components/preferences/qemu/qemu-pre
 import { QemuVmTemplatesComponent } from './components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component';
 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';
 
 const routes: Routes = [
   {
@@ -26,6 +27,7 @@ const routes: Routes = [
       { path: 'server/:server_id/preferences', component: PreferencesComponent },
       // 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 }

src/app/app.module.ts

@@ -35,7 +35,8 @@ import { ProgressDialogComponent } from './common/progress-dialog/progress-dialo
 import { AppComponent } from './app.component';
 
 import { ProjectMapComponent } from './components/project-map/project-map.component';
-import { ServersComponent, AddServerDialogComponent } from './components/servers/servers.component';
+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 { 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';
@@ -95,6 +96,7 @@ import { QemuVmTemplatesComponent } from './components/preferences/qemu/qemu-vm-
 import { AddQemuVmTemplateComponent } from './components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component';
 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';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -151,7 +153,8 @@ if (environment.production) {
     QemuPreferencesComponent,
     QemuVmTemplatesComponent,
     AddQemuVmTemplateComponent,
-    QemuVmTemplateDetailsComponent
+    QemuVmTemplateDetailsComponent,
+    GeneralPreferencesComponent
   ],
   imports: [
     BrowserModule,

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

@@ -0,0 +1,10 @@
+<div class="content">
+    <div class="default-header">
+        <div class="row">
+            <h1 class="col">General preferences</h1>
+        </div>
+    </div>
+    <div class="default-content">
+        <div class="example-container mat-elevation-z8"></div>
+    </div>
+</div>

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

@@ -0,0 +1,22 @@
+import { Component, OnInit } from "@angular/core";
+import { ActivatedRoute, ParamMap } from '@angular/router';
+import { ServerService } from '../../../services/server.service';
+import { switchMap } from 'rxjs/operators';
+
+
+@Component({
+    selector: 'app-general-preferences',
+    templateUrl: './general-preferences.component.html',
+    styleUrls: ['./general-preferences.component.scss']
+})
+export class GeneralPreferencesComponent implements OnInit {
+    public serverId: string = "";
+
+    constructor(
+        private route: ActivatedRoute
+    ) {}
+
+    ngOnInit() {
+        this.serverId = this.route.snapshot.paramMap.get("server_id");
+    }
+}

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

@@ -1,5 +1,4 @@
 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';

src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.html

@@ -1,4 +1,4 @@
-<div class="content" [ngClass]="{ shadowed: isConfiguratorOpened }">
+<div class="content" [ngClass]="{ shadowed: isConfiguratorOpened }" [ngClass]="{ nonshadowed: !isConfiguratorOpened }">
     <div class="default-header">
         <div class="row">
             <h1 class="col">QEMU VM configuration</h1>
@@ -324,6 +324,35 @@
         </div>
     </div>
     <div class="default-content" *ngIf="qemuTemplate">
+        <div class="example-container mat-elevation-z8">
+            <table class="table" mat-table [dataSource]="adapters">
+                <ng-container matColumnDef="adapter_number">
+                    <th mat-header-cell *matHeaderCellDef> Adapter number </th>
+                    <td mat-cell *matCellDef="let element"> Adapter {{element.adapter_number}} </td>
+                </ng-container>
 
+                <ng-container matColumnDef="port_name">
+                    <th mat-header-cell *matHeaderCellDef> Port name </th>
+                    <td mat-cell *matCellDef="let element"> Ethernet {{element.adapter_number}} </td>
+                </ng-container>
+
+                <ng-container matColumnDef="adapter_type">
+                    <th mat-header-cell *matHeaderCellDef> Adapter type </th>
+                    <td mat-cell *matCellDef="let element; let i = index;">
+                        <mat-select placeholder="Type" [(ngModel)]="adapters[i].adapter_type">
+                            <mat-option *ngFor="let type of networkTypes" [value]="type[0]">
+                                {{type[1]}} ({{type[0]}})
+                            </mat-option>
+                        </mat-select>
+                    </td>
+                </ng-container>
+                
+                <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+            </table>
+        </div>
+        <div class="row">
+            <button mat-raised-button color="primary" class="configHideButton" (click)="configureCustomAdapters()">Apply</button><br/>
+        </div>
     </div>
 </div>

src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.scss

@@ -25,15 +25,38 @@
     margin-bottom: 10px;
 }
 
+.configHideButton {
+    margin-left: 80%;
+    width: 20%;
+    margin-bottom: 10px;
+}
+
 .shadowed {
     opacity: 0.4;
     margin-right: 80%;
-    transition: 0.15s;
+    transition: 0.25s;
+}
+
+.nonshadowed {
+    opacity: 0;
+    transition: 0.25s;
 }
 
 .configurator {
     position: absolute;
     top: 60px;
-    left: 50%;
+    left: 40%;
-    min-width: 300px;
+    min-width: 40%;
+}
+
+th {
+    border: 0px!important;
+}
+
+th.mat-header-cell {
+    padding-bottom: 15px;
+}
+
+td.mat-cell {
+    padding-top: 15px;
 }

src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.ts

@@ -6,6 +6,7 @@ import { Server } from '../../../../models/server';
 import { QemuTemplate } from '../../../../models/templates/qemu-template';
 import { QemuBinary } from '../../../../models/qemu/qemu-binary';
 import { ToasterService } from '../../../../services/toaster.service';
+import { CustomAdapter } from '../../../../models/qemu/qemu-custom-adapter';
 
 
 @Component({
@@ -60,8 +61,9 @@ export class QemuVmTemplateDetailsComponent implements OnInit {
                 "very low"];
     binaries: QemuBinary[] = [];
     activateCpuThrottling: boolean = true;
-
     isConfiguratorOpened: boolean = true;
+    adapters: CustomAdapter[] = [];
+    displayedColumns: string[] = ['adapter_number', 'port_name', 'adapter_type'];
 
     constructor(
         private route: ActivatedRoute,
@@ -81,6 +83,18 @@ export class QemuVmTemplateDetailsComponent implements OnInit {
                 this.qemuService.getBinaries(server).subscribe((qemuBinaries: QemuBinary[]) => {
                     this.binaries = qemuBinaries;
                 });
+
+                for(let i=0; i<this.qemuTemplate.adapters; i++){
+                    let adapter = this.qemuTemplate.custom_adapters.find(elem => elem.adapter_number === i);
+                    if (adapter) {
+                        this.adapters.push(adapter);
+                    } else {
+                        this.adapters.push({
+                            adapter_number: i,
+                            adapter_type: this.qemuTemplate.adapter_type
+                        });
+                    }
+                }
             });
         });
     }
@@ -103,6 +117,7 @@ export class QemuVmTemplateDetailsComponent implements OnInit {
 
     configureCustomAdapters(){
         this.isConfiguratorOpened = !this.isConfiguratorOpened;
+        this.qemuTemplate.custom_adapters = this.adapters;
     }
 
     onSave(){

src/app/components/servers/add-server-dialog/add-server-dialog.component.ts

@@ -0,0 +1,28 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { Server } from '../../../models/server';
+
+
+@Component({
+    selector: 'app-add-server-dialog',
+    templateUrl: 'add-server-dialog.component.html'
+  })
+  export class AddServerDialogComponent implements OnInit {
+    server: Server = new Server();
+  
+    authorizations = [{ key: 'none', name: 'No authorization' }, { key: 'basic', name: 'Basic authorization' }];
+  
+    constructor(public dialogRef: MatDialogRef<AddServerDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) {}
+  
+    ngOnInit() {
+      this.server.authorization = 'none';
+    }
+  
+    onAddClick(): void {
+      this.dialogRef.close(this.server);
+    }
+  
+    onNoClick(): void {
+      this.dialogRef.close();
+    }
+}

src/app/components/servers/servers.component.ts

@@ -8,6 +8,8 @@ import { map } from 'rxjs/operators';
 import { Server } from '../../models/server';
 import { ServerService } from '../../services/server.service';
 import { ServerDatabase } from '../../services/server.database';
+import { AddServerDialogComponent } from './add-server-dialog/add-server-dialog.component';
+
 
 @Component({
   selector: 'app-server-list',
@@ -53,30 +55,6 @@ export class ServersComponent implements OnInit {
   }
 }
 
-@Component({
-  selector: 'app-add-server-dialog',
-  templateUrl: 'add-server-dialog.html'
-})
-export class AddServerDialogComponent implements OnInit {
-  server: Server = new Server();
-
-  authorizations = [{ key: 'none', name: 'No authorization' }, { key: 'basic', name: 'Basic authorization' }];
-
-  constructor(public dialogRef: MatDialogRef<AddServerDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) {}
-
-  ngOnInit() {
-    this.server.authorization = 'none';
-  }
-
-  onAddClick(): void {
-    this.dialogRef.close(this.server);
-  }
-
-  onNoClick(): void {
-    this.dialogRef.close();
-  }
-}
-
 export class ServerDataSource extends DataSource<Server> {
   constructor(private serverDatabase: ServerDatabase) {
     super();

src/app/models/qemu/qemu-custom-adapter.ts

@@ -0,0 +1,4 @@
+export class CustomAdapter {
+    adapter_number: number;
+    adapter_type: string;
+}

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

@@ -1,3 +1,5 @@
+import { CustomAdapter } from '../qemu/qemu-custom-adapter';
+
 export class QemuTemplate {
     adapter_type: string;
     adapters: number;
@@ -11,7 +13,7 @@ export class QemuTemplate {
     console_type: string;
     cpu_throttling: number;
     cpus: number;
-    custom_adapters?: (null)[] | null;
+    custom_adapters: CustomAdapter[];
     default_name_format: string;
     first_port_name: string;
     hda_disk_image: string;