From 9e544e53b53a44fe829cbfc5abb21b5daa875517 Mon Sep 17 00:00:00 2001 From: Lucas Li Date: Wed, 22 May 2024 15:55:11 -0700 Subject: [PATCH 1/5] 2182 2183 2185 --- .../incident-info-header/incident-header-panel.component.scss | 3 +-- .../incident-info-header/incident-header-panel.component.ts | 2 +- client/wfnews-war/src/main/angular/src/app/utils/index.ts | 3 +++ 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.scss b/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.scss index 6109416f38..155d2f491d 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.scss +++ b/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.scss @@ -57,7 +57,7 @@ .incident-details.desktop{ flex:1; max-width: 50%; - padding: 32px 96px; + padding: 32px 48px; display: flex; flex-direction: column; align-items: center; @@ -321,7 +321,6 @@ gap: var(--16, 16px); margin-top: 12px; margin-bottom: 10px; - width:80%; .order-count { width: 90%; font-size: 16px; diff --git a/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.ts b/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.ts index 08eb7aa1ca..3a8976e697 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.ts +++ b/client/wfnews-war/src/main/angular/src/app/components/public-incident-page/incident-info-header/incident-header-panel.component.ts @@ -268,7 +268,7 @@ export class IncidentHeaderPanel implements AfterViewInit { back() { if (this.params && this.params['source'] && this.params['source'][0]) { - if (this.params['source'][0] === 'map') { + if (this.params['source'] === 'map' || this.params['source'][0] === 'map') { this.backToMap(); } else if ( this.params['source'][0] === 'full-details' && diff --git a/client/wfnews-war/src/main/angular/src/app/utils/index.ts b/client/wfnews-war/src/main/angular/src/app/utils/index.ts index 04a4e44570..ca5b1ee7ad 100644 --- a/client/wfnews-war/src/main/angular/src/app/utils/index.ts +++ b/client/wfnews-war/src/main/angular/src/app/utils/index.ts @@ -570,6 +570,9 @@ export function convertToDateTimeTimeZone(date) { year: 'numeric', month: 'long', day: 'numeric', + hour: 'numeric', + minute: 'numeric', + second: undefined, // this removes the seconds }; let convertedDate: string; convertedDate = date From 04e8a0abbb487dc4a4debe9ecdfdea9fe319827a Mon Sep 17 00:00:00 2001 From: Lucas Li Date: Thu, 11 Jul 2024 23:05:08 -0700 Subject: [PATCH 2/5] 2305 --- .../draggable-panel.component.html | 571 +++++++++--------- .../draggable-panel.component.scss | 41 +- 2 files changed, 318 insertions(+), 294 deletions(-) diff --git a/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.html b/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.html index 1d74d4de64..33f9283a4d 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.html +++ b/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.html @@ -4,234 +4,235 @@
{{currentIncidentRefs.length}} Results
-
-
Wildfires
-
-
-
- icon - - {{displayWildfireName(wildfire)}} -
-
- +
+
+
Wildfires
+
+
+
+ icon + + {{displayWildfireName(wildfire)}} +
+
+ +
-
-
-
Fire Perimeters
-
-
-
- {{firePerimeter.title}} -
-
- +
+
Fire Perimeters
+
+
+
+ {{firePerimeter.title}} +
+
+ +
-
-
-
Evacuations
-
-
-
- Order - Order +
+
Evacuations
+
+
+
+ Order + Order - Evacuation {{evac.properties.ORDER_ALERT_STATUS}} for {{evac.properties.EVENT_NAME}} -
-
- + Evacuation {{evac.properties.ORDER_ALERT_STATUS}} for {{evac.properties.EVENT_NAME}} +
+
+ +
-
-
-
Area Restrictions
-
-
-
- Area Restrictions - {{decode(areaRestriction.properties.NAME)}} -
-
- +
+
Area Restrictions
+
+
+
+ Area Restrictions + {{decode(areaRestriction.properties.NAME)}} +
+
+ +
-
-
-
Fire Bans and Prohibitions
-
-
-
- Ban - Fire Ban on {{ban.title}} -
-
- +
+
Fire Bans and Prohibitions
+
+
+
+ Ban + Fire Ban on {{ban.title}} +
+
+ +
-
-
-
Fire Danger Rating
-
-
-
-
- Fire Danger - {{danger.properties.DANGER_RATING_DESC}} Fire Danger -
-
- Fire Danger - {{danger.properties.DANGER_RATING_DESC}} Fire Danger -
-
- Fire Danger - {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
+
Fire Danger Rating
+
+
+
+
+ Fire Danger + {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
+
+ Fire Danger + {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
+
+ Fire Danger + {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
+
+ Fire Danger + {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
+
+ Fire Danger + {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
-
- Fire Danger - {{danger.properties.DANGER_RATING_DESC}} Fire Danger +
+
-
- Fire Danger - {{danger.properties.DANGER_RATING_DESC}} Fire Danger -
-
-
-
-
-
-
Road Events
-
-
-
- ban - {{event.title}} -
-
- +
+
Road Events
+
+
+
+ ban + {{event.title}} +
+
+ +
-
-
-
Closed Recreation Sites
-
-
-
- closed-recreation-site - {{closedRecreationSite.title}} -
-
- +
+
Closed Recreation Sites
+
+
+
+ closed-recreation-site + {{closedRecreationSite.title}} +
+
+ +
-
-
-
Forest Service Roads
-
-
-
- {{forestServiceRoad.title}} -
-
- +
+
Forest Service Roads
+
+
+
+ {{forestServiceRoad.title}} +
+
+ +
-
-
-
Protected Lands Access Restrictions
-
-
-
- {{protectedLandsAccessRestriction.title}} -
-
- +
+
Protected Lands Access Restrictions
+
+
+
+ {{protectedLandsAccessRestriction.title}} +
+
+ +
-
-
-
Regional Districts
-
-
-
- regional-districts - {{regionalDistrict.title}} -
-
- +
+
Regional Districts
+
+
+
+ regional-districts + {{regionalDistrict.title}} +
+
+ +
-
-
-
Municipalities
-
-
-
- municipalities - {{municipality.title}} -
-
- +
+
Municipalities
+
+
+
+ municipalities + {{municipality.title}} +
+
+ +
-
-
-
First Nations Treaty Land
-
-
-
- first-nations-treaty-land - {{firstNationsTreatyLand.title}} -
-
- +
+
First Nations Treaty Land
+
+
+
+ first-nations-treaty-land + {{firstNationsTreatyLand.title}} +
+
+ +
-
-
-
Indian Reserve
-
-
-
- indian-reserve - {{indianReserve.title}} -
-
- +
+
Indian Reserve
+
+
+
+ indian-reserve + {{indianReserve.title}} +
+
+ +
-
- +
Active Weather Stations
@@ -267,30 +268,32 @@
-
-
{{identifyIncident.incidentName}}
-
- - {{getStageOfControlLabel(identifyIncident.stageOfControlCode)}} -
-
- icon - {{identifyIncident.fireCentreName}} -
-
- icon - {{identifyIncident.incidentSizeEstimatedHa}} Hectares -
-
- icon - Discovered on {{convertToDateYear(identifyIncident.discoveryDate)}} -
-
-
- This wildfire is highly visible or poses a potential threat to public safety. +
+
+
{{identifyIncident.incidentName}}
+
+ + {{getStageOfControlLabel(identifyIncident.stageOfControlCode)}}
-
- {{getStageOfControlDescription(identifyIncident.stageOfControlCode)}} +
+ icon + {{identifyIncident.fireCentreName}} +
+
+ icon + {{ identifyIncident.incidentSizeEstimatedHa }} {{ identifyIncident.incidentSizeEstimatedHa == 1 ? 'Hectare' : 'Hectares' }} +
+
+ icon + Discovered on {{convertToDateYear(identifyIncident.discoveryDate)}} +
+
+
+ This wildfire is highly visible or poses a potential threat to public safety. +
+
+ {{getStageOfControlDescription(identifyIncident.stageOfControlCode)}} +
@@ -328,22 +331,24 @@
-
-
{{displayEvacTitle(identifyItem)}}
-
- icon - Issued on {{formatDate(identifyItem.properties.DATE_MODIFIED)}} -
-
- icon - Issued by {{identifyItem.properties.ISSUING_AGENCY}} -
-
-
- An evacuation alert is a warning about a potential threat to life and/or property. It is intended to give you time to be ready for a possible evacuation. Follow instructions from your local government or First Nation. +
+
+
{{displayEvacTitle(identifyItem)}}
+
+ icon + Issued on {{formatDate(identifyItem.properties.DATE_MODIFIED)}}
-
- People in this area are at risk and should leave the area immediately. Failing to leave puts you and others at risk. +
+ icon + Issued by {{identifyItem.properties.ISSUING_AGENCY}} +
+
+
+ An evacuation alert is a warning about a potential threat to life and/or property. It is intended to give you time to be ready for a possible evacuation. Follow instructions from your local government or First Nation. +
+
+ People in this area are at risk and should leave the area immediately. Failing to leave puts you and others at risk. +
@@ -403,57 +408,59 @@
-
-
{{decode(identifyItem.properties.NAME)}}
-
Fire Ban on {{identifyItem.title}}
-
{{identifyItem.properties.PROJECT_NAME}}
-
{{identifyItem.title}}
-
{{identifyItem.properties.PROTECTED_LANDS_NAME}}
-
{{displayForestServiceRoadsAlert(identifyItem.properties)}}
-
{{identifyItem.title}}
- - -
- {{identifyItem.properties.SEVERITY[0].toUpperCase() + identifyItem.properties.SEVERITY.slice(1).toLowerCase()}} Severity -
-
- {{identifyItem.properties.ACCESS_STATUS}} -
+
+
+
{{decode(identifyItem.properties.NAME)}}
+
Fire Ban on {{identifyItem.title}}
+
{{identifyItem.properties.PROJECT_NAME}}
+
{{identifyItem.title}}
+
{{identifyItem.properties.PROTECTED_LANDS_NAME}}
+
{{displayForestServiceRoadsAlert(identifyItem.properties)}}
+
{{identifyItem.title}}
+ + +
+ {{identifyItem.properties.SEVERITY[0].toUpperCase() + identifyItem.properties.SEVERITY.slice(1).toLowerCase()}} Severity +
+
+ {{identifyItem.properties.ACCESS_STATUS}} +
-
- {{displayLocalAuthorityType(identifyItem.layerId)}} -
+
+ {{displayLocalAuthorityType(identifyItem.layerId)}} +
-
- icon - icon +
+ icon + icon - Ban + Ban - {{identifyItem.properties.FIRE_CENTRE_NAME ? identifyItem.properties.FIRE_CENTRE_NAME : null}} - {{identifyItem.properties.FIRE_CENTRE_NAME ? identifyItem.properties.FIRE_CENTRE_NAME + ' Fire Centre' : null}} - {{identifyItem.properties.RECREATION_DISTRICT_NAME}} - {{identifyItem.properties.AREA }} - Campfire Ban + {{identifyItem.properties.FIRE_CENTRE_NAME ? identifyItem.properties.FIRE_CENTRE_NAME : null}} + {{identifyItem.properties.FIRE_CENTRE_NAME ? identifyItem.properties.FIRE_CENTRE_NAME + ' Fire Centre' : null}} + {{identifyItem.properties.RECREATION_DISTRICT_NAME}} + {{identifyItem.properties.AREA }} + Campfire Ban -
-
- icon - Issued on {{formatDate(identifyItem.properties.ACCESS_STATUS_EFFECTIVE_DATE)}} - Closed on {{convertToDateYear(identifyItem.properties.CLOSURE_DATE)}} - Created on {{convertToDateYear(identifyItem.properties.CREATED_TIME)}} - Effective on {{formatDate(identifyItem.properties.ACCESS_STATUS_EFFECTIVE_DATE)}} +
+
+ icon + Issued on {{formatDate(identifyItem.properties.ACCESS_STATUS_EFFECTIVE_DATE)}} + Closed on {{convertToDateYear(identifyItem.properties.CLOSURE_DATE)}} + Created on {{convertToDateYear(identifyItem.properties.CREATED_TIME)}} + Effective on {{formatDate(identifyItem.properties.ACCESS_STATUS_EFFECTIVE_DATE)}} -
-
-
- Access to this area is prohibited in order to limit the risk of a fire, to address a public safety concern or to avoid interference with fire control. - Decisions on when and where to implement fire bans and restrictions are made by B.C.’s regional fire centres. - The Recreation Site/Trail is closed due to an active wildfire in the area. Find further information at www.bcwildfire.ca - {{identifyItem.properties.DESCRIPTION}} - {{identifyItem.properties.ACCESS_DETAILS}} - {{identifyItem.properties.INFORMATION}} - The best information sources related to evacuations are your municipality, regional district, First Nation or local authority. +
+
+
+ Access to this area is prohibited in order to limit the risk of a fire, to address a public safety concern or to avoid interference with fire control. + Decisions on when and where to implement fire bans and restrictions are made by B.C.’s regional fire centres. + The Recreation Site/Trail is closed due to an active wildfire in the area. Find further information at www.bcwildfire.ca + {{identifyItem.properties.DESCRIPTION}} + {{identifyItem.properties.ACCESS_DETAILS}} + {{identifyItem.properties.INFORMATION}} + The best information sources related to evacuations are your municipality, regional district, First Nation or local authority. +
@@ -484,11 +491,13 @@
-
-
{{identifyItem.properties.DANGER_RATING_DESC}} Fire Danger
-
-
- {{displayDangerRatingDescription(identifyItem.properties.DANGER_RATING_DESC)}} +
+
+
{{identifyItem.properties.DANGER_RATING_DESC}} Fire Danger
+
+
+ {{displayDangerRatingDescription(identifyItem.properties.DANGER_RATING_DESC)}} +
@@ -519,28 +528,30 @@
-
-
Weather Station: {{identifyItem.title}}
- -
- Today at {{convertStationHour(identifyItem.data.validHour.hour)}} -
-
- icon - {{identifyItem.data.validHour.temp}}° C -
-
- icon - Precipitation: {{identifyItem.data.validHour.precipitation}}mm | Humidity: {{identifyItem.data.validHour.relativeHumidity}}% -
-
- icon - Wind: {{identifyItem.data.validHour.windSpeed}}km/h {{identifyItem.data.validHour.windCardinalDir}} -
- -
-
No current weather reading found for this station
-
+
+
+
Weather Station: {{identifyItem.title}}
+ +
+ Today at {{convertStationHour(identifyItem.data.validHour.hour)}} +
+
+ icon + {{identifyItem.data.validHour.temp}}° C +
+
+ icon + Precipitation: {{identifyItem.data.validHour.precipitation}}mm | Humidity: {{identifyItem.data.validHour.relativeHumidity}}% +
+
+ icon + Wind: {{identifyItem.data.validHour.windSpeed}}km/h {{identifyItem.data.validHour.windCardinalDir}} +
+ +
+
No current weather reading found for this station
+
+
diff --git a/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss b/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss index eab431ea07..b9bd851581 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss +++ b/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss @@ -15,9 +15,11 @@ .panel-container { font-weight: 600; - overflow: auto; + overflow: hidden; height: 90%; border-radius: 20px; + display: flex; + flex-direction: column; .draggable-panel-title { background-color: white; @@ -41,6 +43,10 @@ } } + .criteria-container{ + overflow: scroll; + } + .criteria-title { font-size: 18px; color: #242424; @@ -160,9 +166,14 @@ } } + .identify-card-container { + flex: 1; + overflow: scroll; + margin: 16px 20px 24px 20px; + } + .identify-card { display: flex; - margin: 16px 20px 24px 20px; flex-direction: column; align-items: flex-start; gap: 4px; @@ -173,13 +184,11 @@ .identify-card-item { display: inline-flex; color: var(--grays-gray-2, #484848); - font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, - sans-serif; + font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, sans-serif; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; - /* 146.667% */ letter-spacing: -0.408px; align-items: center; } @@ -191,9 +200,7 @@ .identify-card-description { color: var(--grays-gray-2, #484848); - /* Body/Body 2 */ - font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, - sans-serif; + font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, sans-serif; font-size: 15px; font-style: normal; font-weight: 400; @@ -210,7 +217,7 @@ background-color: white; justify-content: space-between; gap: 16px; - padding: 24px 20px 0 20px; + padding: 0 20px; align-items: center; .divider { @@ -225,8 +232,7 @@ .mobile-button { width: 100%; - font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, - sans-serif; + font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, sans-serif; font-size: 16px; font-style: normal; font-weight: 600; @@ -239,8 +245,7 @@ .mobile-button-primary { width: 100%; - font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, - sans-serif; + font-family: "Noto sans", "BCSans", "Open Sans", Verdana, Arial, sans-serif; font-size: 16px; font-style: normal; font-weight: 600; @@ -262,4 +267,12 @@ font-size: 16px; font-weight: 600; margin-left: auto; -} \ No newline at end of file +} + +::-webkit-scrollbar { + display: inline; +} + +* { + scrollbar-width: thin; +} From 1b739b1ee79a8877d13c09c01aac772def94b3a8 Mon Sep 17 00:00:00 2001 From: Lucas Li Date: Fri, 12 Jul 2024 14:34:40 -0700 Subject: [PATCH 3/5] make scrollbar always visable --- .../draggable-panel.component.scss | 24 +++++++++++++++---- 1 file changed, 20 insertions(+), 4 deletions(-) diff --git a/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss b/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss index b9bd851581..862af1146e 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss +++ b/client/wfnews-war/src/main/angular/src/app/components/draggable-panel/draggable-panel.component.scss @@ -44,7 +44,7 @@ } .criteria-container{ - overflow: scroll; + overflow-y: scroll !important; } .criteria-title { @@ -168,7 +168,7 @@ .identify-card-container { flex: 1; - overflow: scroll; + overflow-y: scroll !important; margin: 16px 20px 24px 20px; } @@ -273,6 +273,22 @@ display: inline; } -* { - scrollbar-width: thin; + + +::-webkit-scrollbar { + -webkit-appearance: none; +} + +::-webkit-scrollbar:vertical { + width: 8px; +} + +::-webkit-scrollbar-thumb { + background: #888; + border-radius: 24px; } + +::-webkit-scrollbar-track { + background: white; + border-radius: 24px; +} \ No newline at end of file From a5de6e82b4b1476943c0deb17002937a8f5017cd Mon Sep 17 00:00:00 2001 From: Lucas Li Date: Fri, 12 Jul 2024 15:07:25 -0700 Subject: [PATCH 4/5] make scrollbar always visable --- .../active-wildfire-map.component.ts | 115 ++++++++++-------- 1 file changed, 61 insertions(+), 54 deletions(-) diff --git a/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts b/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts index 885cd773c0..6ff11beeea 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts +++ b/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts @@ -412,6 +412,11 @@ export class ActiveWildfireMapComponent implements OnInit, AfterViewInit { .then(() => { const deviceConfig = { viewer: { device: 'desktop' } }; this.mapConfig = [...mapConfig, deviceConfig, 'theme=wf', '?']; + this.isMapLoaded = true; + }) + .catch((error) => { + console.error('Error loading map:', error); + this.isMapLoaded = false; }); }); this.activedRouter.queryParams.subscribe((params: ParamMap) => { @@ -977,61 +982,63 @@ async onSelectIncidents(incidentRefs) { { itemId: 'radar-1km-rrai--radarurpprecipr14-linear', visible: false }, { itemId: 'weather-stations', visible: true }, ]; - - switch (this.selectedLayer) { - case 'evacuation-orders-and-alerts': - layers[1].visible = true; - layers[2].visible = true; - break; - - case 'area-restrictions': - layers[6].visible = true; - // gives a 404 error from SMK - // layers[7].visible = true; - break; - - case 'bans-and-prohibitions': - layers[5].visible = true; - layers[19].visible = true; - layers[20].visible = true; - layers[21].visible = true; - break; - - case 'smoke-forecast': - layers[14].visible = true; - break; - - case 'fire-danger': - layers[0].visible = true; - layers[3].visible = true; - break; - - case 'local-authorities': - layers[15].visible = true; - layers[16].visible = true; - layers[17].visible = true; - layers[18].visible = true; - break; - - case 'routes-impacted': - layers[11].visible = true; - break; - - case 'out-fires': - layers[9].visible = true; - break; - - case 'all-layers': - break; - - default: - layers[0].visible = true; - layers[22].visible = true; - layers[23].visible = true; - layers[24].visible = true; - layers[25].visible = true; + try { + switch (this.selectedLayer) { + case 'evacuation-orders-and-alerts': + layers[1].visible = true; + layers[2].visible = true; + break; + + case 'area-restrictions': + layers[6].visible = true; + // gives a 404 error from SMK + // layers[7].visible = true; + break; + + case 'bans-and-prohibitions': + layers[5].visible = true; + layers[19].visible = true; + layers[20].visible = true; + layers[21].visible = true; + break; + + case 'smoke-forecast': + layers[14].visible = true; + break; + + case 'fire-danger': + layers[0].visible = true; + layers[3].visible = true; + break; + + case 'local-authorities': + layers[15].visible = true; + layers[16].visible = true; + layers[17].visible = true; + layers[18].visible = true; + break; + + case 'routes-impacted': + layers[11].visible = true; + break; + + case 'out-fires': + layers[9].visible = true; + break; + + case 'all-layers': + break; + + default: + layers[0].visible = true; + layers[22].visible = true; + layers[23].visible = true; + layers[24].visible = true; + layers[25].visible = true; + } + } catch (error) { + console.error('Error activating layers:', error); } - // initialize smkApi if undefined if (!this.smkApi) { let event: Event; From 0cc7fc1ec0fd7e3a01137768460c29ff9a00ddb4 Mon Sep 17 00:00:00 2001 From: Lucas Li Date: Fri, 12 Jul 2024 15:11:46 -0700 Subject: [PATCH 5/5] more error handler --- .../active-wildfire-map.component.ts | 111 ++++++++++-------- 1 file changed, 60 insertions(+), 51 deletions(-) diff --git a/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts b/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts index 6ff11beeea..b18de5d0d6 100644 --- a/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts +++ b/client/wfnews-war/src/main/angular/src/app/components/active-wildfire-map/active-wildfire-map.component.ts @@ -827,75 +827,84 @@ async onSelectIncidents(incidentRefs) { } } - async initializeLayers() { +async initializeLayers() { + try { const selectedLayer = await Preferences.get({ key: 'selectedLayer' }); - this.selectedLayer = - (selectedLayer.value as SelectedLayer) || 'wildfire-stage-of-control'; + this.selectedLayer = (selectedLayer.value as SelectedLayer) || 'wildfire-stage-of-control'; this.onSelectLayer(this.selectedLayer); this.isMapLoaded = true; this.notificationService .getUserNotificationPreferences() .then((response) => { - const SMK = window['SMK']; - const map = getActiveMap(SMK).$viewer.map; + try { + const SMK = window['SMK']; + const map = getActiveMap(SMK).$viewer.map; - if (!response.notifications) { - return; - } - - map.on('zoomend', () => { - this.updateSavedLocationLabelVisibility(); - }); - - this.resizeObserver = new ResizeObserver(() => { - map.invalidateSize(); - }); + if (!response.notifications) { + return; + } - this.resizeObserver.observe(map._container); - - for (const smkMap in SMK.MAP) { - if (Object.hasOwn(SMK.MAP, smkMap)) { - const savedLocationMarker = { - icon: L.icon({ - iconUrl: - '/assets/images/svg-icons/blue-white-location-icon.svg', - iconSize: [32, 32], - iconAnchor: [16, 32], - popupAnchor: [0, -32], - }), - draggable: false, - }; - for (const item of response.notifications) { - L.marker( - [item.point.coordinates[1], item.point.coordinates[0]], - savedLocationMarker, - ).addTo(getActiveMap(this.SMK).$viewer.map); - const label = L.marker( - [item.point.coordinates[1], item.point.coordinates[0]], - { - icon: L.divIcon({ - className: 'marker-label', - html: `
{ + this.updateSavedLocationLabelVisibility(); + }); + + this.resizeObserver = new ResizeObserver(() => { + map.invalidateSize(); + }); + + this.resizeObserver.observe(map._container); + + for (const smkMap in SMK.MAP) { + if (Object.hasOwn(SMK.MAP, smkMap)) { + const savedLocationMarker = { + icon: L.icon({ + iconUrl: '/assets/images/svg-icons/blue-white-location-icon.svg', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32], + }), + draggable: false, + }; + for (const item of response.notifications) { + try { + L.marker( + [item.point.coordinates[1], item.point.coordinates[0]], + savedLocationMarker, + ).addTo(getActiveMap(this.SMK).$viewer.map); + const label = L.marker( + [item.point.coordinates[1], item.point.coordinates[0]], + { + icon: L.divIcon({ + className: 'marker-label', + html: `
${item.notificationName}
`, - }), - }, - ); - label.addTo(getActiveMap(this.SMK).$viewer.map); - this.savedLocationlabels.push(label); - this.savedLocationlabelsToShow.push(label); + }), + }, + ); + label.addTo(getActiveMap(this.SMK).$viewer.map); + this.savedLocationlabels.push(label); + this.savedLocationlabelsToShow.push(label); + } catch (markerError) { + console.error('Error adding marker or label:', markerError); + } + } } } + map.invalidateSize(); + } catch (smkError) { + console.error('Error in SMK setup:', smkError); } - map.invalidateSize(); }) - .catch((error) => { - console.error(error); + .catch((notificationError) => { + console.error('Error fetching user notification preferences:', notificationError); }); this.cdr.detectChanges(); + } catch (initializationError) { + console.error('Error during layer initialization:', initializationError); } - +} private updateSavedLocationLabelVisibility() { // showing the savedLocation label only start with zoom level 5 const map = getActiveMap(this.SMK).$viewer.map;