@geode/opengeodeweb-front 10.14.0-rc.4 → 10.14.0-rc.5

package/app/components/Viewer/Options/AttributeColorBar.vue

@@ -10,7 +10,7 @@ const colorMap = defineModel("colorMap", { type: String });
 
 <template>
   <div class="attribute-colorbar mt-3">
-    <ColorMapPicker v-model="colorMap" :min="minimum" :max="maximum" />
+    <ColorMapPicker v-model:selected-preset-name="colorMap" :min="minimum" :max="maximum" />
     <v-row dense align="center" class="mt-2">
       <v-col cols="5">
         <v-text-field

package/app/components/Viewer/Options/ColorMapList.vue

@@ -6,8 +6,9 @@ const LAST_POINT_OFFSET = 4;
 const THREE = 3;
 const CHUNK_SIZE = 5;
 
-const { presets } = defineProps({
+const { presets, selectedPresetName } = defineProps({
   presets: { type: Array, required: true },
+  selectedPresetName: { type: String, default: "" },
 });
 
 const emit = defineEmits(["select"]);
@@ -162,6 +163,7 @@ watch(filteredPresets, drawAllCanvases);
           <v-list-item
             v-for="(child, cIdx) in item.Children"
             :key="cIdx"
+            :active="child.Name === selectedPresetName"
             @click="emit('select', child)"
             class="px-2 mb-1"
             rounded="md"
@@ -178,7 +180,14 @@ watch(filteredPresets, drawAllCanvases);
           </v-list-item>
         </v-list-group>
 
-        <v-list-item v-else @click="emit('select', item)" class="px-2 mb-1" rounded="md">
+        <v-list-item
+          v-else
+          :active="item.Name === selectedPresetName"
+          color="primary"
+          @click="emit('select', item)"
+          class="px-2 mb-1"
+          rounded="md"
+        >
           <div class="d-flex flex-column py-1">
             <span class="text-caption text-grey-lighten-1 mb-1">{{ item.Name }}</span>
             <canvas

package/app/components/Viewer/Options/ColorMapPicker.vue

@@ -6,23 +6,19 @@ import vtkColorMaps from "@kitware/vtk.js/Rendering/Core/ColorTransferFunction/C
 const LAST_POINT_OFFSET = 4;
 const THREE = 3;
 
-const { max, min, modelValue } = defineProps({
-  modelValue: { type: String, default: "Cool to Warm" },
+const { max, min } = defineProps({
   min: { type: Number, required: true },
   max: { type: Number, required: true },
 });
 
-const emit = defineEmits(["update:modelValue"]);
+const selectedPresetName = defineModel("selectedPresetName", { default: "Cool to Warm" });
 
 const menuOpen = ref(false);
 const lutCanvas = ref();
-const selectedPresetName = ref(modelValue);
 
 const presets = computed(() => {
   const allPresets = vtkColorMaps.rgbPresetNames.map((name) => vtkColorMaps.getPresetByName(name));
 
-  const defaultPreset = vtkColorMaps.getPresetByName("Cool to Warm");
-
   const paraviewNames = [
     "Cool to Warm",
     "Warm to Cool",
@@ -49,12 +45,14 @@ const presets = computed(() => {
     (preset) => !paraviewNames.includes(preset.Name) && !matplotlibNames.includes(preset.Name),
   );
 
+  const currentPreset = vtkColorMaps.getPresetByName(selectedPresetName.value);
+
   return [
-    defaultPreset,
+    currentPreset,
     { Name: "ParaView", Children: paraviewPresets },
     { Name: "Matplotlib", Children: matplotlibPresets },
     { Name: "Others", Children: otherPresets },
-  ];
+  ].filter(Boolean);
 });
 
 function drawLutCanvas() {
@@ -103,20 +101,11 @@ function drawLutCanvas() {
 
 function onSelectPreset(preset) {
   selectedPresetName.value = preset.Name;
-  emit("update:modelValue", preset.Name);
   menuOpen.value = false;
 }
 
 onMounted(() => nextTick(drawLutCanvas));
 watch([lutCanvas, selectedPresetName, () => min, () => max], drawLutCanvas);
-watch(
-  () => modelValue,
-  (newValue) => {
-    if (newValue !== selectedPresetName.value) {
-      selectedPresetName.value = newValue;
-    }
-  },
-);
 </script>
 
 <template>
@@ -137,7 +126,11 @@ watch(
       </v-card>
     </template>
 
-    <ColorMapList :presets="presets" @select="onSelectPreset" />
+    <ColorMapList
+      :presets="presets"
+      :selected-preset-name="selectedPresetName"
+      @select="onSelectPreset"
+    />
   </v-menu>
 </template>
 

package/app/utils/colormap.js

@@ -1,7 +1,7 @@
 import vtkColorMaps from "@kitware/vtk.js/Rendering/Core/ColorTransferFunction/ColorMaps";
 
 function getRGBPointsFromPreset(presetName) {
-  return vtkColorMaps.getPresetByName(presetName).RGBPoints;
+  return vtkColorMaps.getPresetByName(presetName)?.RGBPoints ?? [];
 }
 
 export { getRGBPointsFromPreset };

package/internal/stores/data_style/mesh/cells/cell.js

@@ -60,6 +60,17 @@ export function useMeshCellsCellAttributeStyle() {
 
   function setMeshCellsCellAttributeRange(id, minimum, maximum) {
     const name = meshCellsCellAttributeName(id);
+    const points = getRGBPointsFromPreset(meshCellsCellAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshCellsCellAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshCellsCellAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return setMeshCellsCellAttributeStoredConfig(id, name, { minimum, maximum });
   }
 
@@ -75,13 +86,16 @@ export function useMeshCellsCellAttributeStyle() {
     const storedConfig = meshCellsCellAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshCellsCellAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () => setMeshCellsCellAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshCellsCellAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () => setMeshCellsCellAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return setMeshCellsCellAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/cells/vertex.js

@@ -82,6 +82,17 @@ export function useMeshCellsVertexAttributeStyle() {
 
   function setMeshCellsVertexAttributeRange(id, minimum, maximum) {
     const name = meshCellsVertexAttributeName(id);
+    const points = getRGBPointsFromPreset(meshCellsVertexAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshCellsVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshCellsVertexAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return setMeshCellsVertexAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -100,13 +111,16 @@ export function useMeshCellsVertexAttributeStyle() {
     const storedConfig = meshCellsVertexAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshCellsVertexAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () => setMeshCellsVertexAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshCellsVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () => setMeshCellsVertexAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return setMeshCellsVertexAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/edges/edge.js

@@ -85,6 +85,17 @@ export function useMeshEdgesEdgeAttributeStyle() {
 
   function setMeshEdgesEdgeAttributeRange(id, minimum, maximum) {
     const name = meshEdgesEdgeAttributeName(id);
+    const points = getRGBPointsFromPreset(meshEdgesEdgeAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshEdgesEdgeAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshEdgesEdgeAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return setMeshEdgesEdgeAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -103,13 +114,16 @@ export function useMeshEdgesEdgeAttributeStyle() {
     const storedConfig = meshEdgesEdgeAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshEdgesEdgeAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () => setMeshEdgesEdgeAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshEdgesEdgeAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () => setMeshEdgesEdgeAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return setMeshEdgesEdgeAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/edges/vertex.js

@@ -83,6 +83,17 @@ export function useMeshEdgesVertexAttributeStyle() {
   }
   function setMeshEdgesVertexAttributeRange(id, minimum, maximum) {
     const name = meshEdgesVertexAttributeName(id);
+    const points = getRGBPointsFromPreset(meshEdgesVertexAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshEdgesVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshEdgesVertexAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return setMeshEdgesVertexAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -100,13 +111,16 @@ export function useMeshEdgesVertexAttributeStyle() {
     const storedConfig = meshEdgesVertexAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshEdgesVertexAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () => setMeshEdgesVertexAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshEdgesVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () => setMeshEdgesVertexAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return setMeshEdgesVertexAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/points/vertex.js

@@ -87,6 +87,17 @@ function useMeshPointsVertexAttributeActions() {
 
   function setMeshPointsVertexAttributeRange(id, minimum, maximum) {
     const name = config.meshPointsVertexAttributeName(id);
+    const points = getRGBPointsFromPreset(config.meshPointsVertexAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPointsVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            config.setMeshPointsVertexAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return config.setMeshPointsVertexAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -98,14 +109,17 @@ function useMeshPointsVertexAttributeActions() {
     const storedConfig = config.meshPointsVertexAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshPointsVertexAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () =>
-          config.setMeshPointsVertexAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPointsVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            config.setMeshPointsVertexAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return config.setMeshPointsVertexAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/polygons/polygon.js

@@ -83,6 +83,17 @@ export function useMeshPolygonsPolygonAttributeStyle() {
 
   function setMeshPolygonsPolygonAttributeRange(id, minimum, maximum) {
     const name = meshPolygonsPolygonAttributeName(id);
+    const points = getRGBPointsFromPreset(meshPolygonsPolygonAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolygonsPolygonAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshPolygonsPolygonAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return setMeshPolygonsPolygonAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -101,16 +112,17 @@ export function useMeshPolygonsPolygonAttributeStyle() {
     const storedConfig = meshPolygonsPolygonAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshPolygonsPolygonAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () =>
-          setMeshPolygonsPolygonAttributeStoredConfig(id, name, {
-            colorMap,
-          }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolygonsPolygonAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshPolygonsPolygonAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return setMeshPolygonsPolygonAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/polygons/vertex.js

@@ -82,6 +82,17 @@ export function useMeshPolygonsVertexAttributeStyle() {
 
   function setMeshPolygonsVertexAttributeRange(id, minimum, maximum) {
     const name = meshPolygonsVertexAttributeName(id);
+    const points = getRGBPointsFromPreset(meshPolygonsVertexAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolygonsVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshPolygonsVertexAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return setMeshPolygonsVertexAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -100,13 +111,17 @@ export function useMeshPolygonsVertexAttributeStyle() {
     const storedConfig = meshPolygonsVertexAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshPolygonsVertexAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () => setMeshPolygonsVertexAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolygonsVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            setMeshPolygonsVertexAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return setMeshPolygonsVertexAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/polyhedra/polyhedron.js

@@ -87,6 +87,17 @@ function useMeshPolyhedraPolyhedronAttributeActions() {
 
   function setMeshPolyhedraPolyhedronAttributeRange(id, minimum, maximum) {
     const name = config.meshPolyhedraPolyhedronAttributeName(id);
+    const points = getRGBPointsFromPreset(config.meshPolyhedraPolyhedronAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolyhedraPolyhedronAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            config.setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return config.setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -98,14 +109,17 @@ function useMeshPolyhedraPolyhedronAttributeActions() {
     const storedConfig = config.meshPolyhedraPolyhedronAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshPolyhedraPolyhedronAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () =>
-          config.setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolyhedraPolyhedronAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            config.setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return config.setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/internal/stores/data_style/mesh/polyhedra/vertex.js

@@ -87,6 +87,17 @@ function useMeshPolyhedraVertexAttributeActions() {
 
   function setMeshPolyhedraVertexAttributeRange(id, minimum, maximum) {
     const name = config.meshPolyhedraVertexAttributeName(id);
+    const points = getRGBPointsFromPreset(config.meshPolyhedraVertexAttributeColorMap(id));
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolyhedraVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            config.setMeshPolyhedraVertexAttributeStoredConfig(id, name, { minimum, maximum }),
+        },
+      );
+    }
     return config.setMeshPolyhedraVertexAttributeStoredConfig(id, name, {
       minimum,
       maximum,
@@ -98,14 +109,17 @@ function useMeshPolyhedraVertexAttributeActions() {
     const storedConfig = config.meshPolyhedraVertexAttributeStoredConfig(id, name);
     const points = getRGBPointsFromPreset(colorMap);
     const { minimum, maximum } = storedConfig;
-    return viewerStore.request(
-      meshPolyhedraVertexAttributeSchemas.color_map,
-      { id, points, minimum, maximum },
-      {
-        response_function: () =>
-          config.setMeshPolyhedraVertexAttributeStoredConfig(id, name, { colorMap }),
-      },
-    );
+    if (points.length > 0 && minimum !== undefined && maximum !== undefined) {
+      return viewerStore.request(
+        meshPolyhedraVertexAttributeSchemas.color_map,
+        { id, points, minimum, maximum },
+        {
+          response_function: () =>
+            config.setMeshPolyhedraVertexAttributeStoredConfig(id, name, { colorMap }),
+        },
+      );
+    }
+    return config.setMeshPolyhedraVertexAttributeStoredConfig(id, name, { colorMap });
   }
 
   return {

package/package.json

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