info dialog for appiances

src/app/app.module.ts

@@ -280,6 +280,7 @@ import { ApplianceService } from './services/appliances.service';
 import { DataSourceFilter } from './filters/dataSourceFilter';
 import { ChangeHostnameActionComponent } from './components/project-map/context-menu/actions/change-hostname/change-hostname-action.component';
 import { ChangeHostnameDialogComponent } from './components/project-map/change-hostname-dialog/change-hostname-dialog.component';
+import { ApplianceInfoDialogComponent } from './components/project-map/new-template-dialog/appliance-info-dialog/appliance-info-dialog.component';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -470,7 +471,8 @@ if (environment.production) {
     WebConsoleFullWindowComponent,
     NewTemplateDialogComponent,
     ChangeHostnameActionComponent,
-    ChangeHostnameDialogComponent
+    ChangeHostnameDialogComponent,
+    ApplianceInfoDialogComponent
   ],
   imports: [
     BrowserModule,
@@ -612,7 +614,8 @@ if (environment.production) {
     ConfigDialogComponent,
     AdbutlerComponent,
     NewTemplateDialogComponent,
-    ChangeHostnameDialogComponent
+    ChangeHostnameDialogComponent,
+    ApplianceInfoDialogComponent
   ],
   bootstrap: [AppComponent]
 })

src/app/components/project-map/new-template-dialog/appliance-info-dialog/appliance-info-dialog.component.html

@@ -0,0 +1,9 @@
+<div class="title-container">
+    <h1 mat-dialog-title>appliance name</h1>
+</div>
+<div mat-dialog-content>
+    {{data.info}}
+</div>
+<div mat-dialog-actions>
+    <button mat-button (click)="onNoClick()" tabindex="-1" color="accent">Close</button>
+</div>

src/app/components/project-map/new-template-dialog/appliance-info-dialog/appliance-info-dialog.component.ts

@@ -0,0 +1,18 @@
+import { Component, Inject } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+
+@Component({
+    selector: 'appliance-info-dialog',
+    templateUrl: 'appliance-info-dialog.component.html',
+})
+export class ApplianceInfoDialogComponent {
+  
+    constructor(
+      public dialogRef: MatDialogRef<ApplianceInfoDialogComponent>,
+      @Inject(MAT_DIALOG_DATA) public data: any
+    ) {}
+  
+    onNoClick(): void {
+      this.dialogRef.close();
+    }
+}

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

@@ -1,5 +1,5 @@
 import { Component, Input, OnInit, ChangeDetectorRef, ViewChild } from '@angular/core';
-import { MatDialogRef, Sort, MatTableDataSource, MatPaginator } from '@angular/material';
+import { MatDialogRef, Sort, MatTableDataSource, MatPaginator, MatDialog } from '@angular/material';
 import { Server } from '../../../models/server';
 import { Node } from '../../../cartography/models/node';
 import { Project } from '../../../models/project';
@@ -8,6 +8,7 @@ import { Appliance } from '../../../models/appliance';
 import { animate, state, style, transition, trigger } from '@angular/animations';
 import { FileUploader, FileItem, ParsedResponseHeaders } from 'ng2-file-upload';
 import { ToasterService } from '../../../services/toaster.service';
+import { ApplianceInfoDialogComponent } from './appliance-info-dialog/appliance-info-dialog.component';
 
 @Component({
     selector: 'app-new-template-dialog',
@@ -46,7 +47,8 @@ export class NewTemplateDialogComponent implements OnInit {
         public dialogRef: MatDialogRef<NewTemplateDialogComponent>,
         private applianceService: ApplianceService,
         private changeDetector: ChangeDetectorRef,
-        private toasterService: ToasterService
+        private toasterService: ToasterService,
+        public dialog: MatDialog
     ) {}
 
     ngOnInit() {
@@ -154,6 +156,11 @@ export class NewTemplateDialogComponent implements OnInit {
 
     showInfo(object: any) {
         console.log(object);
+        
+        this.dialog.open(ApplianceInfoDialogComponent, {
+            width: '250px',
+            data: {info: 'info'}
+        });
     }
 }