@geode/opengeodeweb-front 10.38.0 → 10.39.0

package/internal/stores/data_style/model/surfaces/color.ts

@@ -102,7 +102,11 @@ export function useModelSurfacesColor(): {
         modelId,
         surfaces_ids[0],
       );
-      const attribute = { name, item, minimum, maximum, colorMap };
+      const no_data_color = modelSurfacesVertexAttribute.modelSurfacesVertexAttributeNoDataColor(
+        modelId,
+        surfaces_ids[0],
+      );
+      const attribute = { name, item, minimum, maximum, colorMap, no_data_color };
       if (isModelSurfacesVertexAttributeValid(attribute)) {
         return modelSurfacesVertexAttribute.setModelSurfacesVertexAttribute(
           modelId,
@@ -127,7 +131,11 @@ export function useModelSurfacesColor(): {
         modelId,
         surfaces_ids[0],
       );
-      const attribute = { name, item, minimum, maximum, colorMap };
+      const no_data_color = modelSurfacesPolygonAttribute.modelSurfacesPolygonAttributeNoDataColor(
+        modelId,
+        surfaces_ids[0],
+      );
+      const attribute = { name, item, minimum, maximum, colorMap, no_data_color };
       if (isModelSurfacesPolygonAttributeValid(attribute)) {
         return modelSurfacesPolygonAttribute.setModelSurfacesPolygonAttribute(
           modelId,

package/internal/stores/data_style/model/surfaces/index.ts

@@ -17,6 +17,7 @@ interface AttributeGroup {
   minimum: number;
   maximum: number;
   colorMap: string;
+  no_data_color?: RGBAColor;
   surfaces_ids: string[];
 }
 
@@ -123,17 +124,39 @@ export function useModelSurfacesStyle(): UseModelSurfacesStyleReturn {
             modelId,
             surfaces_id,
           );
-          const attribute = { name, item, minimum, maximum, colorMap };
+          const no_data_color =
+            modelSurfacesVertexAttribute.modelSurfacesVertexAttributeNoDataColor(
+              modelId,
+              surfaces_id,
+            );
+          const attribute = {
+            name,
+            item,
+            minimum,
+            maximum,
+            colorMap,
+            no_data_color,
+          };
           if (!isModelSurfacesVertexAttributeValid(attribute)) {
             continue;
           }
-          const key = `${name}_${item}_${colorMap}_${minimum}_${maximum}`;
+          const key = [name, item, colorMap, minimum, maximum, JSON.stringify(no_data_color)].join(
+            "_",
+          );
           vertexGroups[key] ??= { ...attribute, surfaces_ids: [] };
           vertexGroups[key].surfaces_ids.push(surfaces_id);
         }
         coloringPromises.push(
           ...Object.values(vertexGroups).map(
-            async ({ name, item, minimum, maximum, colorMap, surfaces_ids: ids }) => {
+            async ({
+              name,
+              item,
+              minimum,
+              maximum,
+              colorMap,
+              no_data_color,
+              surfaces_ids: ids,
+            }) => {
               const result = await modelSurfacesVertexAttribute.setModelSurfacesVertexAttribute(
                 modelId,
                 ids,
@@ -143,6 +166,7 @@ export function useModelSurfacesStyle(): UseModelSurfacesStyleReturn {
                   minimum,
                   maximum,
                   colorMap,
+                  no_data_color,
                 },
               );
               return result;
@@ -166,17 +190,39 @@ export function useModelSurfacesStyle(): UseModelSurfacesStyleReturn {
             modelId,
             surfaces_id,
           );
-          const attribute = { name, item, minimum, maximum, colorMap };
+          const no_data_color =
+            modelSurfacesPolygonAttribute.modelSurfacesPolygonAttributeNoDataColor(
+              modelId,
+              surfaces_id,
+            );
+          const attribute = {
+            name,
+            item,
+            minimum,
+            maximum,
+            colorMap,
+            no_data_color,
+          };
           if (!isModelSurfacesPolygonAttributeValid(attribute)) {
             continue;
           }
-          const key = `${name}_${item}_${colorMap}_${minimum}_${maximum}`;
+          const key = [name, item, colorMap, minimum, maximum, JSON.stringify(no_data_color)].join(
+            "_",
+          );
           polygonGroups[key] ??= { ...attribute, surfaces_ids: [] };
           polygonGroups[key].surfaces_ids.push(surfaces_id);
         }
         coloringPromises.push(
           ...Object.values(polygonGroups).map(
-            async ({ name, item, minimum, maximum, colorMap, surfaces_ids: ids }) => {
+            async ({
+              name,
+              item,
+              minimum,
+              maximum,
+              colorMap,
+              no_data_color,
+              surfaces_ids: ids,
+            }) => {
               const result = await modelSurfacesPolygonAttribute.setModelSurfacesPolygonAttribute(
                 modelId,
                 ids,
@@ -186,6 +232,7 @@ export function useModelSurfacesStyle(): UseModelSurfacesStyleReturn {
                   minimum,
                   maximum,
                   colorMap,
+                  no_data_color,
                 },
               );
               return result;

package/internal/stores/data_style/model/surfaces/polygon.ts

@@ -4,6 +4,10 @@ import { DEFAULT_NO_DATA_COLOR, type RGBAColor } from "@ogw_front/utils/default_
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_typed_schemas.js";
 
 // Local imports
+import {
+  reapplySameSeries,
+  useAttributeTimeStepStyle,
+} from "@ogw_internal/stores/data_style/time_step";
 import { getRGBPointsFromPreset } from "@ogw_front/utils/colormap";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useModelSurfacesCommonStyle } from "./common";
@@ -61,6 +65,15 @@ interface UseModelSurfacesPolygonAttributeReturn {
     modelId: string,
     surfaceId?: string,
   ) => [number | undefined, number | undefined];
+  modelSurfacesPolygonAttributeTimeStep: (
+    modelId: string,
+    surfaceId?: string,
+  ) => number | undefined;
+  setModelSurfacesPolygonAttributeTimeStep: (
+    modelId: string,
+    surfaceIds: string[],
+    timeStep: number,
+  ) => Promise<void>;
   modelSurfacesPolygonAttributeColorMap: (
     modelId: string,
     surfaceId?: string,
@@ -107,14 +120,14 @@ interface UseModelSurfacesPolygonAttributeReturn {
 
 // oxlint-disable-next-line max-lines-per-function
 function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeReturn {
+  const { attributeTimeStep, setAttributeTimeStep, seriesArrayName } = useAttributeTimeStepStyle();
   const dataStore = useDataStore();
   const modelSurfacesCommonStyle = useModelSurfacesCommonStyle();
   const viewerStore = useViewerStore();
   function modelSurfacesPolygonAttribute(modelId: string, surfaceId?: string): AttributeState {
     return (
-      modelSurfacesCommonStyle.modelSurfaceColoring(modelId, surfaceId)
-        // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.polygon shape is defined by the data style schema.
-        .polygon as AttributeState
+      // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.polygon shape is defined by the data style schema.
+      modelSurfacesCommonStyle.modelSurfaceColoring(modelId, surfaceId).polygon as AttributeState
     );
   }
   function modelSurfacesPolygonAttributeStoredConfig(
@@ -149,7 +162,9 @@ function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeRet
     const totalSurfaceIds = await dataStore.getSurfacesGeodeIds(modelId);
     if (surfaceIds.length === totalSurfaceIds.length) {
       tasks.push(
-        modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, { polygon: values }),
+        modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, {
+          polygon: values,
+        }),
       );
     }
     await Promise.all(tasks);
@@ -209,6 +224,25 @@ function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeRet
     const storedConfig = modelSurfacesPolygonAttributeStoredConfig(modelId, surfaceId, name, item);
     return storedConfig.colorMap;
   }
+  function modelSurfacesPolygonAttributeNoDataColor(
+    modelId: string,
+    surfaceId?: string,
+  ): RGBAColor {
+    const name = modelSurfacesPolygonAttributeName(modelId, surfaceId);
+    const item = modelSurfacesPolygonAttributeItem(modelId, surfaceId);
+    const storedConfig = modelSurfacesPolygonAttributeStoredConfig(modelId, surfaceId, name, item);
+    return storedConfig.no_data_color;
+  }
+  function modelSurfacesPolygonAttributeTimeStep(
+    modelId: string,
+    surfaceId?: string,
+  ): number | undefined {
+    return attributeTimeStep(
+      modelId,
+      attributeSchema.$id,
+      modelSurfacesPolygonAttribute(modelId, surfaceId).name,
+    );
+  }
   async function setModelSurfacesPolygonAttribute(
     modelId: string,
     surfaceIds: string[],
@@ -233,14 +267,17 @@ function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeRet
     const params = {
       id: modelId,
       block_ids: surface_viewer_ids,
-      name,
+      name: seriesArrayName(modelId, attributeSchema.$id, name),
       item,
       points,
       minimum,
       maximum,
       no_data_color,
     };
-    const result = await viewerStore.request({ schema: attributeSchema, params });
+    const result = await viewerStore.request({
+      schema: attributeSchema,
+      params,
+    });
     return result;
   }
   async function applyPolygonAttribute(modelId: string, surfaceIds: string[]): Promise<void> {
@@ -281,6 +318,37 @@ function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeRet
     await mutateModelSurfacesPolygonStyle(modelId, surfaceIds, { item });
     await applyPolygonAttribute(modelId, surfaceIds);
   }
+  async function setModelSurfacesPolygonAttributeTimeStep(
+    modelId: string,
+    surfaceIds: string[],
+    timeStep: number,
+  ): Promise<void> {
+    const name = modelSurfacesPolygonAttributeName(modelId, surfaceIds[0]);
+    if (name === undefined) {
+      return;
+    }
+    await setAttributeTimeStep(modelId, attributeSchema.$id, name, timeStep);
+    await Promise.all([
+      applyPolygonAttribute(modelId, surfaceIds),
+      reapplySameSeries(
+        await dataStore.getSurfacesGeodeIds(modelId),
+        surfaceIds,
+        (id) =>
+          modelSurfacesCommonStyle.modelSurfaceColoring(modelId, id).active === "polygon" &&
+          modelSurfacesPolygonAttributeName(modelId, id) === name
+            ? [
+                modelSurfacesPolygonAttributeItem(modelId, id),
+                modelSurfacesPolygonAttributeRange(modelId, id),
+                modelSurfacesPolygonAttributeColorMap(modelId, id),
+                JSON.stringify(modelSurfacesPolygonAttributeNoDataColor(modelId, id)),
+              ].join("|")
+            : undefined,
+        async (ids) => {
+          await applyPolygonAttribute(modelId, ids);
+        },
+      ),
+    ]);
+  }
   async function setModelSurfacesPolygonAttributeRange(
     modelId: string,
     surfaceIds: string[],
@@ -307,15 +375,6 @@ function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeRet
     });
     await applyPolygonAttribute(modelId, surfaceIds);
   }
-  function modelSurfacesPolygonAttributeNoDataColor(
-    modelId: string,
-    surfaceId?: string,
-  ): RGBAColor {
-    const name = modelSurfacesPolygonAttributeName(modelId, surfaceId);
-    const item = modelSurfacesPolygonAttributeItem(modelId, surfaceId);
-    const storedConfig = modelSurfacesPolygonAttributeStoredConfig(modelId, surfaceId, name, item);
-    return storedConfig.no_data_color;
-  }
   async function setModelSurfacesPolygonAttributeNoDataColor(
     modelId: string,
     surfaceIds: string[],
@@ -337,6 +396,8 @@ function useModelSurfacesPolygonAttribute(): UseModelSurfacesPolygonAttributeRet
   }
   return {
     modelSurfacesPolygonAttributeName,
+    modelSurfacesPolygonAttributeTimeStep,
+    setModelSurfacesPolygonAttributeTimeStep,
     modelSurfacesPolygonAttributeItem,
     modelSurfacesPolygonAttributeRange,
     modelSurfacesPolygonAttributeColorMap,

package/internal/stores/data_style/model/surfaces/vertex.ts

@@ -4,6 +4,10 @@ import { DEFAULT_NO_DATA_COLOR, type RGBAColor } from "@ogw_front/utils/default_
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_typed_schemas.js";
 
 // Local imports
+import {
+  reapplySameSeries,
+  useAttributeTimeStepStyle,
+} from "@ogw_internal/stores/data_style/time_step";
 import { getRGBPointsFromPreset } from "@ogw_front/utils/colormap";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useModelSurfacesCommonStyle } from "./common";
@@ -61,6 +65,12 @@ interface UseModelSurfacesVertexAttributeReturn {
     modelId: string,
     surfaceId?: string,
   ) => [number | undefined, number | undefined];
+  modelSurfacesVertexAttributeTimeStep: (modelId: string, surfaceId?: string) => number | undefined;
+  setModelSurfacesVertexAttributeTimeStep: (
+    modelId: string,
+    surfaceIds: string[],
+    timeStep: number,
+  ) => Promise<void>;
   modelSurfacesVertexAttributeColorMap: (modelId: string, surfaceId?: string) => string | undefined;
   modelSurfacesVertexAttributeStoredConfig: (
     modelId: string,
@@ -104,14 +114,14 @@ interface UseModelSurfacesVertexAttributeReturn {
 
 // oxlint-disable-next-line max-lines-per-function
 function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeReturn {
+  const { attributeTimeStep, setAttributeTimeStep, seriesArrayName } = useAttributeTimeStepStyle();
   const dataStore = useDataStore();
   const modelSurfacesCommonStyle = useModelSurfacesCommonStyle();
   const viewerStore = useViewerStore();
   function modelSurfacesVertexAttribute(modelId: string, surfaceId?: string): AttributeState {
     return (
-      modelSurfacesCommonStyle.modelSurfaceColoring(modelId, surfaceId)
-        // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.vertex shape is defined by the data style schema.
-        .vertex as AttributeState
+      // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.vertex shape is defined by the data style schema.
+      modelSurfacesCommonStyle.modelSurfaceColoring(modelId, surfaceId).vertex as AttributeState
     );
   }
   function modelSurfacesVertexAttributeStoredConfig(
@@ -146,7 +156,9 @@ function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeRetur
     const totalSurfaceIds = await dataStore.getSurfacesGeodeIds(modelId);
     if (surfaceIds.length === totalSurfaceIds.length) {
       tasks.push(
-        modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, { vertex: values }),
+        modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, {
+          vertex: values,
+        }),
       );
     }
     await Promise.all(tasks);
@@ -206,6 +218,22 @@ function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeRetur
     const storedConfig = modelSurfacesVertexAttributeStoredConfig(modelId, surfaceId, name, item);
     return storedConfig.colorMap;
   }
+  function modelSurfacesVertexAttributeNoDataColor(modelId: string, surfaceId?: string): RGBAColor {
+    const name = modelSurfacesVertexAttributeName(modelId, surfaceId);
+    const item = modelSurfacesVertexAttributeItem(modelId, surfaceId);
+    const storedConfig = modelSurfacesVertexAttributeStoredConfig(modelId, surfaceId, name, item);
+    return storedConfig.no_data_color;
+  }
+  function modelSurfacesVertexAttributeTimeStep(
+    modelId: string,
+    surfaceId?: string,
+  ): number | undefined {
+    return attributeTimeStep(
+      modelId,
+      attributeSchema.$id,
+      modelSurfacesVertexAttribute(modelId, surfaceId).name,
+    );
+  }
   async function setModelSurfacesVertexAttribute(
     modelId: string,
     surfaceIds: string[],
@@ -230,14 +258,17 @@ function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeRetur
     const params = {
       id: modelId,
       block_ids: surface_viewer_ids,
-      name,
+      name: seriesArrayName(modelId, attributeSchema.$id, name),
       item,
       points,
       minimum,
       maximum,
       no_data_color,
     };
-    const result = await viewerStore.request({ schema: attributeSchema, params });
+    const result = await viewerStore.request({
+      schema: attributeSchema,
+      params,
+    });
     return result;
   }
   async function applyVertexAttribute(modelId: string, surfaceIds: string[]): Promise<unknown> {
@@ -282,6 +313,37 @@ function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeRetur
     const result = await applyVertexAttribute(modelId, surfaceIds);
     return result;
   }
+  async function setModelSurfacesVertexAttributeTimeStep(
+    modelId: string,
+    surfaceIds: string[],
+    timeStep: number,
+  ): Promise<void> {
+    const name = modelSurfacesVertexAttributeName(modelId, surfaceIds[0]);
+    if (name === undefined) {
+      return;
+    }
+    await setAttributeTimeStep(modelId, attributeSchema.$id, name, timeStep);
+    await Promise.all([
+      applyVertexAttribute(modelId, surfaceIds),
+      reapplySameSeries(
+        await dataStore.getSurfacesGeodeIds(modelId),
+        surfaceIds,
+        (id) =>
+          modelSurfacesCommonStyle.modelSurfaceColoring(modelId, id).active === "vertex" &&
+          modelSurfacesVertexAttributeName(modelId, id) === name
+            ? [
+                modelSurfacesVertexAttributeItem(modelId, id),
+                modelSurfacesVertexAttributeRange(modelId, id),
+                modelSurfacesVertexAttributeColorMap(modelId, id),
+                JSON.stringify(modelSurfacesVertexAttributeNoDataColor(modelId, id)),
+              ].join("|")
+            : undefined,
+        async (ids) => {
+          await applyVertexAttribute(modelId, ids);
+        },
+      ),
+    ]);
+  }
   async function setModelSurfacesVertexAttributeRange(
     modelId: string,
     surfaceIds: string[],
@@ -310,12 +372,6 @@ function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeRetur
     const result = await applyVertexAttribute(modelId, surfaceIds);
     return result;
   }
-  function modelSurfacesVertexAttributeNoDataColor(modelId: string, surfaceId?: string): RGBAColor {
-    const name = modelSurfacesVertexAttributeName(modelId, surfaceId);
-    const item = modelSurfacesVertexAttributeItem(modelId, surfaceId);
-    const storedConfig = modelSurfacesVertexAttributeStoredConfig(modelId, surfaceId, name, item);
-    return storedConfig.no_data_color;
-  }
   async function setModelSurfacesVertexAttributeNoDataColor(
     modelId: string,
     surfaceIds: string[],
@@ -338,6 +394,8 @@ function useModelSurfacesVertexAttribute(): UseModelSurfacesVertexAttributeRetur
   }
   return {
     modelSurfacesVertexAttributeName,
+    modelSurfacesVertexAttributeTimeStep,
+    setModelSurfacesVertexAttributeTimeStep,
     modelSurfacesVertexAttributeItem,
     modelSurfacesVertexAttributeRange,
     modelSurfacesVertexAttributeColorMap,

package/internal/stores/data_style/time_step.ts

@@ -0,0 +1,75 @@
+import { attributeArrayName } from "@ogw_front/utils/attributes";
+import { useDataStyleState } from "./state";
+
+interface UseAttributeTimeStepStyleReturn {
+  attributeTimeStep: (id: string, key: string, name: string | undefined) => number | undefined;
+  setAttributeTimeStep: (
+    id: string,
+    key: string,
+    name: string,
+    timeStep: number,
+  ) => Promise<unknown>;
+  seriesArrayName: (id: string, key: string, name: string) => string;
+}
+
+// Re-render the other components showing the same series, one request per group.
+// Identical config means same name, item, range, colormap and no data color.
+// The group key is undefined for a component not showing the series.
+async function reapplySameSeries(
+  allIds: string[],
+  targetIds: string[],
+  groupKey: (componentId: string) => string | undefined,
+  apply: (componentIds: string[]) => Promise<unknown>,
+): Promise<void> {
+  const groups: Record<string, string[]> = {};
+  for (const componentId of allIds) {
+    const key = groupKey(componentId);
+    if (key !== undefined && !targetIds.includes(componentId)) {
+      groups[key] ??= [];
+      groups[key].push(componentId);
+    }
+  }
+  await Promise.all(
+    Object.values(groups).map(async (componentIds) => {
+      await apply(componentIds);
+    }),
+  );
+}
+
+// The key of a series is a schema $id: the back attribute names schema for meshes
+// (cards share a step), the viewer attribute schema for models (one step per component type)
+function useAttributeTimeStepStyle(): UseAttributeTimeStepStyleReturn {
+  const dataStyleState = useDataStyleState();
+
+  function attributeTimeStep(
+    id: string,
+    key: string,
+    name: string | undefined,
+  ): number | undefined {
+    if (name === undefined) {
+      return undefined;
+    }
+    return dataStyleState.getStyle(id).timeSteps?.[key]?.[name];
+  }
+
+  async function setAttributeTimeStep(
+    id: string,
+    key: string,
+    name: string,
+    timeStep: number,
+  ): Promise<unknown> {
+    const result = await dataStyleState.mutateStyle(id, {
+      timeSteps: { [key]: { [name]: timeStep } },
+    });
+    return result;
+  }
+
+  // VTK array name of the series at its current time step
+  function seriesArrayName(id: string, key: string, name: string): string {
+    return attributeArrayName(name, attributeTimeStep(id, key, name));
+  }
+
+  return { attributeTimeStep, setAttributeTimeStep, seriesArrayName };
+}
+
+export { reapplySameSeries, useAttributeTimeStepStyle };

package/internal/stores/data_style/types.ts

@@ -14,6 +14,7 @@ interface ObjectStyle {
   surfaces?: StyleValues;
   blocks?: StyleValues;
   attributes?: StyleValues;
+  timeSteps?: Record<string, Record<string, number>>;
   [key: string]: unknown;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geode/opengeodeweb-front",
-  "version": "10.38.0",
+  "version": "10.39.0",
   "description": "OpenSource Vue/Nuxt/Pinia/Vuetify framework for web applications",
   "homepage": "https://github.com/Geode-solutions/OpenGeodeWeb-Front",
   "bugs": {