@geode/opengeodeweb-front 10.6.2 → 10.6.3-rc.1

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

@@ -1,102 +1,94 @@
 <script setup>
-  import ViewerOptionsAttributeSelector from "@ogw_front/components/Viewer/Options/AttributeSelector.vue"
-  import ViewerOptionsColorPicker from "@ogw_front/components/Viewer/Options/ColorPicker.vue"
-  import ViewerOptionsTexturesSelector from "@ogw_front/components/Viewer/Options/TexturesSelector.vue"
-  import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
+import ViewerOptionsAttributeSelector from "@ogw_front/components/Viewer/Options/AttributeSelector.vue";
+import ViewerOptionsColorPicker from "@ogw_front/components/Viewer/Options/ColorPicker.vue";
+import ViewerOptionsTexturesSelector from "@ogw_front/components/Viewer/Options/TexturesSelector.vue";
+import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json";
 
-  const coloring_style_key = defineModel("coloring_style_key")
+const coloring_style_key = defineModel("coloring_style_key");
 
-  const color = defineModel("color")
-  const textures = defineModel("textures")
+const color = defineModel("color");
+const textures = defineModel("textures");
 
-  const vertex_attribute_name = defineModel("vertex_attribute_name")
-  const vertex_attribute_range = defineModel("vertex_attribute_range")
-  const vertex_attribute_color_map = defineModel("vertex_attribute_color_map")
+const vertex_attribute_name = defineModel("vertex_attribute_name");
+const vertex_attribute_range = defineModel("vertex_attribute_range");
+const vertex_attribute_color_map = defineModel("vertex_attribute_color_map");
 
-  const edge_attribute_name = defineModel("edge_attribute_name")
-  const edge_attribute_range = defineModel("edge_attribute_range")
-  const edge_attribute_color_map = defineModel("edge_attribute_color_map")
+const edge_attribute_name = defineModel("edge_attribute_name");
+const edge_attribute_range = defineModel("edge_attribute_range");
+const edge_attribute_color_map = defineModel("edge_attribute_color_map");
 
-  const cell_attribute_name = defineModel("cell_attribute_name")
-  const cell_attribute_range = defineModel("cell_attribute_range")
-  const cell_attribute_color_map = defineModel("cell_attribute_color_map")
+const cell_attribute_name = defineModel("cell_attribute_name");
+const cell_attribute_range = defineModel("cell_attribute_range");
+const cell_attribute_color_map = defineModel("cell_attribute_color_map");
 
-  const polygon_attribute_name = defineModel("polygon_attribute_name")
-  const polygon_attribute_range = defineModel("polygon_attribute_range")
-  const polygon_attribute_color_map = defineModel("polygon_attribute_color_map")
+const polygon_attribute_name = defineModel("polygon_attribute_name");
+const polygon_attribute_range = defineModel("polygon_attribute_range");
+const polygon_attribute_color_map = defineModel("polygon_attribute_color_map");
 
-  const polyhedron_attribute_name = defineModel("polyhedron_attribute_name")
-  const polyhedron_attribute_range = defineModel("polyhedron_attribute_range")
-  const polyhedron_attribute_color_map = defineModel(
-    "polyhedron_attribute_color_map",
-  )
+const polyhedron_attribute_name = defineModel("polyhedron_attribute_name");
+const polyhedron_attribute_range = defineModel("polyhedron_attribute_range");
+const polyhedron_attribute_color_map = defineModel("polyhedron_attribute_color_map");
 
-  const { id } = defineProps({
-    id: { type: String, required: true },
-  })
+const { id } = defineProps({
+  id: { type: String, required: true },
+});
 
-  const has_color = computed(() => color.value !== undefined)
-  const has_textures = computed(() => textures.value !== undefined)
-  const has_vertex = computed(() => vertex_attribute_range.value !== undefined)
-  const has_edge = computed(() => edge_attribute_range.value !== undefined)
-  const has_cells = computed(() => cell_attribute_range.value !== undefined)
-  const has_polygons = computed(
-    () => polygon_attribute_range.value !== undefined,
-  )
-  const has_polyhedra = computed(
-    () => polyhedron_attribute_range.value !== undefined,
-  )
+const has_color = computed(() => color.value !== undefined);
+const has_textures = computed(() => textures.value !== undefined);
+const has_vertex = computed(() => vertex_attribute_range.value !== undefined);
+const has_edge = computed(() => edge_attribute_range.value !== undefined);
+const has_cells = computed(() => cell_attribute_range.value !== undefined);
+const has_polygons = computed(() => polygon_attribute_range.value !== undefined);
+const has_polyhedra = computed(() => polyhedron_attribute_range.value !== undefined);
 
