fix time slider

Canadian-Geospatial-Platform · May 21, 2024 · 6a4f81a · 6a4f81a
1 parent c76cf4f
commit 6a4f81a
Show file tree

Hide file tree

Showing 15 changed files with 62 additions and 79 deletions.
diff --git a/packages/geoview-core/public/templates/sandbox.html b/packages/geoview-core/public/templates/sandbox.html
@@ -247,7 +247,7 @@ <h4 id="HLCONF1">Sanbox Map</h4>
 
         // create map
         // TODO: the delete has a timeout so we need to wait before trying to recreate the map...
-        // TD.CONT: this should be cleaner
+        // TO.DOCONT: this should be cleaner
         setTimeout(() => {
           cgpv.api.createMapFromConfig('sandboxMap', document.getElementById('configGeoview').value);
         }, 1500);

diff --git a/...ew-core/src/api/event-processors/event-processor-children/feature-info-event-processor.ts b/...ew-core/src/api/event-processors/event-processor-children/feature-info-event-processor.ts
@@ -79,7 +79,7 @@ export class FeatureInfoEventProcessor extends AbstractEventProcessor {
     // Redirect to helper function
     this.#deleteFromArray(featureInfoState.layerDataArray, layerPath, (layerArrayResult) => {
       // Update the layer data array in the store
-      featureInfoState.actions.setLayerDataArray(layerArrayResult);
+      featureInfoState.setterActions.setLayerDataArray(layerArrayResult);
 
       // Log
       logger.logInfo('Removed Feature Info in stores for layer path:', layerPath);
@@ -137,7 +137,7 @@ export class FeatureInfoEventProcessor extends AbstractEventProcessor {
       const atLeastOneFeature = layerDataArray.find((layerEntry) => !!layerEntry.features?.length) || false;
 
       // Update the layer data array in the store, all the time, for all statuses
-      featureInfoState.actions.setLayerDataArray(layerDataArray);
+      featureInfoState.setterActions.setLayerDataArray(layerDataArray);
 
       // If there was some features on this propagation
       if (atLeastOneFeature) {
@@ -172,10 +172,10 @@ export class FeatureInfoEventProcessor extends AbstractEventProcessor {
       layerDataArray,
       this.#batchedPropagationLayerDataArray,
       this.#timeDelayBetweenPropagationsForBatch,
-      featureInfoState.actions.setLayerDataArrayBatch,
+      featureInfoState.setterActions.setLayerDataArrayBatch,
       'feature-info-processor',
       featureInfoState.layerDataArrayBatchLayerPathBypass,
-      featureInfoState.actions.setLayerDataArrayBatchLayerPathBypass
+      featureInfoState.setterActions.setLayerDataArrayBatchLayerPathBypass
     );
   }
 

diff --git a/...eoview-core/src/api/event-processors/event-processor-children/geochart-event-processor.ts b/...eoview-core/src/api/event-processors/event-processor-children/geochart-event-processor.ts
@@ -104,7 +104,7 @@ export class GeochartEventProcessor extends AbstractEventProcessor {
     });
 
     // set store charts config
-    this.getGeochartState(mapId)?.actions.setGeochartCharts(chartData);
+    this.getGeochartState(mapId)?.setterActions.setGeochartCharts(chartData);
 
     // Log
     logger.logInfo('Added GeoChart configs for layer paths:', layerPaths);
@@ -126,7 +126,7 @@ export class GeochartEventProcessor extends AbstractEventProcessor {
     toAdd[layerPath] = chartConfig;
 
     // Update the layer data array in the store
-    this.getGeochartState(mapId)!.actions.setGeochartCharts({ ...this.getGeochartState(mapId)?.geochartChartsConfig, ...toAdd });
+    this.getGeochartState(mapId)!.setterActions.setGeochartCharts({ ...this.getGeochartState(mapId)?.geochartChartsConfig, ...toAdd });
 
     // Log
     logger.logInfo('Added GeoChart configs for layer path:', layerPath);
@@ -152,7 +152,7 @@ export class GeochartEventProcessor extends AbstractEventProcessor {
       delete chartConfigs[layerPath];
 
       // Update the layer data array in the store
-      this.getGeochartState(mapId)!.actions.setGeochartCharts({ ...chartConfigs });
+      this.getGeochartState(mapId)!.setterActions.setGeochartCharts({ ...chartConfigs });
 
       // Log
       logger.logInfo('Removed GeoChart configs for layer path:', layerPath);
@@ -172,7 +172,7 @@ export class GeochartEventProcessor extends AbstractEventProcessor {
     if (!this.getGeochartState(mapId)) return;
 
     // Update the layer data array in the store
-    this.getGeochartState(mapId)!.actions.setLayerDataArray(layerDataArray);
+    this.getGeochartState(mapId)!.setterActions.setLayerDataArray(layerDataArray);
   }
 
   /**
@@ -200,10 +200,10 @@ export class GeochartEventProcessor extends AbstractEventProcessor {
       layerDataArray,
       this.batchedPropagationLayerDataArray,
       this.timeDelayBetweenPropagationsForBatch,
-      geochartState.actions.setLayerDataArrayBatch,
+      geochartState.setterActions.setLayerDataArrayBatch,
       'geochart-processor',
       geochartState.layerDataArrayBatchLayerPathBypass,
-      geochartState.actions.setLayerDataArrayBatchLayerPathBypass
+      geochartState.setterActions.setLayerDataArrayBatchLayerPathBypass
     );
   }
 

diff --git a/...ges/geoview-core/src/api/event-processors/event-processor-children/map-event-processor.ts b/...ges/geoview-core/src/api/event-processors/event-processor-children/map-event-processor.ts
@@ -206,7 +206,7 @@ export class MapEventProcessor extends AbstractEventProcessor {
    */
   static getMapViewerLayerAPI(mapId: string): LayerApi {
     // TODO: refactor layer - It seems sometimes we use getMapViewerLayerAPI(mapId).geoviewLayer(layerPath)
-    // TD.CONT: and sometimes like the above. Should 'registeredLayers' be #private to have a single way of getting a layer using a layer path?
+    // TO.DOCONT: and sometimes like the above. Should 'registeredLayers' be #private to have a single way of getting a layer using a layer path?
     return api.maps[mapId].layer;
   }
 
@@ -220,7 +220,7 @@ export class MapEventProcessor extends AbstractEventProcessor {
     try {
       // Check if the plugins exist
       // TODO: if you run the code fast enough (only happened to me in the TimeSliderEventProcessor),
-      // TD.CONT: the getMapViewer should be async, because it can be unset as well ( so not just getMapViewerPlugins() ).
+      // TO.DOCONT: the getMapViewer should be async, because it can be unset as well ( so not just getMapViewerPlugins() ).
       await whenThisThen(() => api && api.maps && api.maps[mapId] && api.maps[mapId].plugins);
     } catch (error) {
       // Log

diff --git a/...iew-core/src/api/event-processors/event-processor-children/time-slider-event-processor.ts b/...iew-core/src/api/event-processors/event-processor-children/time-slider-event-processor.ts
@@ -2,12 +2,13 @@ import { AbstractEventProcessor } from '@/api/event-processors/abstract-event-pr
 import { AbstractGeoViewVector } from '@/geo/layer/geoview-layers/vector/abstract-geoview-vector';
 import { ITimeSliderState, TypeTimeSliderValues } from '@/core/stores/store-interface-and-intial-values/time-slider-state';
 import { getLocalizedValue } from '@/core/utils/utilities';
-import { AbstractGeoViewLayer, CONST_LAYER_TYPES } from '@/geo/layer/geoview-layers/abstract-geoview-layers';
+import { CONST_LAYER_TYPES } from '@/geo/layer/geoview-layers/abstract-geoview-layers';
 import { EsriDynamic } from '@/geo/layer/geoview-layers/raster/esri-dynamic';
 import { WMS } from '@/geo/layer/geoview-layers/raster/wms';
 import { TypeFeatureInfoLayerConfig, TypeLayerEntryConfig } from '@/geo/map/map-schema-types';
 import { EsriImage } from '@/geo/layer/geoview-layers/raster/esri-image';
 import { AppEventProcessor } from './app-event-processor';
+import { MapEventProcessor } from './map-event-processor';
 
 // GV Important: See notes in header of MapEventProcessor file for information on the paradigm to apply when working with UIEventProcessor vs UIState
 
@@ -35,40 +36,29 @@ export class TimeSliderEventProcessor extends AbstractEventProcessor {
   /**
    * Checks if the layer has time slider values. If there are, adds the time slider layer and applies filters.
    * @param {string} mapId - The map id of the state to act on
-   * @param {AbstractGeoViewLayer} geoviewLayer - The GeoView layer to act on
    * @param {TypeLayerEntryConfig} layerConfig - The layer path of the layer to add to the state
    */
-  static checkInitTimeSliderLayerAndApplyFilters(
-    mapId: string,
-    geoviewLayer: AbstractGeoViewLayer,
-    layerConfig: TypeLayerEntryConfig
-  ): void {
+  static checkInitTimeSliderLayerAndApplyFilters(mapId: string, layerConfig: TypeLayerEntryConfig): void {
     // If there is no TimeSlider
     if (!this.getTimesliderState(mapId)) return;
 
     // Get the time slider values
-    const timeSliderValues = this.getInitialTimeSliderValues(mapId, geoviewLayer, layerConfig);
+    const timeSliderValues = this.getInitialTimeSliderValues(mapId, layerConfig);
 
     // If any
     if (timeSliderValues) {
       // Add the time slider in store
-      this.addTimeSliderLayerAndApplyFilters(mapId, geoviewLayer, layerConfig.layerPath, timeSliderValues);
+      this.addTimeSliderLayerAndApplyFilters(mapId, layerConfig.layerPath, timeSliderValues);
     }
   }
 
   /**
    * Adds a time slider layer to the state
    * @param {string} mapId - The map id of the state to act on
-   * @param {AbstractGeoViewLayer} geoviewLayer - The GeoView layer to act on
    * @param {string} layerPath - The layer path of the layer to add to the state
    * @param {TypeTimeSliderValues} timeSliderValues - The time slider values to add and apply filters
    */
-  static addTimeSliderLayerAndApplyFilters(
-    mapId: string,
-    geoviewLayer: AbstractGeoViewLayer,
-    layerPath: string,
-    timeSliderValues: TypeTimeSliderValues
-  ): void {
+  static addTimeSliderLayerAndApplyFilters(mapId: string, layerPath: string, timeSliderValues: TypeTimeSliderValues): void {
     // If there is no TimeSlider
     if (!this.getTimesliderState(mapId)) return;
 
@@ -79,7 +69,7 @@ export class TimeSliderEventProcessor extends AbstractEventProcessor {
     this.getTimesliderState(mapId)?.setterActions.addTimeSliderLayer(timeSliderLayer);
 
     const { defaultValue, field, filtering, minAndMax, values } = timeSliderLayer[layerPath];
-    this.applyFilters(geoviewLayer, layerPath, defaultValue, field, filtering, minAndMax, values);
+    this.applyFilters(mapId, layerPath, defaultValue, field, filtering, minAndMax, values);
   }
 
   /**
@@ -96,18 +86,20 @@ export class TimeSliderEventProcessor extends AbstractEventProcessor {
    * Get initial values for a layer's time slider states
    *
    * @param {string} mapId - The id of the map
-   * @param {AbstractGeoViewLayer} geoviewLayer - The GeoView layer to act on
    * @param {TypeLayerEntryConfig} layerConfig - The layer path of the layer to add to the state
    * @returns {TimeSliderLayer | undefined}
    */
-  static getInitialTimeSliderValues(
-    mapId: string,
-    geoviewLayer: AbstractGeoViewLayer,
-    layerConfig: TypeLayerEntryConfig
-  ): TypeTimeSliderValues | undefined {
-    const name = getLocalizedValue(layerConfig.layerName, AppEventProcessor.getDisplayLanguage(mapId)) || layerConfig.layerId;
+  static getInitialTimeSliderValues(mapId: string, layerConfig: TypeLayerEntryConfig): TypeTimeSliderValues | undefined {
+    // Get the layer using the map event processor, If no temporal dimension OR layerPath, return undefined
+    if (!layerConfig.layerPath) return undefined;
+    const geoviewLayer = MapEventProcessor.getMapViewerLayerAPI(mapId).geoviewLayer(layerConfig.layerPath);
     const temporalDimensionInfo = geoviewLayer.getTemporalDimension(layerConfig.layerPath);
     if (!temporalDimensionInfo || !temporalDimensionInfo.range) return undefined;
+
+    // Get layer name and temporal dimension
+    const name = getLocalizedValue(layerConfig.layerName, AppEventProcessor.getDisplayLanguage(mapId)) || layerConfig.layerId;
+
+    // Set defaults values from temporal dimension
     const { range } = temporalDimensionInfo.range;
     const defaultValueIsArray = Array.isArray(temporalDimensionInfo.default);
     const defaultValue = defaultValueIsArray ? temporalDimensionInfo.default[0] : temporalDimensionInfo.default;
@@ -163,7 +155,7 @@ export class TimeSliderEventProcessor extends AbstractEventProcessor {
   /**
    * Filter the layer provided in the layerPath variable according to current states (filtering and values)
    *
-   * @param {AbstractGeoViewLayer} geoviewLayer - The GeoView layer to act on
+   * @param {string} mapId - The id of the map
    * @param {string} layerPath - The path of the layer to filter
    * @param {string} defaultValue - The default value to use if filters are off
    * @param {string} field - The field to filter the layer by
@@ -173,14 +165,17 @@ export class TimeSliderEventProcessor extends AbstractEventProcessor {
    * @returns {void}
    */
   static applyFilters(
-    geoviewLayer: AbstractGeoViewLayer,
+    mapId: string,
     layerPath: string,
     defaultValue: string,
     field: string,
     filtering: boolean,
     minAndMax: number[],
     values: number[]
   ): void {
+    // Get the layer using the map event processor
+    const geoviewLayer = MapEventProcessor.getMapViewerLayerAPI(mapId).geoviewLayer(layerPath);
+
     const layerType = geoviewLayer.type;
     if (layerType === CONST_LAYER_TYPES.WMS) {
       if (filtering) {
@@ -212,6 +207,9 @@ export class TimeSliderEventProcessor extends AbstractEventProcessor {
       }
       (geoviewLayer as AbstractGeoViewVector | EsriDynamic).applyViewFilter(layerPath, filter);
     }
+
+    this.getTimesliderState(mapId)?.setterActions.setFiltering(layerPath, filtering);
+    this.getTimesliderState(mapId)?.setterActions.setValues(layerPath, values);
   }
   // #endregion
 }
diff --git a/packages/geoview-core/src/app.tsx b/packages/geoview-core/src/app.tsx
@@ -102,8 +102,8 @@ async function getMapConfig(mapElement: Element): Promise<TypeMapFeaturesConfig>
   }
 
   // TODO: inject 'data-geocore-keys' inside the config for later processing by the configAPI
-  // TD.CONT: This injectioon can be done in api.configApi.getMapConfig with optional parameter keys
-  // TD.CONT: This will return the listOfGeoviewLAyer with a new entry: {'geoviewLayerType': 'geoCore','geoviewLayerId': '21b821cf-0f1c-40ee-8925-eab12d357668'},
+  // TO.DOCONT: This injectioon can be done in api.configApi.getMapConfig with optional parameter keys
+  // TO.DOCONT: This will return the listOfGeoviewLAyer with a new entry: {'geoviewLayerType': 'geoCore','geoviewLayerId': '21b821cf-0f1c-40ee-8925-eab12d357668'},
 
   // add the map display language and the map id to config (extend the MapFeatureConfig)
   // eslint-disable-next-line @typescript-eslint/no-explicit-any

diff --git a/packages/geoview-core/src/core/stores/store-interface-and-intial-values/map-state.ts b/packages/geoview-core/src/core/stores/store-interface-and-intial-values/map-state.ts
@@ -388,6 +388,7 @@ export function initializeMapState(set: TypeSetStore, get: TypeGetStore): IMapSt
        */
       setOverlayClickMarkerRef: (htmlRef: HTMLElement): void => {
         // Quick function to set the element on the overlay
+        // Only fot UI, no redirect to setterAction
         const overlay = get().mapState.overlayClickMarker;
         if (overlay !== undefined) overlay.setElement(htmlRef);
       },
@@ -398,6 +399,7 @@ export function initializeMapState(set: TypeSetStore, get: TypeGetStore): IMapSt
        */
       setOverlayNorthMarkerRef: (htmlRef: HTMLElement): void => {
         // Quick function to set the element on the overlay
+        // Only fot UI, no redirect to setterAction
         const overlay = get().mapState.overlayNorthMarker;
         if (overlay !== undefined) overlay.setElement(htmlRef);
       },
@@ -633,7 +635,7 @@ export function initializeMapState(set: TypeSetStore, get: TypeGetStore): IMapSt
       setOrderedLayerInfo: (orderedLayerInfo: TypeOrderedLayerInfo[]): void => {
         // We need to explicitly define ... for the array. If not subscribe does not fired
         // TODO: refactor - setterActions in setState will recreate array if needed. We need to implement the pattern in all setterActions
-        // TD.CONT: We should have a deep equality function to compare previous / current
+        // TO.DOCONT: We should have a deep equality function to compare previous / current
         set({
           mapState: {
             ...get().mapState,