diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 5576e495..fed07caa 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -32,6 +32,7 @@ import { HttpServer } from "./shared/services/http-server.service";
import { SnapshotService } from "./shared/services/snapshot.service";
import { ProgressDialogService } from "./shared/progress-dialog/progress-dialog.service";
import { NodeService } from "./shared/services/node.service";
+import { ApplianceService } from "./shared/services/appliance.service";
import { ProjectsComponent } from './projects/projects.component';
import { DefaultLayoutComponent } from './default-layout/default-layout.component';
@@ -43,6 +44,8 @@ import { ServersComponent, AddServerDialogComponent } from './servers/servers.co
import { NodeContextMenuComponent } from './shared/node-context-menu/node-context-menu.component';
import { StartNodeActionComponent } from './shared/node-context-menu/actions/start-node-action/start-node-action.component';
import { StopNodeActionComponent } from './shared/node-context-menu/actions/stop-node-action/stop-node-action.component';
+import { ApplianceComponent } from './appliance/appliance.component';
+import { ApplianceListDialogComponent } from './appliance/appliance-list-dialog/appliance-list-dialog.component';
@NgModule({
@@ -59,6 +62,8 @@ import { StopNodeActionComponent } from './shared/node-context-menu/actions/stop
NodeContextMenuComponent,
StartNodeActionComponent,
StopNodeActionComponent,
+ ApplianceComponent,
+ ApplianceListDialogComponent,
],
imports: [
NgbModule.forRoot(),
@@ -86,6 +91,7 @@ import { StopNodeActionComponent } from './shared/node-context-menu/actions/stop
ProjectService,
SymbolService,
ServerService,
+ ApplianceService,
NodeService,
IndexedDbService,
HttpServer,
@@ -95,7 +101,8 @@ import { StopNodeActionComponent } from './shared/node-context-menu/actions/stop
entryComponents: [
AddServerDialogComponent,
CreateSnapshotDialogComponent,
- ProgressDialogComponent
+ ProgressDialogComponent,
+ ApplianceListDialogComponent
],
bootstrap: [ AppComponent ]
})
diff --git a/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.html b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.html
new file mode 100644
index 00000000..47111abe
--- /dev/null
+++ b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.html
@@ -0,0 +1,17 @@
+
Appliances list
+
+
+
+
+ Name
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.scss b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.spec.ts b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.spec.ts
new file mode 100644
index 00000000..b964524a
--- /dev/null
+++ b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ApplianceListDialogComponent } from './appliance-list-dialog.component';
+
+describe('ApplianceListDialogComponent', () => {
+ let component: ApplianceListDialogComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ApplianceListDialogComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ApplianceListDialogComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.ts b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.ts
new file mode 100644
index 00000000..f3e8bad1
--- /dev/null
+++ b/src/app/appliance/appliance-list-dialog/appliance-list-dialog.component.ts
@@ -0,0 +1,53 @@
+import {Component, Inject, Input, OnInit} from '@angular/core';
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material";
+import {DataSource} from "@angular/cdk/collections";
+import {Observable} from "rxjs/Observable";
+import {Appliance} from "../../shared/models/appliance";
+import {ApplianceService} from "../../shared/services/appliance.service";
+import {Server} from "../../shared/models/server";
+
+
+@Component({
+ selector: 'app-appliance-list-dialog',
+ templateUrl: './appliance-list-dialog.component.html',
+ styleUrls: ['./appliance-list-dialog.component.scss']
+})
+export class ApplianceListDialogComponent implements OnInit {
+ server: Server;
+ dataSource: ApplianceDataSource;
+ displayedColumns = ['name'];
+
+ constructor(
+ public dialogRef: MatDialogRef,
+ private applianceService: ApplianceService,
+ @Inject(MAT_DIALOG_DATA) public data: any) {
+ this.server = data['server'];
+ }
+
+ ngOnInit() {
+ this.dataSource = new ApplianceDataSource(this.server, this.applianceService);
+ }
+
+ onAddClick(): void {
+ this.dialogRef.close();
+ }
+
+ onNoClick(): void {
+ this.dialogRef.close();
+ }
+
+}
+
+
+export class ApplianceDataSource extends DataSource {
+ constructor(private server: Server, private applianceService: ApplianceService) {
+ super();
+ }
+
+ connect(): Observable {
+ return this.applianceService.list(this.server);
+ }
+
+ disconnect() {}
+
+}
diff --git a/src/app/appliance/appliance.component.html b/src/app/appliance/appliance.component.html
new file mode 100644
index 00000000..baef47be
--- /dev/null
+++ b/src/app/appliance/appliance.component.html
@@ -0,0 +1,3 @@
+
diff --git a/src/app/appliance/appliance.component.scss b/src/app/appliance/appliance.component.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/appliance/appliance.component.spec.ts b/src/app/appliance/appliance.component.spec.ts
new file mode 100644
index 00000000..f5d63045
--- /dev/null
+++ b/src/app/appliance/appliance.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ApplianceComponent } from './appliance.component';
+
+describe('ApplianceComponent', () => {
+ let component: ApplianceComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ApplianceComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ApplianceComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/appliance/appliance.component.ts b/src/app/appliance/appliance.component.ts
new file mode 100644
index 00000000..5d1bc087
--- /dev/null
+++ b/src/app/appliance/appliance.component.ts
@@ -0,0 +1,33 @@
+import {Component, Input, OnInit} from '@angular/core';
+import {MatDialog} from "@angular/material";
+import {ApplianceListDialogComponent} from "./appliance-list-dialog/appliance-list-dialog.component";
+
+import {Server} from "../shared/models/server";
+
+@Component({
+ selector: 'app-appliance',
+ templateUrl: './appliance.component.html',
+ styleUrls: ['./appliance.component.scss']
+})
+export class ApplianceComponent implements OnInit {
+ @Input() server: Server;
+
+
+ constructor(private dialog: MatDialog) { }
+
+ ngOnInit() {}
+
+ listAppliancesModal() {
+ const dialogRef = this.dialog.open(ApplianceListDialogComponent, {
+ width: '600px',
+ data: {
+ 'server': this.server
+ }
+ });
+
+ dialogRef.afterClosed().subscribe(() => {
+
+ });
+ }
+}
+
diff --git a/src/app/project-map/project-map.component.html b/src/app/project-map/project-map.component.html
index ee1d03e8..443056a8 100644
--- a/src/app/project-map/project-map.component.html
+++ b/src/app/project-map/project-map.component.html
@@ -13,6 +13,10 @@
+
+
+
+
diff --git a/src/app/shared/models/appliance.ts b/src/app/shared/models/appliance.ts
new file mode 100644
index 00000000..3a4dcf6f
--- /dev/null
+++ b/src/app/shared/models/appliance.ts
@@ -0,0 +1,10 @@
+export class Appliance {
+ appliance_id: string;
+ builtin: boolean;
+ category: string;
+ compute_id: string;
+ default_name_format: string;
+ name: string;
+ node_type: string;
+ symbol: string;
+}
diff --git a/src/app/shared/services/appliance.service.spec.ts b/src/app/shared/services/appliance.service.spec.ts
new file mode 100644
index 00000000..5db21181
--- /dev/null
+++ b/src/app/shared/services/appliance.service.spec.ts
@@ -0,0 +1,15 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { ApplianceService } from './appliance.service';
+
+describe('ApplianceService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [ApplianceService]
+ });
+ });
+
+ it('should be created', inject([ApplianceService], (service: ApplianceService) => {
+ expect(service).toBeTruthy();
+ }));
+});
diff --git a/src/app/shared/services/appliance.service.ts b/src/app/shared/services/appliance.service.ts
new file mode 100644
index 00000000..b25812d9
--- /dev/null
+++ b/src/app/shared/services/appliance.service.ts
@@ -0,0 +1,20 @@
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+
+import 'rxjs/add/operator/map';
+import { Server } from "../models/server";
+import { HttpServer } from "./http-server.service";
+import {Appliance} from "../models/appliance";
+
+@Injectable()
+export class ApplianceService {
+
+ constructor(private httpServer: HttpServer) { }
+
+ list(server: Server): Observable {
+ return this.httpServer
+ .get(server, '/appliances')
+ .map(response => response.json() as Appliance[]);
+ }
+
+}
diff --git a/src/app/shared/services/node.service.ts b/src/app/shared/services/node.service.ts
index d7a65756..c7517c09 100644
--- a/src/app/shared/services/node.service.ts
+++ b/src/app/shared/services/node.service.ts
@@ -6,6 +6,7 @@ import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import { Server } from "../models/server";
import { HttpServer } from "./http-server.service";
+import {Appliance} from "../models/appliance";
@Injectable()
@@ -25,4 +26,10 @@ export class NodeService {
.map(response => response.json() as Node);
}
+ createFromAppliance(server: Server, project: Project, appliance: Appliance): Observable {
+ return this.httpServer
+ .post(server, `/projects/${project.project_id}/appliances/${appliance.appliance_id}`, {})
+ .map(response => response.json() as Node);
+ }
+
}