From f07db3c306a7416bbe4483f5ed340d60ffbc6263 Mon Sep 17 00:00:00 2001 From: zdenevuk <zdenko.vuk@ijs.si> Date: Tue, 22 Nov 2022 14:49:03 +0100 Subject: [PATCH] if user selects for the second time the same geojson it shouldnt be downloaded once again. Has to be tested thorughly yet. one of the resets is not working fine. if user selects for the second time the same geojson it shouldnt be downloaded once again working fine. --- .../results-map/results-map.component.html | 9 +- .../results-map/results-map.component.ts | 209 +++++++++++------- 2 files changed, 130 insertions(+), 88 deletions(-) diff --git a/src/app/pages/simulation-wizard/results-map/results-map.component.html b/src/app/pages/simulation-wizard/results-map/results-map.component.html index 79d70efe..e1c6c6f0 100644 --- a/src/app/pages/simulation-wizard/results-map/results-map.component.html +++ b/src/app/pages/simulation-wizard/results-map/results-map.component.html @@ -14,16 +14,15 @@ <div id="loadGeojsonButtonsContainer"> <button nbButton - status="primary" size="small" - (click)="onLoad(l)" + (click)="onLoadClick(l.buttonLabel)" nbTooltip="Select a simulation in order to use this button. GET http://localhost:8083/dss/geojson/{id}/selectedKpi" [disabled]="selectedSimulation == undefined" [nbSpinner]="geojsonLoading" - [status]="selectedGeojson == l ? 'control' : 'primary'" - *ngFor="let l of loadGeojsonButtons" + [status]="selectedGeojson == l.buttonLabel ? 'control' : 'primary'" + *ngFor="let l of loadGeojsons" > - load {{ l }} geojson + load {{ l.buttonLabel }} geojson </button> <button nbButton diff --git a/src/app/pages/simulation-wizard/results-map/results-map.component.ts b/src/app/pages/simulation-wizard/results-map/results-map.component.ts index 3a52ce6d..c5584b28 100644 --- a/src/app/pages/simulation-wizard/results-map/results-map.component.ts +++ b/src/app/pages/simulation-wizard/results-map/results-map.component.ts @@ -25,11 +25,23 @@ export class ResultsMapComponent implements OnChanges { }; mapLegend = new L.Control({ position: "bottomright" }); radioButtonLayersControl: any; - loadGeojsonButtons: string[] = [ - "bikeability", - "bikeIntensity", - "bikeSafety", - "pollution", + loadGeojsons: Object[] = [ + { + response: undefined, + buttonLabel: "bikeability", + }, + { + response: undefined, + buttonLabel: "bikeIntensity", + }, + { + response: undefined, + buttonLabel: "bikeSafety", + }, + { + response: undefined, + buttonLabel: "pollution", + }, ]; checkedRadioButton: string = ""; geoJsonStyleWeight: number = 5; @@ -73,7 +85,7 @@ export class ResultsMapComponent implements OnChanges { // }, 1000); } - onLoad(selectedKpi: string) { + onLoadClick(selectedKpi: string) { this.selectedGeojson = selectedKpi; this.resetLayersAndButton(); this.setMapZoom(); @@ -81,88 +93,115 @@ export class ResultsMapComponent implements OnChanges { if (this.radioButtonLayersControl) this.radioButtonLayersControl.remove(this.map); - this.toastrService.show("This might take a while", "Info", { - status: "info", + this.loadGeojsons.forEach((geojson, index) => { + if (geojson["buttonLabel"] == selectedKpi) { + if (this.loadGeojsons[index]["response"] == undefined) { + this.toastrService.show("This might take a while", "Info", { + status: "info", + }); + this.geojsonLoading = true; + this.simulationService + .getGeojson(this.selectedSimulation["id"].toString(), selectedKpi) + .subscribe((res) => { + this.loadGeojsons[index]["response"] = res; + this.handleResponse( + selectedKpi, + this.loadGeojsons[index]["response"] + ); + }), + (error) => { + this.toastrService.show( + error["message"], + "Error Getting Geojson", + { + status: "danger", + } + ); + this.geojsonLoading = false; + }; + } else { + this.handleResponse( + selectedKpi, + this.loadGeojsons[index]["response"] + ); + } + } }); - this.geojsonLoading = true; - this.simulationService - .getGeojson(this.selectedSimulation["id"].toString(), selectedKpi) - .subscribe( - (res) => { - if (res["message"] == "Calculating...") { - this.toastrService.show( - "Server says: Calculating the KPI visualization. GEOJSON loading will not be completed.", - "Geojson not ready", - { - status: "danger", - duration: 10000, - } - ); - this.geojsonLoading = false; - return; - } else if (res["message"] == "Calculating the KPI visualization.") { - this.toastrService.show( - "Server says: Calculating the KPI visualization. GEOJSON loading will not be completed.", - "Geojson not ready", - { - status: "danger", - duration: 10000, - } - ); - this.geojsonLoading = false; - return; - } else if (res["message"] == "Please prepare visualizations first.") { - this.toastrService.show( - "The visualization is not prepared yet, try again in a few minutes.", - "Geojson not ready", - { - status: "danger", - duration: 10000, - } - ); - this.geojsonLoading = false; - return; - } else if (res["message"] && res["message"].length > 0) { - this.toastrService.show( - "Geojson might not be ready", - "API response contains a message", - { - status: "warning", - } - ); - } + } - this.toastrService.show("", "Geojson Loaded", { - status: "success", - }); + handleResponse(selectedKpi, res) { + this.loadGeojsons.forEach((geojson, index) => { + if (geojson["buttonLabel"] == selectedKpi) { + this.loadGeojsons[index]["response"] = res; + } + }); - const keys = this.extractKeys(res); - const propertyGeojsons = this.populatePropertyGeojsons(res, keys); - let obj = {}; - - for (let i = 0; i < propertyGeojsons.length; i++) { - if ( - propertyGeojsons[i].myKey == "link_id" || - propertyGeojsons[i].myKey == "modes" || - propertyGeojsons[i].myKey == "internal_travel_by_mode" - ) - continue; - obj[`${keys[i]}`] = propertyGeojsons[i]; - } - this.radioButtonLayersControl = new L.Control.Layers(obj, null, { - collapsed: false, - }); - this.map.addControl(this.radioButtonLayersControl); - this.addListenerToRadioButtonLayersControl(); - this.geojsonLoading = false; - }, - (error) => { - this.toastrService.show(error["message"], "Error Getting Geojson", { - status: "danger", - }); - this.geojsonLoading = false; + if (res["message"] == "Calculating...") { + this.toastrService.show( + "Server says: Calculating the KPI visualization. GEOJSON loading will not be completed.", + "Geojson not ready", + { + status: "danger", + duration: 10000, + } + ); + this.geojsonLoading = false; + return; + } else if (res["message"] == "Calculating the KPI visualization.") { + this.toastrService.show( + "Server says: Calculating the KPI visualization. GEOJSON loading will not be completed.", + "Geojson not ready", + { + status: "danger", + duration: 10000, } ); + this.geojsonLoading = false; + return; + } else if (res["message"] == "Please prepare visualizations first.") { + this.toastrService.show( + "The visualization is not prepared yet, try again in a few minutes.", + "Geojson not ready", + { + status: "danger", + duration: 10000, + } + ); + this.geojsonLoading = false; + return; + } else if (res["message"] && res["message"].length > 0) { + this.toastrService.show( + "Geojson might not be ready", + "API response contains a message", + { + status: "warning", + } + ); + } + + this.toastrService.show("", "Geojson Loaded", { + status: "success", + }); + + const keys = this.extractKeys(res); + const propertyGeojsons = this.populatePropertyGeojsons(res, keys); + let obj = {}; + + for (let i = 0; i < propertyGeojsons.length; i++) { + if ( + propertyGeojsons[i].myKey == "link_id" || + propertyGeojsons[i].myKey == "modes" || + propertyGeojsons[i].myKey == "internal_travel_by_mode" + ) + continue; + obj[`${keys[i]}`] = propertyGeojsons[i]; + } + this.radioButtonLayersControl = new L.Control.Layers(obj, null, { + collapsed: false, + }); + this.map.addControl(this.radioButtonLayersControl); + this.addListenerToRadioButtonLayersControl(); + this.geojsonLoading = false; } setLegend(legendType) { @@ -628,5 +667,9 @@ export class ResultsMapComponent implements OnChanges { ngOnChanges() { this.resetLayersAndButton(); this.selectedGeojson = ""; + + Object.entries(this.loadGeojsons).forEach((entry) => { + entry[1]["response"] = undefined; + }); } } -- GitLab