From d32c1b6112b8d1d0893d21c258c7d25f6e909a5f Mon Sep 17 00:00:00 2001 From: ziajka Date: Mon, 27 Nov 2017 11:55:20 +0100 Subject: [PATCH] Toaster - ng2-toasty, Fixes: #8 --- .angular-cli.json | 1 + package-lock.json | 5 ++ package.json | 1 + src/app/app.component.html | 1 + src/app/app.component.ts | 7 ++- src/app/app.module.ts | 48 ++++++++++---------- src/app/project-map/project-map.component.ts | 29 ++++++++---- src/app/servers/servers.component.ts | 2 +- 8 files changed, 58 insertions(+), 36 deletions(-) diff --git a/.angular-cli.json b/.angular-cli.json index 0ce55252..be4d2227 100644 --- a/.angular-cli.json +++ b/.angular-cli.json @@ -20,6 +20,7 @@ "prefix": "app", "styles": [ "../node_modules/bootstrap/dist/css/bootstrap.min.css", + "../node_modules/ng2-toasty/bundles/style-material.css", "styles.css", "theme.scss" ], diff --git a/package-lock.json b/package-lock.json index c5d87a6f..4e770737 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6219,6 +6219,11 @@ "inherits": "2.0.3" } }, + "ng2-toasty": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/ng2-toasty/-/ng2-toasty-4.0.3.tgz", + "integrity": "sha1-6njvjRh1fUHrq6Eb2fkKVD9Y/Xo=" + }, "no-case": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.2.tgz", diff --git a/package.json b/package.json index 740bd439..125dec3c 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "bootstrap": "^4.0.0-beta", "core-js": "^2.4.1", "d3-ng2-service": "^1.16.0", + "ng2-toasty": "^4.0.3", "npm-check-updates": "^2.13.0", "rxjs": "^5.4.1", "zone.js": "^0.8.14" diff --git a/src/app/app.component.html b/src/app/app.component.html index 0680b43f..ab47ef55 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1 +1,2 @@ + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index bd7a5359..2822ce86 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core'; import {Http} from "@angular/http"; import {MatIconRegistry} from "@angular/material"; import {DomSanitizer} from "@angular/platform-browser"; +import {ToastyConfig} from "ng2-toasty"; @Component({ selector: 'app-root', @@ -11,8 +12,10 @@ import {DomSanitizer} from "@angular/platform-browser"; ] }) export class AppComponent implements OnInit { - constructor(http: Http, iconReg: MatIconRegistry, sanitizer: DomSanitizer) { - iconReg.addSvgIcon('gns3', sanitizer.bypassSecurityTrustResourceUrl('./assets/gns3_icon.svg')); + constructor(http: Http, iconReg: MatIconRegistry, sanitizer: DomSanitizer, toastyConfig: ToastyConfig) { + toastyConfig.theme = 'material'; + + iconReg.addSvgIcon('gns3', sanitizer.bypassSecurityTrustResourceUrl('./assets/gns3_icon.svg')); } ngOnInit(): void { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index bc2402f6..65bade96 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -2,26 +2,7 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { HttpModule } from '@angular/http'; import { FormsModule } from '@angular/forms'; - -import { D3Service } from 'd3-ng2-service'; -import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; - -import { AppRoutingModule } from './app-routing.module'; - -import { AppComponent } from './app.component'; -import { MapComponent } from './cartography/map/map.component'; -import {CreateSnapshotDialogComponent, ProjectMapComponent} from './project-map/project-map.component'; -import { ServersComponent, AddServerDialogComponent } from './servers/servers.component'; -import { ProjectsComponent } from './projects/projects.component'; - -import { VersionService } from './shared/services/version.service'; -import { ProjectService } from './shared/services/project.service'; -import { SymbolService } from "./shared/services/symbol.service"; -import { ServerService } from "./shared/services/server.service"; -import { IndexedDbService } from "./shared/services/indexed-db.service"; -import { HttpServer } from "./shared/services/http-server.service"; -import { DefaultLayoutComponent } from './default-layout/default-layout.component'; - +import { CdkTableModule } from "@angular/cdk/table"; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { @@ -36,10 +17,30 @@ import { MatDialogModule, MatProgressBarModule } from '@angular/material'; -import {CdkTableModule} from "@angular/cdk/table"; -import {SnapshotService} from "./shared/services/snapshot.service"; +import { D3Service } from 'd3-ng2-service'; +import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; +import { ToastyModule } from 'ng2-toasty'; + +import { AppRoutingModule } from './app-routing.module'; + + +import { VersionService } from './shared/services/version.service'; +import { ProjectService } from './shared/services/project.service'; +import { SymbolService } from "./shared/services/symbol.service"; +import { ServerService } from "./shared/services/server.service"; +import { IndexedDbService } from "./shared/services/indexed-db.service"; +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 { ProjectsComponent } from './projects/projects.component'; +import { DefaultLayoutComponent } from './default-layout/default-layout.component'; import { ProgressDialogComponent } from './shared/progress-dialog/progress-dialog.component'; -import {ProgressDialogService} from "./shared/progress-dialog/progress-dialog.service"; +import { AppComponent } from './app.component'; +import { MapComponent } from './cartography/map/map.component'; +import { CreateSnapshotDialogComponent, ProjectMapComponent } from './project-map/project-map.component'; +import { ServersComponent, AddServerDialogComponent } from './servers/servers.component'; + @NgModule({ declarations: [ @@ -55,6 +56,7 @@ import {ProgressDialogService} from "./shared/progress-dialog/progress-dialog.se ], imports: [ NgbModule.forRoot(), + ToastyModule.forRoot(), BrowserModule, HttpModule, AppRoutingModule, diff --git a/src/app/project-map/project-map.component.ts b/src/app/project-map/project-map.component.ts index 4a7c797e..fac9c43d 100644 --- a/src/app/project-map/project-map.component.ts +++ b/src/app/project-map/project-map.component.ts @@ -19,11 +19,12 @@ import { MapComponent } from "../cartography/map/map.component"; import { ServerService } from "../shared/services/server.service"; import { ProjectService } from '../shared/services/project.service'; import { Server } from "../shared/models/server"; -import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from "@angular/material"; -import {SnapshotService} from "../shared/services/snapshot.service"; -import {Snapshot} from "../shared/models/snapshot"; -import {ProgressDialogService} from "../shared/progress-dialog/progress-dialog.service"; -import {ProgressDialogComponent} from "../shared/progress-dialog/progress-dialog.component"; +import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from "@angular/material"; +import { SnapshotService } from "../shared/services/snapshot.service"; +import { Snapshot } from "../shared/models/snapshot"; +import { ProgressDialogService } from "../shared/progress-dialog/progress-dialog.service"; +import { ProgressDialogComponent } from "../shared/progress-dialog/progress-dialog.component"; +import { ToastyService } from "ng2-toasty"; @Component({ @@ -50,7 +51,8 @@ export class ProjectMapComponent implements OnInit { private symbolService: SymbolService, private snapshotService: SnapshotService, private dialog: MatDialog, - private progressDialogService: ProgressDialogService) { + private progressDialogService: ProgressDialogService, + private toastyService: ToastyService) { } ngOnInit() { @@ -170,10 +172,17 @@ export class ProjectMapComponent implements OnInit { const progress = this.progressDialogService.open(); const subscription = creation.subscribe((created_snapshot: Snapshot) => { - - }, () => { - - }, () => { + this.toastyService.success({ + 'title': 'Snapshot created', + 'msg': `Snapshot '${snapshot.name}' has been created.` + }); + progress.close(); + }, (response) => { + const error = response.json(); + this.toastyService.error({ + 'title': 'Cannot create snapshot', + 'msg': error.message + }); progress.close(); }); diff --git a/src/app/servers/servers.component.ts b/src/app/servers/servers.component.ts index 4c181872..dde32c7b 100644 --- a/src/app/servers/servers.component.ts +++ b/src/app/servers/servers.component.ts @@ -66,7 +66,7 @@ export class AddServerDialogComponent { constructor( public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, serverService: ServerService) { + @Inject(MAT_DIALOG_DATA) public data: any) { } onAddClick(): void {