From fe8e2569c82e7861de2d2edb9cf6e757eace91c4 Mon Sep 17 00:00:00 2001 From: zdenevuk <zdenko.vuk@ijs.si> Date: Mon, 19 Dec 2022 15:58:00 +0100 Subject: [PATCH] This is a combination of 2 commits. just removed a log some updates --- .../results-map/results-map.component.html | 7 +- .../results-map/results-map.component.ts | 86 +++++++++++-------- 2 files changed, 55 insertions(+), 38 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 2db75993..19dd0832 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 @@ -65,7 +65,10 @@ </div> </div> <div id="inputsLegendContainer"> - <form [formGroup]="newBrinkValues" (ngSubmit)="onApplyNewValuesSubmit()"> + <form + [formGroup]="newBrinkValuesForm" + (ngSubmit)="onApplyNewValuesSubmit()" + > <div> <div> <label for="">1st color, up to</label> @@ -131,7 +134,7 @@ nbButton status="primary" type="submit" - [disabled]="!newBrinkValues.dirty" + [disabled]="!newBrinkValuesForm.dirty" > Apply new values </button> 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 9ff09a5d..54ecdc05 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 @@ -1,4 +1,10 @@ -import { Component, Input, TemplateRef, OnChanges } from "@angular/core"; +import { + Component, + Input, + TemplateRef, + OnChanges, + OnInit, +} from "@angular/core"; import * as L from "leaflet"; import { SimulationService } from "../utils/services/simulation.service"; import * as MapColors from "./map-colors-local"; @@ -13,7 +19,7 @@ import { FormControl, FormGroup } from "@angular/forms"; templateUrl: "./results-map.component.html", styleUrls: ["./results-map.component.scss"], }) -export class ResultsMapComponent implements OnChanges { +export class ResultsMapComponent implements OnInit, OnChanges { @Input() selectedSimulation: Simulation; public map: L.Map; options = { @@ -35,7 +41,7 @@ export class ResultsMapComponent implements OnChanges { grayscale: number = 50; loadGeojsons: Object[] = []; maxKeyValues: Object = {}; - newBrinkValues = new FormGroup({ + newBrinkValuesForm = new FormGroup({ legend_0: new FormControl(undefined), legend_1: new FormControl(undefined), legend_2: new FormControl(undefined), @@ -53,6 +59,10 @@ export class ResultsMapComponent implements OnChanges { private dialogService: NbDialogService, private networkService: NetworkService ) {} + ngOnInit(): void { + this.newBrinkValuesForm.disable(); + } + onMapReady(map: L.Map) { this.map = map; this.grayscaleChange(); @@ -63,28 +73,28 @@ export class ResultsMapComponent implements OnChanges { this.setMapPositionAndZoom(res); }); }, 50); - setTimeout(() => { - console.log( - "%cTemporary", - "background: peru; font-weight: bold; color: black; font-family: serif; padding: 0 10px;" - ); - const celkomplet: HTMLElement = document.querySelectorAll( - ".buttons" - )[0] as HTMLElement; - celkomplet.style.display = "none"; - }, 825); - setTimeout(() => { - const celkomplet1: HTMLElement = document.querySelectorAll( - ".appearance-filled.size-medium.shape-rectangle.status-primary.ng-star-inserted.nb-transition" - )[1] as HTMLElement; - celkomplet1.click(); - }, 1000); - setTimeout(() => { - const celkomplet2: HTMLElement = document.querySelectorAll( - "#loadGeojsonButtonsContainer button" - )[1] as HTMLElement; - celkomplet2.click(); - }, 1050); + // setTimeout(() => { + // console.log( + // "%cTemporary", + // "background: peru; font-weight: bold; color: black; font-family: serif; padding: 0 10px;" + // ); + // const celkomplet: HTMLElement = document.querySelectorAll( + // ".buttons" + // )[0] as HTMLElement; + // celkomplet.style.display = "none"; + // }, 825); + // setTimeout(() => { + // const celkomplet1: HTMLElement = document.querySelectorAll( + // ".appearance-filled.size-medium.shape-rectangle.status-primary.ng-star-inserted.nb-transition" + // )[1] as HTMLElement; + // celkomplet1.click(); + // }, 1000); + // setTimeout(() => { + // const celkomplet2: HTMLElement = document.querySelectorAll( + // "#loadGeojsonButtonsContainer button" + // )[1] as HTMLElement; + // celkomplet2.click(); + // }, 1050); // setTimeout(() => { // const celkomplet3: HTMLElement = document.querySelectorAll( // ".leaflet-control-layers-selector" @@ -249,11 +259,11 @@ export class ResultsMapComponent implements OnChanges { if (this.newBrinkValuesApplied == true) { grades = [ 0, - this.newBrinkValues.get("legend_0").value, - this.newBrinkValues.get("legend_1").value, - this.newBrinkValues.get("legend_2").value, - this.newBrinkValues.get("legend_3").value, - this.newBrinkValues.get("legend_4").value, + this.newBrinkValuesForm.get("legend_0").value, + this.newBrinkValuesForm.get("legend_1").value, + this.newBrinkValuesForm.get("legend_2").value, + this.newBrinkValuesForm.get("legend_3").value, + this.newBrinkValuesForm.get("legend_4").value, ]; } else { grades = [ @@ -292,7 +302,9 @@ export class ResultsMapComponent implements OnChanges { "'>■</span> " + grades[i] + (grades[i + 1] ? "–" + grades[i + 1] + "</p>" : "+</p>"); - this.newBrinkValues.get(`legend_${i - 1}`).setValue(`${grades[i]}`); + this.newBrinkValuesForm + .get(`legend_${i - 1}`) + .setValue(`${grades[i]}`); } } else { div.innerHTML += @@ -310,7 +322,9 @@ export class ResultsMapComponent implements OnChanges { grades[i] + (grades[i + 1] ? "–" + grades[i + 1] + "</p>" : "+</p>"); - this.newBrinkValues.get(`legend_${i - 1}`).setValue(`${grades[i]}`); + this.newBrinkValuesForm + .get(`legend_${i - 1}`) + .setValue(`${grades[i]}`); } } @@ -514,7 +528,7 @@ export class ResultsMapComponent implements OnChanges { style: (feature) => ({ weight: this.geoJsonStyleWeight, color: MapColors.getNewColor( - this.newBrinkValues, + this.newBrinkValuesForm, feature["properties"], keys[f], parseInt(feature["properties"]["capacity"]) == 9999 @@ -535,7 +549,7 @@ export class ResultsMapComponent implements OnChanges { style: (feature) => ({ weight: this.geoJsonStyleWeight, color: MapColors.getNewColor( - this.newBrinkValues, + this.newBrinkValuesForm, feature["properties"], keys[f], parseInt(feature["properties"]["capacity"]) == 9999 @@ -553,7 +567,7 @@ export class ResultsMapComponent implements OnChanges { }); } } else { - // default, newBrinkValues not applied + // default, newBrinkValuesForm not applied if (keys[f] == "capacity") { tmp = L.geoJSON(<any>jsonFile, { style: (feature) => ({ @@ -658,9 +672,9 @@ export class ResultsMapComponent implements OnChanges { public addListenerToRadioButtonLayersControlAndSetLegend() { this.map.on("baselayerchange", (e) => { - console.log(" I ho pauroa d i te"); this.setLegend(e["name"]); this.checkedRadioButton = e["name"]; + this.newBrinkValuesForm.enable(); }); } -- GitLab