From fa9ce162eeade1d55d389939d1d799bcba1c28c2 Mon Sep 17 00:00:00 2001 From: MatthewMuehlhauserNRCan Date: Thu, 28 Nov 2024 14:09:24 -0500 Subject: [PATCH] Issue #2488 - Refresh GeoCore Layers on Language Change (#2610) * Refresh layers on language change (2488) and CSS for datatable scrolling * Added Reset Layer Checkmark to Navigator page * 2488 refresh layers alternate solution * Ensure registered layer paths are removed * Update method name and comments. * Added filter to Promise.allSettled --- .../public/templates/demos-navigator.html | 5 +- .../src/core/components/guide/guide-panel.tsx | 2 +- .../layer/layer-sets/abstract-layer-set.ts | 3 ++ packages/geoview-core/src/geo/layer/layer.ts | 49 +++++++++++++++++++ .../geoview-core/src/geo/map/map-viewer.ts | 10 ++-- packages/geoview-core/src/ui/style/style.css | 6 +++ 6 files changed, 69 insertions(+), 6 deletions(-) diff --git a/packages/geoview-core/public/templates/demos-navigator.html b/packages/geoview-core/public/templates/demos-navigator.html index 45ff08ce426..d90fe683a05 100644 --- a/packages/geoview-core/public/templates/demos-navigator.html +++ b/packages/geoview-core/public/templates/demos-navigator.html @@ -162,6 +162,8 @@

Configurations Navigator

+ +

Display Theme:

@@ -272,8 +274,9 @@

Configurations Navigator