-  const color_dict = { name: "Color", value: "color" }
-  const textures_dict = { name: "Textures", value: "textures" }
-  const vertex_dict = { name: "Vertex attribute", value: "vertex" }
-  const edge_dict = { name: "Edge attribute", value: "edge" }
-  const cell_dict = { name: "Cell attribute", value: "cell" }
-  const polygon_dict = { name: "Polygon attribute", value: "polygon" }
-  const polyhedron_dict = {
-    name: "Polyhedron attribute",
-    value: "polyhedron",
+const color_dict = { name: "Color", value: "color" };
+const textures_dict = { name: "Textures", value: "textures" };
+const vertex_dict = { name: "Vertex attribute", value: "vertex" };
+const edge_dict = { name: "Edge attribute", value: "edge" };
+const cell_dict = { name: "Cell attribute", value: "cell" };
+const polygon_dict = { name: "Polygon attribute", value: "polygon" };
+const polyhedron_dict = {
+  name: "Polyhedron attribute",
+  value: "polyhedron",
+};
+const coloring_styles = computed(() => {
+  const array = [];
+  if (has_color.value) {
+    array.push(color_dict);
+  }
+  if (has_textures.value) {
+    array.push(textures_dict);
+  }
+  if (has_vertex.value) {
+    array.push(vertex_dict);
+  }
+  if (has_edge.value) {
+    array.push(edge_dict);
+  }
+  if (has_cells.value) {
+    array.push(cell_dict);
+  }
+  if (has_polygons.value) {
+    array.push(polygon_dict);
+  }
+  if (has_polyhedra.value) {
+    array.push(polyhedron_dict);
   }
-  const coloring_styles = computed(() => {
-    const array = []
-    if (has_color.value) {
-      array.push(color_dict)
-    }
-    if (has_textures.value) {
-      array.push(textures_dict)
-    }
-    if (has_vertex.value) {
-      array.push(vertex_dict)
-    }
-    if (has_edge.value) {
-      array.push(edge_dict)
-    }
-    if (has_cells.value) {
-      array.push(cell_dict)
-    }
-    if (has_polygons.value) {
-      array.push(polygon_dict)
-    }
-    if (has_polyhedra.value) {
-      array.push(polyhedron_dict)
-    }
 
-    const labels = array.map((coloring) => coloring.name)
-    const values = array.map((coloring) => coloring.value)
+  const labels = array.map((coloring) => coloring.name);
+  const values = array.map((coloring) => coloring.value);
 
-    return { labels, values }
-  })
+  return { labels, values };
+});
 
-  const coloring_style_label = ref(
-    coloring_styles.value.labels[
-      coloring_styles.value.values.indexOf(coloring_style_key.value)
-    ],
-  )
+const coloring_style_label = ref(
+  coloring_styles.value.labels[coloring_styles.value.values.indexOf(coloring_style_key.value)],
+);
 
-  watch(coloring_style_label, (value) => {
-    coloring_style_key.value =
-      coloring_styles.value.values[coloring_styles.value.labels.indexOf(value)]
-  })
+watch(coloring_style_label, (value) => {
+  coloring_style_key.value =
+    coloring_styles.value.values[coloring_styles.value.labels.indexOf(value)];
+});
 </script>
 <template>
   <v-row justify="center" align="center">
@@ -104,11 +96,7 @@
     <v-col>
       <v-row justify="center" align="center">
         <v-col cols="auto">
-          <v-icon
-            size="30"
-            icon="mdi-format-color-fill"
-            v-tooltip:left="'Coloring'"
-          />
+          <v-icon size="30" icon="mdi-format-color-fill" v-tooltip:left="'Coloring'" />
         </v-col>
         <v-col>
           <v-select
@@ -170,9 +158,7 @@
               v-model:range="polyhedron_attribute_range"
               v-model:colorMap="polyhedron_attribute_color_map"
               :id="id"
-              :schema="
-                back_schemas.opengeodeweb_back.polyhedron_attribute_names
-              "
+              :schema="back_schemas.opengeodeweb_back.polyhedron_attribute_names"
             />
           </template>
         </v-col>

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

@@ -1,74 +1,74 @@
 <script setup>
-  import FileUploader from "@ogw_front/components/FileUploader"
-  import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
-  import { useGeodeStore } from "@ogw_front/stores/geode"
+import FileUploader from "@ogw_front/components/FileUploader";
+import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json";
+import { useGeodeStore } from "@ogw_front/stores/geode";
 
-  const emit = defineEmits(["update_value"])
+const emit = defineEmits(["update_value"]);
 
-  const { id } = defineProps({
-    id: { type: String, required: true },
-    texture_id: { type: String, required: true },
-    texture_name: { type: String, required: true },
-  })
+const { id } = defineProps({
+  id: { type: String, required: true },
+  texture_id: { type: String, required: true },
+  texture_name: { type: String, required: true },
+});
 
-  const texture_name = ref("")
-  texture_name.value = texture_name
+const texture_name = ref("");
+texture_name.value = texture_name;
 
-  const texture_id = ref("")
-  texture_id.value = texture_id
+const texture_id = ref("");
+texture_id.value = texture_id;
 
-  const texture_coordinates = ref([])
-  const geodeStore = useGeodeStore()
+const texture_coordinates = ref([]);
+const geodeStore = useGeodeStore();
 
-  onMounted(() => {
-    getTextureCoordinates()
-  })
+onMounted(() => {
+  getTextureCoordinates();
+});
 
-  function getTextureCoordinates() {
-    geodeStore.request(
-      back_schemas.opengeodeweb_back.texture_coordinates,
-      { id: id },
-      {
-        response_function: (response) => {
-          texture_coordinates.value = response.texture_coordinates
-        },
+function getTextureCoordinates() {
+  geodeStore.request(
+    back_schemas.opengeodeweb_back.texture_coordinates,
+    { id: id },
+    {
+      response_function: (response) => {
+        texture_coordinates.value = response.texture_coordinates;
       },
-    )
-  }
+    },
+  );
+}
 
-  async function files_uploaded_event(value) {
-    if (value.length > 0) {
-      await geodeStore.request(
-        back_schemas.opengeodeweb_back.save_viewable_file,
-        {
-          schema: back_schemas.opengeodeweb_back.save_viewable_file,
-          params: {
-            geode_object_type: "RasterImage2D",
-            filename: value[0].name,
-          },
+async function files_uploaded_event(value) {
+  if (value.length > 0) {
+    await geodeStore.request(
+      back_schemas.opengeodeweb_back.save_viewable_file,
+      {
+        schema: back_schemas.opengeodeweb_back.save_viewable_file,
+        params: {
+          geode_object_type: "RasterImage2D",
+          filename: value[0].name,
         },
-        {
-          response_function: (response) => {
-            texture_id.value = response.id
-          },
+      },
+      {
+        response_function: (response) => {
+          texture_id.value = response.id;
         },
-      )
-    }
+      },
+    );
   }
+}
 
-  watch(texture_name, (value) => {
-    emit("update_value", { key: "texture_name", value })
-  })
+watch(texture_name, (value) => {
+  emit("update_value", { key: "texture_name", value });
+});
 
-  watch(texture_id, (value) => {
-    emit("update_value", { key: "id", value })
-  })
+watch(texture_id, (value) => {
+  emit("update_value", { key: "id", value });
+});
 </script>
 
 <style>
-  .v-input__details {
-    display: none;
-  }
+.v-input__details {
+  display: none;
+}
 </style>
 
 <template>
@@ -100,10 +100,6 @@
     </v-col>
   </v-badge>
   <v-col v-if="texture_name == '' || texture_file_name == ''" cols="1">
-    <v-icon
-      size="20"
-      icon="mdi-close-circle"
-      v-tooltip:bottom="'Invalid texture'"
-    />
+    <v-icon size="20" icon="mdi-close-circle" v-tooltip:bottom="'Invalid texture'" />
   </v-col>
 </template>

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

@@ -1,39 +1,35 @@
 <script setup>
-  import ViewerOptionsTextureItem from "@ogw_front/components/Viewer/Options/TextureItem"
+import ViewerOptionsTextureItem from "@ogw_front/components/Viewer/Options/TextureItem";
 
-  const textures = defineModel()
+const textures = defineModel();
 
-  const { id } = defineProps({
-    id: { type: String, required: true },
-  })
+const { id } = defineProps({
+  id: { type: String, required: true },
+});
 
-  const internal_textures = ref([])
+const internal_textures = ref([]);
 
-  onMounted(() => {
-    if (textures.value === null) {
-      internal_textures.value = [{ id: "", texture_name: "" }]
-    } else {
-      internal_textures.value = textures.value
-    }
-  })
+onMounted(() => {
+  if (textures.value === null) {
+    internal_textures.value = [{ id: "", texture_name: "" }];
+  } else {
+    internal_textures.value = textures.value;
+  }
+});
 
-  function update_value_event($event, index) {
-    internal_textures.value[index][$event.key] = $event.value
-    const filtered = internal_textures.value.filter(
-      (texture) => texture.texture_name !== "" && texture.id !== "",
-    )
-    if (filtered.length > 0) {
-      textures.value = filtered
-    }
+function update_value_event($event, index) {
+  internal_textures.value[index][$event.key] = $event.value;
+  const filtered = internal_textures.value.filter(
+    (texture) => texture.texture_name !== "" && texture.id !== "",
+  );
+  if (filtered.length > 0) {
+    textures.value = filtered;
   }
+}
 </script>
 
 <template>
-  <v-row
-    v-for="(texture, index) in internal_textures"
-    :key="texture"
-    align="center"
-  >
+  <v-row v-for="(texture, index) in internal_textures" :key="texture" align="center">
     <br />
     <v-col cols="1" class="pa-0">
       <v-icon

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

@@ -1,5 +1,5 @@
 <script setup>
-  const visibility = defineModel()
+const visibility = defineModel();
 </script>
 
 <template>

package/app/components/Viewer/PointSet/SpecificPointsOptions.vue

@@ -1,77 +1,70 @@
 <script setup>
-  import PointSetPoints from "@ogw_front/assets/viewer_svgs/point_set_points.svg"
-  import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenuItem"
-  import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector"
-  import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch"
+import PointSetPoints from "@ogw_front/assets/viewer_svgs/point_set_points.svg";
+import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenuItem";
+import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector";
+import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch";
 
-  import { useDataStyleStore } from "@ogw_front/stores/data_style"
-  import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer"
+import { useDataStyleStore } from "@ogw_front/stores/data_style";
+import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
-  const dataStyleStore = useDataStyleStore()
-  const hybridViewerStore = useHybridViewerStore()
+const dataStyleStore = useDataStyleStore();
+const hybridViewerStore = useHybridViewerStore();
 
-  const { itemProps } = defineProps({
-    itemProps: { type: Object, required: true },
-  })
+const { itemProps } = defineProps({
+  itemProps: { type: Object, required: true },
+});
 
-  const id = toRef(() => itemProps.id)
+const id = toRef(() => itemProps.id);
 
-  const visibility = computed({
-    get: () => dataStyleStore.meshPointsVisibility(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsVisibility(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const size = computed({
-    get: () => dataStyleStore.meshPointsSize(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsSize(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const coloring_style_key = computed({
-    get: () => dataStyleStore.meshPointsActiveColoring(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsActiveColoring(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const color = computed({
-    get: () => dataStyleStore.meshPointsColor(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsColor(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const vertex_attribute_name = computed({
-    get: () => dataStyleStore.meshPointsVertexAttributeName(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsVertexAttributeName(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const vertex_attribute_range = computed({
-    get: () => dataStyleStore.meshPointsVertexAttributeRange(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsVertexAttributeRange(
-        id.value,
-        newValue[0],
-        newValue[1],
-      )
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const vertex_attribute_color_map = computed({
-    get: () => dataStyleStore.meshPointsVertexAttributeColorMap(id.value),
-    set: async (newValue) => {
-      await dataStyleStore.setMeshPointsVertexAttributeColorMap(
-        id.value,
-        newValue,
-      )
-      hybridViewerStore.remoteRender()
-    },
-  })
+const visibility = computed({
+  get: () => dataStyleStore.meshPointsVisibility(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsVisibility(id.value, newValue);
+    hybridViewerStore.remoteRender();
+  },
+});
+const size = computed({
+  get: () => dataStyleStore.meshPointsSize(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsSize(id.value, newValue);
+    hybridViewerStore.remoteRender();
+  },
+});
+const coloring_style_key = computed({
+  get: () => dataStyleStore.meshPointsActiveColoring(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsActiveColoring(id.value, newValue);
+    hybridViewerStore.remoteRender();
+  },
+});
+const color = computed({
+  get: () => dataStyleStore.meshPointsColor(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsColor(id.value, newValue);
+    hybridViewerStore.remoteRender();
+  },
+});
+const vertex_attribute_name = computed({
+  get: () => dataStyleStore.meshPointsVertexAttributeName(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsVertexAttributeName(id.value, newValue);
+    hybridViewerStore.remoteRender();
+  },
+});
+const vertex_attribute_range = computed({
+  get: () => dataStyleStore.meshPointsVertexAttributeRange(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsVertexAttributeRange(id.value, newValue[0], newValue[1]);
+    hybridViewerStore.remoteRender();
+  },
+});
+const vertex_attribute_color_map = computed({
+  get: () => dataStyleStore.meshPointsVertexAttributeColorMap(id.value),
+  set: async (newValue) => {
+    await dataStyleStore.setMeshPointsVertexAttributeColorMap(id.value, newValue);
+    hybridViewerStore.remoteRender();
+  },
+});
 </script>
 <template>
   <ViewerContextMenuItem

package/app/components/Viewer/PolygonalSurface/EdgesOptions.vue

@@ -1,15 +1,12 @@
 <script setup>
-  import PolygonalSurfaceEdges from "@ogw_front/assets/viewer_svgs/surface_edges.svg"
-  import ViewerGenericMeshEdgesOptions from "@ogw_front/components/Viewer/Generic/Mesh/EdgesOptions"
+import PolygonalSurfaceEdges from "@ogw_front/assets/viewer_svgs/surface_edges.svg";
+import ViewerGenericMeshEdgesOptions from "@ogw_front/components/Viewer/Generic/Mesh/EdgesOptions";
 
-  const { itemProps } = defineProps({
-    itemProps: { type: Object, required: true },
-  })
+const { itemProps } = defineProps({
+  itemProps: { type: Object, required: true },
+});
 </script>
 
 <template>
-  <ViewerGenericMeshEdgesOptions
-    :itemProps="itemProps"
-    :btn_image="PolygonalSurfaceEdges"
-  />
+  <ViewerGenericMeshEdgesOptions :itemProps="itemProps" :btn_image="PolygonalSurfaceEdges" />
 </template>

package/app/components/Viewer/PolygonalSurface/PointsOptions.vue

@@ -1,15 +1,12 @@
 <script setup>
-  import PolygonalSurfacePoints from "@ogw_front/assets/viewer_svgs/surface_points.svg"
-  import ViewerGenericMeshPointsOptions from "@ogw_front/components/Viewer/Generic/Mesh/PointsOptions"
+import PolygonalSurfacePoints from "@ogw_front/assets/viewer_svgs/surface_points.svg";
+import ViewerGenericMeshPointsOptions from "@ogw_front/components/Viewer/Generic/Mesh/PointsOptions";
 
-  const { itemProps } = defineProps({
-    itemProps: { type: Object, required: true },
-  })
+const { itemProps } = defineProps({
+  itemProps: { type: Object, required: true },
+});
 </script>
 
 <template>
-  <ViewerGenericMeshPointsOptions
-    :itemProps="itemProps"
-    :btn_image="PolygonalSurfacePoints"
-  />
+  <ViewerGenericMeshPointsOptions :itemProps="itemProps" :btn_image="PolygonalSurfacePoints" />
 </template>