diff --git a/pdb-js/src/app/app.module.ts b/pdb-js/src/app/app.module.ts index 6771ee0..42fa956 100644 --- a/pdb-js/src/app/app.module.ts +++ b/pdb-js/src/app/app.module.ts @@ -16,11 +16,13 @@ import {MatButtonModule} from '@angular/material/button'; import {MatCheckboxModule} from '@angular/material/checkbox'; import {MatSelectModule} from '@angular/material/select'; import {MatFormFieldModule, MatInputModule} from '@angular/material'; +import {MatSnackBarModule} from '@angular/material/snack-bar'; import {MatTooltipModule} from '@angular/material/tooltip'; import { YAxisRangeComponent } from './y-axis-range/y-axis-range.component'; import { QueryAutocompleteComponent } from './query-autocomplete/query-autocomplete.component'; import { LimitByComponent } from './limit-by/limit-by.component'; import { PlotViewComponent } from './plot-view/plot-view.component'; +import { GalleryViewComponent } from './gallery-view/gallery-view.component'; @NgModule({ declarations: [ @@ -45,6 +47,7 @@ import { PlotViewComponent } from './plot-view/plot-view.component'; MatFormFieldModule, MatInputModule, MatSelectModule, + MatSnackBarModule, MatTooltipModule, BrowserAnimationsModule, HttpClientModule diff --git a/pdb-js/src/app/plot-view/plot-view.component.html b/pdb-js/src/app/plot-view/plot-view.component.html index b0ed93f..b29e64e 100644 --- a/pdb-js/src/app/plot-view/plot-view.component.html +++ b/pdb-js/src/app/plot-view/plot-view.component.html @@ -19,4 +19,3 @@ [style.width]="zoomInSliderStyleWidth" > -
{{errorMessage}}
diff --git a/pdb-js/src/app/plot-view/plot-view.component.ts b/pdb-js/src/app/plot-view/plot-view.component.ts index 5b1df8c..4ddc9a3 100644 --- a/pdb-js/src/app/plot-view/plot-view.component.ts +++ b/pdb-js/src/app/plot-view/plot-view.component.ts @@ -16,8 +16,6 @@ export class PlotViewComponent implements OnInit { imageUrl : string; - errorMessage: string; - @Output() zoomRange : EventEmitter = new EventEmitter(); diff --git a/pdb-js/src/app/visualization-page/visualization-page.component.html b/pdb-js/src/app/visualization-page/visualization-page.component.html index deebe5c..cbba769 100644 --- a/pdb-js/src/app/visualization-page/visualization-page.component.html +++ b/pdb-js/src/app/visualization-page/visualization-page.component.html @@ -89,10 +89,12 @@
- + +
diff --git a/pdb-js/src/app/visualization-page/visualization-page.component.ts b/pdb-js/src/app/visualization-page/visualization-page.component.ts index f9ce2d0..09cfcc7 100644 --- a/pdb-js/src/app/visualization-page/visualization-page.component.ts +++ b/pdb-js/src/app/visualization-page/visualization-page.component.ts @@ -2,10 +2,12 @@ import { Component, OnInit, ViewChild } from '@angular/core'; import { PlotService, PlotType, PlotRequest, PlotResponse, TagField, FilterDefaults } from '../plot.service'; import { Observable } from 'rxjs/Observable'; import { FormControl, Validators } from '@angular/forms'; +import { MatSnackBar } from '@angular/material/snack-bar'; import { LimitByComponent } from '../limit-by/limit-by.component'; import { YAxisRangeComponent } from '../y-axis-range/y-axis-range.component'; import { QueryAutocompleteComponent } from '../query-autocomplete/query-autocomplete.component'; -import {PlotViewComponent, SelectionRange, DateAnchor} from '../plot-view/plot-view.component' +import { PlotViewComponent, SelectionRange, DateAnchor } from '../plot-view/plot-view.component'; +import { GalleryViewComponent } from '../gallery-view/gallery-view.component'; import * as moment from 'moment'; @Component({ @@ -48,7 +50,14 @@ export class VisualizationPageComponent implements OnInit { enableGallery = false; splitBy = null; - constructor(private plotService: PlotService) { + constructor(private plotService: PlotService, private snackBar: MatSnackBar) { + } + + showError(message) { + this.snackBar.open(message, "", { + duration: 5000, + verticalPosition: 'top' + }); } ngOnInit() { @@ -64,6 +73,9 @@ export class VisualizationPageComponent implements OnInit { filterDefaults.fields.forEach(function(name) { that.tagFields.push(new TagField(name)); + }, + error => { + that.showError(error.error.message); }); that.groupBy = that.tagFields.filter(val => filterDefaults.groupBy.includes(val.name)); @@ -76,6 +88,9 @@ export class VisualizationPageComponent implements OnInit { if (!that.combinePlotTypes.includes(that.selectedCombinePlotType.value)){ that.selectedCombinePlotType.setValue(''); } + }, + error => { + that.showError(error.error.message); }); } @@ -95,18 +110,16 @@ export class VisualizationPageComponent implements OnInit { const that = this; this.plotService.splitQuery(this.query.query, this.splitBy.name).subscribe(function(valuesForSplitBy){ console.log("valuesForSplitBy: " + JSON.stringify(valuesForSplitBy)); - that.plotView.errorMessage = ''; }, error => { that.plotView.imageUrl = ''; - that.plotView.errorMessage = error.error.message; + that.showError(error.error.message); }); } plot(){ const that = this; - that.plotView.errorMessage = ''; that.plotView.imageUrl = ''; @@ -136,11 +149,10 @@ export class VisualizationPageComponent implements OnInit { this.plotService.sendPlotRequest(request).subscribe(function(plotResponse){ console.log("response: " + JSON.stringify(plotResponse)); that.plotView.imageUrl = "http://"+window.location.hostname+':8080/'+plotResponse.imageUrl; - that.plotView.errorMessage = ''; }, error => { that.plotView.imageUrl = ''; - that.plotView.errorMessage = error.error.message; + that.showError(error.error.message); }); }