Test/integration model

components/Viewer/TreeComponent.vue

@@ -40,22 +40,42 @@
           removed_blocks,
         ] = sortMeshComponents(removed)
         if (added_corners.length > 0)
-          dataStyleStore.setCornerVisibility(props.id, added_corners, true)
+          dataStyleStore.setModelCornersVisibility(
+            props.id,
+            added_corners,
+            true,
+          )
         if (added_lines.length > 0)
-          dataStyleStore.setLineVisibility(props.id, added_lines, true)
+          dataStyleStore.setModelLinesVisibility(props.id, added_lines, true)
         if (added_surfaces.length > 0)
-          dataStyleStore.setSurfaceVisibility(props.id, added_surfaces, true)
+          dataStyleStore.setModelSurfacesVisibility(
+            props.id,
+            added_surfaces,
+            true,
+          )
         if (added_blocks.length > 0)
-          dataStyleStore.setBlockVisibility(props.id, added_blocks, true)
+          dataStyleStore.setModelBlocksVisibility(props.id, added_blocks, true)
 
         if (removed_corners.length > 0)
-          dataStyleStore.setCornerVisibility(props.id, removed_corners, false)
+          dataStyleStore.setModelCornersVisibility(
+            props.id,
+            removed_corners,
+            false,
+          )
         if (removed_lines.length > 0)
-          dataStyleStore.setLineVisibility(props.id, removed_lines, false)
+          dataStyleStore.setModelLinesVisibility(props.id, removed_lines, false)
         if (removed_surfaces.length > 0)
-          dataStyleStore.setSurfaceVisibility(props.id, removed_surfaces, false)
+          dataStyleStore.setModelSurfacesVisibility(
+            props.id,
+            removed_surfaces,
+            false,
+          )
         if (removed_blocks.length > 0)
-          dataStyleStore.setBlockVisibility(props.id, removed_blocks, false)
+          dataStyleStore.setModelBlocksVisibility(
+            props.id,
+            removed_blocks,
+            false,
+          )
       }
     },
     { immediate: true, deep: true },

composables/viewer_call.js