// ------------------ SWITCHER SECTION START ----------------------------------------- const switchLang = document.getElementById('switchLang'); + const resetLayer = document.getElementById('resetLayer'); switchLang.addEventListener('change', (e) => { - cgpv.api.maps['sandboxMap'].setLanguage(e.target.value); + cgpv.api.maps['sandboxMap'].setLanguage(e.target.value, resetLayer.checked); }); const switchThemeElem = document.getElementById('switchTheme'); diff --git a/packages/geoview-core/src/core/components/guide/guide-panel.tsx b/packages/geoview-core/src/core/components/guide/guide-panel.tsx index b8fcda7fd14..83f05df8f0e 100644 --- a/packages/geoview-core/src/core/components/guide/guide-panel.tsx +++ b/packages/geoview-core/src/core/components/guide/guide-panel.tsx @@ -105,7 +105,7 @@ export function GuidePanel({ fullWidth }: GuidePanelType): JSX.Element { fullWidth={fullWidth} aria-label={t('guide.title')} > - + {layersList[guideItemIndex]?.content} diff --git a/packages/geoview-core/src/geo/layer/layer-sets/abstract-layer-set.ts b/packages/geoview-core/src/geo/layer/layer-sets/abstract-layer-set.ts index 0b9e30c1237..c34b761eff2 100644 --- a/packages/geoview-core/src/geo/layer/layer-sets/abstract-layer-set.ts +++ b/packages/geoview-core/src/geo/layer/layer-sets/abstract-layer-set.ts @@ -285,6 +285,9 @@ export abstract class AbstractLayerSet { // Delete the result set for the layer path delete this.resultSet[layerPath]; + // Remove layer path from registered layer paths + this.#registeredLayerLayerPaths = this.#registeredLayerLayerPaths.filter((registeredLayer) => registeredLayer !== layerPath); + // Inform that the layer set has been updated this.onLayerSetUpdatedProcess(layerPath); } diff --git a/packages/geoview-core/src/geo/layer/layer.ts b/packages/geoview-core/src/geo/layer/layer.ts index 358071f6c3b..d9b9425f6ee 100644 --- a/packages/geoview-core/src/geo/layer/layer.ts +++ b/packages/geoview-core/src/geo/layer/layer.ts @@ -559,6 +559,55 @@ export class LayerApi { logger.logError(`Duplicate use of geoview layer identifier ${mapConfigLayerEntry.geoviewLayerId} on map ${this.getMapId()}`); } + /** + * Refreshes GeoCore Layers + * @returns {Promise} A promise which resolves when done refreshing + */ + reloadGeocoreLayers(): Promise { + const configs = this.getLayerEntryConfigs(); + const originalMapOrderedLayerInfo = MapEventProcessor.getMapOrderedLayerInfo(this.getMapId()); + const promisesOfGeoCoreGeoviewLayers: Promise[] = []; + + configs + .filter((config) => { + // Filter to just Geocore layers and not child layers + if (api.config.isValidUUID(config.geoviewLayerConfig.geoviewLayerId) && config.parentLayerConfig === undefined) { + return true; + } + return false; + }) + .forEach((config) => { + // Remove and add back in GeoCore Layers and return their promises + this.removeLayerUsingPath(config.layerPath); + const geoCore = new GeoCore(this.getMapId(), this.mapViewer.getDisplayLanguage()); + promisesOfGeoCoreGeoviewLayers.push(geoCore.createLayersFromUUID(config.geoviewLayerConfig.geoviewLayerId)); + }); + + return Promise.allSettled(promisesOfGeoCoreGeoviewLayers) + .then((promisedLayers) => { + promisedLayers + .filter((promise) => promise.status === 'fulfilled') + .map((promise) => promise as PromiseFulfilledResult) + .forEach((promise) => { + promise.value.forEach((geoviewLayerConfig) => { + this.addGeoviewLayer(geoviewLayerConfig); + }); + }); + const newMapOrderedLayerInfo = MapEventProcessor.getMapOrderedLayerInfo(this.getMapId()); + const originalLayerPaths = originalMapOrderedLayerInfo.map((layer) => layer.layerPath); + const childLayersToRemove = newMapOrderedLayerInfo + .map((layer) => layer.layerPath) + .filter((path) => !originalLayerPaths.includes(path)); + if (childLayersToRemove) { + childLayersToRemove.forEach((childPath) => { + this.removeLayerUsingPath(childPath); + }); + } + MapEventProcessor.setMapOrderedLayerInfo(this.getMapId(), originalMapOrderedLayerInfo); + }) + .catch((error) => logger.logError(error)); + } + /** * Adds a Geoview Layer by GeoCore UUID. * @param {string} uuid - The GeoCore UUID to add to the map diff --git a/packages/geoview-core/src/geo/map/map-viewer.ts b/packages/geoview-core/src/geo/map/map-viewer.ts index c1293e1846d..b860c26cc8a 100644 --- a/packages/geoview-core/src/geo/map/map-viewer.ts +++ b/packages/geoview-core/src/geo/map/map-viewer.ts @@ -924,13 +924,15 @@ export class MapViewer { * @param {boolean} resetLayer - Optional flag to ask viewer to reload layers with the new localize language * @returns {Promise<[void, void]>} */ - setLanguage(displayLanguage: TypeDisplayLanguage, resetLayer?: boolean | false): Promise<[void, void]> { + setLanguage(displayLanguage: TypeDisplayLanguage, reloadLayers?: boolean | false): Promise<[void, void]> { + // If the language hasn't changed don't do anything + if (AppEventProcessor.getDisplayLanguage(this.mapId) === displayLanguage) return Promise.resolve([undefined, undefined]); if (VALID_DISPLAY_LANGUAGE.includes(displayLanguage)) { const promise = AppEventProcessor.setDisplayLanguage(this.mapId, displayLanguage); - // if flag is true, check if config support the layers change and apply - if (resetLayer) { - logger.logInfo('reset layers not implemented yet'); + // if flag is true, reload GeoCore layers + if (reloadLayers) { + this.layer.reloadGeocoreLayers().catch((error) => logger.logError(error)); } // Emit language changed event diff --git a/packages/geoview-core/src/ui/style/style.css b/packages/geoview-core/src/ui/style/style.css index ef205bdc9d3..35952a22f1d 100644 --- a/packages/geoview-core/src/ui/style/style.css +++ b/packages/geoview-core/src/ui/style/style.css @@ -37,3 +37,9 @@ Hold viewer specific css not inside theme .guideBox p img { vertical-align: bottom; } + +/* smooth data table scrolling */ +.MuiTableContainer-root { + contain: paint; + will-change: transform; +} \ No newline at end of file