@geode/opengeodeweb-front 10.14.0-rc.7 → 10.14.0

package/app/components/Viewer/ObjectTree/Views/GlobalObjects.vue

@@ -2,14 +2,18 @@
 import ObjectTreeControls from "@ogw_front/components/Viewer/ObjectTree/Base/Controls.vue";
 import ObjectTreeItemLabel from "@ogw_front/components/Viewer/ObjectTree/Base/ItemLabel.vue";
 import { compareSelections } from "@ogw_front/utils/treeview";
+import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
+import { useHoverhighlight } from "@ogw_front/composables/use_hover_highlight";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 import { useTreeFilter } from "@ogw_front/composables/use_tree_filter";
 import { useTreeviewStore } from "@ogw_front/stores/treeview";
 
 const treeviewStore = useTreeviewStore();
+const dataStore = useDataStore();
 const dataStyleStore = useDataStyleStore();
 const hybridViewerStore = useHybridViewerStore();
+const { onHoverEnter, onHoverLeave } = useHoverhighlight();
 
 const emit = defineEmits(["show-menu"]);
 
@@ -62,6 +66,21 @@ function isModel(item) {
     actualItem.viewer_type === "model" || ["BRep", "Section"].includes(actualItem.geode_object_type)
   );
 }
+
+async function handleHoverEnter(item) {
+  const actualItem = item.raw || item;
+  const is_model = isModel(item);
+  let block_ids = [];
+  if (is_model) {
+    block_ids = await dataStore.getAllModelComponentsViewerIds(actualItem.id);
+  }
+  onHoverEnter(actualItem.id, block_ids, is_model ? "model" : "mesh");
+}
+
+function handleHoverLeave(item) {
+  const actualItem = item.raw || item;
+  onHoverLeave(actualItem.id);
+}
 </script>
 
 <template>
@@ -89,6 +108,8 @@ function isModel(item) {
       <template #title="{ item }">
         <ObjectTreeItemLabel
           :item="item"
+          @mouseenter="handleHoverEnter(item)"
+          @mouseleave="handleHoverLeave(item)"
           @contextmenu="emit('show-menu', { event: $event, itemId: item.id })"
         />
       </template>

package/app/components/Viewer/ObjectTree/Views/ModelComponents.vue

@@ -5,11 +5,13 @@ import ObjectTreeItemLabel from "@ogw_front/components/Viewer/ObjectTree/Base/It
 import { compareSelections } from "@ogw_front/utils/treeview";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
+import { useHoverhighlight } from "@ogw_front/composables/use_hover_highlight";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 import { useTreeFilter } from "@ogw_front/composables/use_tree_filter";
 import { useTreeviewStore } from "@ogw_front/stores/treeview";
 
 const { id: viewId } = defineProps({ id: { type: String, required: true } });
+const { onHoverEnter, onHoverLeave } = useHoverhighlight();
 const emit = defineEmits(["show-menu"]);
 
 const dataStore = useDataStore();
@@ -63,6 +65,18 @@ function showContextMenu(event, item) {
     modelComponentType: actualItem.category ? undefined : actualItem.id,
   });
 }
+
+function handleHoverEnter(item) {
+  const actualItem = item.raw || item;
+  const block_ids = actualItem.category
+    ? [actualItem.viewer_id]
+    : actualItem.children?.map((child) => child.viewer_id) || [];
+  onHoverEnter(viewId, block_ids);
+}
+
+function handleHoverLeave() {
+  onHoverLeave(viewId);
+}
 </script>
 
 <template>
@@ -95,6 +109,8 @@ function showContextMenu(event, item) {
         <ObjectTreeItemLabel
           :item="item"
           show-tooltip
+          @mouseenter="handleHoverEnter(item)"
+          @mouseleave="handleHoverLeave(item)"
           @contextmenu="showContextMenu($event, item)"
         />
       </template>

package/app/composables/use_hover_highlight.js

@@ -0,0 +1,48 @@
+import { useViewerStore } from "@ogw_front/stores/viewer";
+import vtk_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
+
+const HOVER_DELAY = 1000;
+
+export function useHoverhighlight() {
+  const viewerStore = useViewerStore();
+  let timer = undefined;
+  let currentId = undefined;
+  let currentType = undefined;
+
+  function onHoverEnter(id, block_ids = [], type = "model") {
+    if (timer) {
+      clearTimeout(timer);
+    }
+    const schema = vtk_schemas.opengeodeweb_viewer[type].highlight;
+    timer = setTimeout(async () => {
+      currentId = id;
+      currentType = type;
+      const params = {
+        id,
+        visibility: true,
+        ...(type === "model" && { block_ids }),
+      };
+      await viewerStore.request(schema, params);
+    }, HOVER_DELAY);
+  }
+
+  function onHoverLeave(id) {
+    if (timer) {
+      clearTimeout(timer);
+      timer = undefined;
+    }
+    if (currentId === id) {
+      const schema = vtk_schemas.opengeodeweb_viewer[currentType].highlight;
+      const params = {
+        id,
+        visibility: false,
+        ...(currentType === "model" && { block_ids: [] }),
+      };
+      viewerStore.request(schema, params);
+      currentId = undefined;
+      currentType = undefined;
+    }
+  }
+
+  return { onHoverEnter, onHoverLeave };
+}

package/app/stores/data.js

@@ -63,6 +63,7 @@ export const useDataStore = defineStore("data", () => {
           id: meshComponent.geode_id,
           title: meshComponent.name,
           category: meshComponent.type,
+          viewer_id: meshComponent.viewer_id,
           is_active: meshComponent.is_active,
         })),
       }));
@@ -206,6 +207,11 @@ export const useDataStore = defineStore("data", () => {
     return await getMeshComponentGeodeIds(modelId, "Block");
   }
 
+  async function getAllModelComponentsViewerIds(modelId) {
+    const components = await database.model_components.where("id").equals(modelId).toArray();
+    return components.map((component) => Number.parseInt(component.viewer_id, 10));
+  }
+
   async function getMeshComponentsViewerIds(modelId, meshComponentGeodeIds) {
     const components = await database.model_components
       .where("[id+geode_id]")
@@ -245,6 +251,7 @@ export const useDataStore = defineStore("data", () => {
     getLinesGeodeIds,
     getSurfacesGeodeIds,
     getBlocksGeodeIds,
+    getAllModelComponentsViewerIds,
     getMeshComponentGeodeIds,
     getMeshComponentsViewerIds,
     getComponentByViewerId,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geode/opengeodeweb-front",
-  "version": "10.14.0-rc.7",
+  "version": "10.14.0",
   "description": "OpenSource Vue/Nuxt/Pinia/Vuetify framework for web applications",
   "homepage": "https://github.com/Geode-solutions/OpenGeodeWeb-Front",
   "bugs": {
@@ -34,8 +34,8 @@
     "build": ""
   },
   "dependencies": {
-    "@geode/opengeodeweb-back": "next",
-    "@geode/opengeodeweb-viewer": "next",
+    "@geode/opengeodeweb-back": "latest",
+    "@geode/opengeodeweb-viewer": "latest",
     "@google-cloud/run": "3.2.0",
     "@kitware/vtk.js": "33.3.0",
     "@mdi/font": "7.4.47",