@@ -27,7 +27,7 @@ export function viewer_call(
       .getSession()
       .call(schema.$id, [params])
       .then(
-        (value) => {
+        async (value) => {
           if (response_function) {
             response_function(value)
           }

internal_stores/data_style_state.js

@@ -3,7 +3,12 @@ import { reactive, computed } from "vue"
 export default function useDataStyleState() {
   const styles = reactive({})
 
-  const objectVisibility = computed(() => (id) => styles[id].visibility)
+  const objectVisibility = computed(() => (id) => {
+    if (styles[id]) {
+      return styles[id].visibility
+    }
+    return false
+  })
   const selectedObjects = computed(() => {
     const selection = []
     for (const [id, value] of Object.entries(styles)) {

internal_stores/mesh/edges.js

@@ -1,5 +1,7 @@
 // Third party imports
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local constants
 const mesh_edges_schemas = viewer_schemas.opengeodeweb_viewer.mesh.edges
 
 export function useMeshEdgesStyle() {
@@ -13,14 +15,15 @@ export function useMeshEdgesStyle() {
     return meshEdgesStyle(id).visibility
   }
   function setMeshEdgesVisibility(id, visibility) {
-    const mesh_edges_style = meshEdgesStyle(id)
     return viewer_call(
       { schema: mesh_edges_schemas.visibility, params: { id, visibility } },
       {
         response_function: () => {
-          mesh_edges_style.visibility = visibility
+          meshEdgesStyle(id).visibility = visibility
           console.log(
-            `${setMeshEdgesVisibility.name} ${id} ${meshEdgesVisibility(id)}`,
+            setMeshEdgesVisibility.name,
+            { id },
+            meshEdgesVisibility(id),
           )
         },
       },
@@ -34,15 +37,19 @@ export function useMeshEdgesStyle() {
     const coloring = meshEdgesStyle(id).coloring
     coloring.active = type
     console.log(
-      `${setMeshEdgesActiveColoring.name} ${id} ${meshEdgesActiveColoring(id)}`,
+      setMeshEdgesActiveColoring.name,
+      { id },
+      meshEdgesActiveColoring(id),
     )
     if (type === "color") {
       return setMeshEdgesColor(id, coloring.color)
       // } else if (type == "vertex" && coloring.vertex !== null) {
       //   return setEdgesVertexAttribute(id, coloring.vertex)
       // } else if (type == "edges" && coloring.edges !== null) {
       //   return setEdgesEdgeAttribute(id, coloring.edges)
-    } else throw new Error("Unknown edges coloring type: " + type)
+    } else {
+      throw new Error("Unknown mesh edges coloring type: " + type)
+    }
   }
 
   function meshEdgesColor(id) {
@@ -56,7 +63,9 @@ export function useMeshEdgesStyle() {
         response_function: () => {
           coloring_style.color = color
           console.log(
-            `${setMeshEdgesColor.name} ${id} ${JSON.stringify(meshEdgesColor(id))}`,
+            setMeshEdgesColor.name,
+            { id },
+            JSON.stringify(meshEdgesColor(id)),
           )
         },
       },
@@ -73,7 +82,7 @@ export function useMeshEdgesStyle() {
       {
         response_function: () => {
           edges_style.width = width
-          console.log(`${setMeshEdgesWidth.name} ${id} ${meshEdgesWidth(id)}`)
+          console.log(setMeshEdgesWidth.name, { id }, meshEdgesWidth(id))
         },
       },
     )

internal_stores/mesh/index.js

@@ -7,6 +7,9 @@ import { useMeshEdgesStyle } from "./edges.js"
 import { useMeshPolygonsStyle } from "./polygons.js"
 import { useMeshPolyhedraStyle } from "./polyhedra.js"
 
+// Local constants
+const mesh_schemas = viewer_schemas.opengeodeweb_viewer.mesh
+
 export default function useMeshStyle() {
   const dataStyleStore = useDataStyleStore()
   const pointsStyleStore = useMeshPointsStyle()
@@ -16,51 +19,53 @@ export default function useMeshStyle() {
   const hybridViewerStore = useHybridViewerStore()
 
   function meshVisibility(id) {
-    return dataStyleStore.styles[id].visibility
+    return dataStyleStore.getStyle(id).visibility
   }
   function setMeshVisibility(id, visibility) {
     return viewer_call(
       {
-        schema: viewer_schemas.opengeodeweb_viewer.mesh.visibility,
+        schema: mesh_schemas.visibility,
         params: { id, visibility },
       },
       {
         response_function: () => {
           hybridViewerStore.setVisibility(id, visibility)
-          dataStyleStore.styles[id].visibility = visibility
-          console.log(`${setMeshVisibility.name} ${id} ${meshVisibility(id)}`)
+          dataStyleStore.getStyle(id).visibility = visibility
+          console.log(setMeshVisibility.name, { id }, meshVisibility(id))
         },
       },
     )
   }
 
-  function applyMeshDefaultStyle(id) {
+  function applyMeshStyle(id) {
     const style = dataStyleStore.getStyle(id)
     const promise_array = []
     for (const [key, value] of Object.entries(style)) {
-      if (key == "visibility") {
+      if (key === "visibility") {
         promise_array.push(setMeshVisibility(id, value))
-      } else if (key == "points") {
+      } else if (key === "points") {
         promise_array.push(pointsStyleStore.applyMeshPointsStyle(id, value))
-      } else if (key == "edges") {
+      } else if (key === "edges") {
         promise_array.push(edgesStyleStore.applyMeshEdgesStyle(id, value))
-      } else if (key == "polygons") {
+      } else if (key === "polygons") {
         promise_array.push(
           meshPolygonsStyleStore.applyMeshPolygonsStyle(id, value),
         )
-      } else if (key == "polyhedra") {
+      } else if (key === "polyhedra") {
         promise_array.push(
           meshPolyhedraStyleStore.applyMeshPolyhedraStyle(id, value),
         )
+      } else {
+        throw new Error("Unknown mesh key: " + key)
       }
     }
-    return promise_array
+    return Promise.all(promise_array)
   }
 
   return {
     meshVisibility,
     setMeshVisibility,
-    applyMeshDefaultStyle,
+    applyMeshStyle,
     ...useMeshPointsStyle(),
     ...useMeshEdgesStyle(),
     ...useMeshPolygonsStyle(),

internal_stores/mesh/points.js

@@ -1,4 +1,7 @@
+// Third party imports
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local constants
 const mesh_points_schemas = viewer_schemas.opengeodeweb_viewer.mesh.points
 
 export function useMeshPointsStyle() {
@@ -19,7 +22,9 @@ export function useMeshPointsStyle() {
         response_function: () => {
           points_style.visibility = visibility
           console.log(
-            `${setMeshPointsVisibility.name} ${id} ${meshPointsVisibility(id)}`,
+            setMeshPointsVisibility.name,
+            { id },
+            meshPointsVisibility(id),
           )
         },
       },
@@ -33,13 +38,17 @@ export function useMeshPointsStyle() {
     const coloring = meshPointsStyle(id).coloring
     coloring.active = type
     console.log(
-      `${setMeshPointsActiveColoring.name} ${id} ${meshPointsActiveColoring(id)}`,
+      setMeshPointsActiveColoring.name,
+      { id },
+      meshPointsActiveColoring(id),
     )
     if (type == "color") {
       return dataStyleStore.setMeshPointsColor(id, coloring.color)
     } else if (type == "vertex" && coloring.vertex !== null) {
       return dataStyleStore.setMeshPointsVertexAttribute(id, coloring.vertex)
-    } else throw new Error("Unknown points coloring type: " + type)
+    } else {
+      throw new Error("Unknown mesh points coloring type: " + type)
+    }
   }
 
   function meshPointsColor(id) {
@@ -53,7 +62,9 @@ export function useMeshPointsStyle() {
         response_function: () => {
           coloring_style.color = color
           console.log(
-            `${setMeshPointsColor.name} ${id} ${JSON.stringify(meshPointsColor(id))}`,
+            setMeshPointsColor.name,
+            { id },
+            JSON.stringify(meshPointsColor(id)),
           )
         },
       },
@@ -73,7 +84,9 @@ export function useMeshPointsStyle() {
         response_function: () => {
           coloring_style.vertex = vertex_attribute
           console.log(
-            `${setMeshPointsVertexAttribute.name} ${id} ${meshPointsVertexAttribute(id)}`,
+            setMeshPointsVertexAttribute.name,
+            { id },
+            meshPointsVertexAttribute(id),
           )
         },
       },
@@ -84,13 +97,12 @@ export function useMeshPointsStyle() {
     return meshPointsStyle(id).size
   }
   function setMeshPointsSize(id, size) {
-    const points_style = meshPointsStyle(id)
     return viewer_call(
       { schema: mesh_points_schemas.size, params: { id, size } },
       {
         response_function: () => {
-          points_style.size = size
-          console.log(`${setMeshPointsSize.name} ${id} ${meshPointsSize(id)}`)
+          meshPointsStyle(id).size = size
+          console.log(setMeshPointsSize.name, { id }, meshPointsSize(id))
         },
       },
     )

internal_stores/mesh/polygons.js

@@ -1,4 +1,7 @@
+// Third party imports
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local constants
 const mesh_polygons_schemas = viewer_schemas.opengeodeweb_viewer.mesh.polygons
 
 export function useMeshPolygonsStyle() {
@@ -19,7 +22,9 @@ export function useMeshPolygonsStyle() {
         response_function: () => {
           polygons_style.visibility = visibility
           console.log(
-            `${setMeshPolygonsVisibility.name} ${id} ${meshPolygonsVisibility(id)}`,
+            setMeshPolygonsVisibility.name,
+            { id },
+            meshPolygonsVisibility(id),
           )
         },
       },
@@ -37,7 +42,9 @@ export function useMeshPolygonsStyle() {
         response_function: () => {
           coloring_style.color = color
           console.log(
-            `${setMeshPolygonsColor.name} ${id} ${JSON.stringify(meshPolygonsColor(id))}`,
+            setMeshPolygonsColor.name,
+            { id },
+            JSON.stringify(meshPolygonsColor(id)),
           )
         },
       },
@@ -58,7 +65,9 @@ export function useMeshPolygonsStyle() {
         response_function: () => {
           coloring_style.textures = textures
           console.log(
-            `${setMeshPolygonsTextures.name} ${id} ${meshPolygonsTextures(id)}`,
+            setMeshPolygonsTextures.name,
+            { id },
+            meshPolygonsTextures(id),
           )
         },
       },
@@ -80,7 +89,9 @@ export function useMeshPolygonsStyle() {
         response_function: () => {
           coloring_style.vertex = vertex_attribute
           console.log(
-            `${setMeshPolygonsVertexAttribute.name} ${id} ${meshPolygonsVertexAttribute(id)}`,
+            setMeshPolygonsVertexAttribute.name,
+            { id },
+            meshPolygonsVertexAttribute(id),
           )
         },
       },
@@ -101,7 +112,9 @@ export function useMeshPolygonsStyle() {
         response_function: () => {
           coloring_style.polygon = polygon_attribute
           console.log(
-            `${setMeshPolygonsPolygonAttribute.name} ${id} ${meshPolygonsPolygonAttribute(id)}`,
+            setMeshPolygonsPolygonAttribute.name,
+            { id },
+            meshPolygonsPolygonAttribute(id),
           )
         },
       },
@@ -115,7 +128,9 @@ export function useMeshPolygonsStyle() {
     const coloring = meshPolygonsStyle(id).coloring
     coloring.active = type
     console.log(
-      `${setMeshPolygonsActiveColoring.name} ${id} ${meshPolygonsActiveColoring(id)}`,
+      setMeshPolygonsActiveColoring.name,
+      { id },
+      meshPolygonsActiveColoring(id),
     )
     if (type === "color") {
       return setMeshPolygonsColor(id, coloring.color)
@@ -125,7 +140,9 @@ export function useMeshPolygonsStyle() {
       return setMeshPolygonsVertexAttribute(id, coloring.vertex)
     } else if (type === "polygon" && coloring.polygon !== null) {
       return setMeshPolygonsPolygonAttribute(id, coloring.polygon)
-    } else throw new Error("Unknown polygons coloring type: " + type)
+    } else {
+      throw new Error("Unknown mesh polygons coloring type: " + type)
+    }
   }
 
   function applyMeshPolygonsStyle(id, style) {