@geode/opengeodeweb-front 10.29.1 → 10.30.0-rc.10

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

@@ -179,46 +179,48 @@ function expandAll() {
       </template>
 
       <template #append="{ item }">
-        <v-btn
-          v-if="item.viewer_type"
-          icon="mdi-target"
-          size="medium"
-          variant="text"
-          v-tooltip="'Focus camera on object'"
-          @click.stop="hybridViewerStore.focusCameraOnObject(item.id)"
-        />
-        <v-btn
-          v-if="isModel(item)"
-          icon="mdi-magnify-expand"
-          size="medium"
-          class="ml-2"
-          variant="text"
-          v-tooltip="'Model\'s mesh components'"
-          @click.stop="
-            treeviewStore.displayAdditionalTree(
-              item.id,
-              item.title,
-              item.geode_object_type,
-              'model_components',
-            )
-          "
-        />
-        <v-btn
-          v-if="isModel(item) && hasCollectionsMap[item.id]"
-          icon="mdi-format-list-group"
-          size="medium"
-          class="ml-2"
-          variant="text"
-          v-tooltip="'Model\'s collections'"
-          @click.stop="
-            treeviewStore.displayAdditionalTree(
-              item.id,
-              item.title,
-              item.geode_object_type,
-              'model_collections',
-            )
-          "
-        />
+        <template v-if="item.geode_object_type !== 'HorizonStack3D'">
+          <v-btn
+            v-if="item.viewer_type"
+            icon="mdi-target"
+            size="medium"
+            variant="text"
+            v-tooltip="'Focus camera on object'"
+            @click.stop="hybridViewerStore.focusCameraOnObject(item.id)"
+          />
+          <v-btn
+            v-if="isModel(item)"
+            icon="mdi-magnify-expand"
+            size="medium"
+            class="ml-2"
+            variant="text"
+            v-tooltip="'Model\'s mesh components'"
+            @click.stop="
+              treeviewStore.displayAdditionalTree(
+                item.id,
+                item.title,
+                item.geode_object_type,
+                'model_components',
+              )
+            "
+          />
+          <v-btn
+            v-if="isModel(item) && hasCollectionsMap[item.id]"
+            icon="mdi-format-list-group"
+            size="medium"
+            class="ml-2"
+            variant="text"
+            v-tooltip="'Model\'s collections'"
+            @click.stop="
+              treeviewStore.displayAdditionalTree(
+                item.id,
+                item.title,
+                item.geode_object_type,
+                'model_collections',
+              )
+            "
+          />
+        </template>
       </template>
     </CommonTreeView>
   </div>

package/app/composables/clipping_planes_widget.js

@@ -0,0 +1,262 @@
+import {
+  AXIS_SCALE,
+  CHANGE_THRESHOLD,
+  PLANE_COLORS,
+  SIZE_RATIO,
+  computeSceneBoundsInfo,
+  getPlaneStyle,
+  hasPlaneChanged,
+} from "@ogw_front/utils/clipping_planes";
+import { newInstance as vtkGenericRenderWindow } from "@kitware/vtk.js/Rendering/Misc/GenericRenderWindow";
+import { newInstance as vtkImplicitPlaneWidget } from "@kitware/vtk.js/Widgets/Widgets3D/ImplicitPlaneWidget";
+import { newInstance as vtkWidgetManager } from "@kitware/vtk.js/Widgets/Core/WidgetManager";
+
+// oxlint-disable-next-line max-params max-lines-per-function
+function useClippingPlanesWidget({
+  planes,
+  targetAllVisible,
+  selectedDatasetIds,
+  allItems,
+  hybridViewerStore,
+  debouncedApply,
+}) {
+  let localRenderWindow = undefined;
+  let widgetManager = undefined;
+  let widgetEntries = [];
+  let fromWidget = false;
+  let maxDistance = 0;
+  let isLimitingCameraZoom = false;
+
+  function resolveActiveActors() {
+    const targetIds = targetAllVisible.value
+      ? allItems.value.map((item) => item.id)
+      : selectedDatasetIds.value;
+    const targeted = targetIds
+      .map((id) => {
+        const item = hybridViewerStore.hybridDb[id];
+        return item ? item.actor : undefined;
+      })
+      .filter(Boolean);
+    if (targeted.length > 0) {
+      return targeted;
+    }
+    return Object.values(hybridViewerStore.hybridDb)
+      .map((entry) => entry && entry.actor)
+      .filter(Boolean);
+  }
+
+  function getSceneBoundsInfo() {
+    return computeSceneBoundsInfo(resolveActiveActors());
+  }
+
+  function getSceneCenter() {
+    return getSceneBoundsInfo().center;
+  }
+
+  function createWidgetEntry(planeWidget, widgetHandle, planeIndex) {
+    const widgetState = planeWidget.getWidgetState();
+    const plane = planes.value[planeIndex];
+    if (plane.origin) {
+      widgetState.setOrigin(plane.origin);
+    }
+    widgetState.setNormal(plane.normal);
+    const subscription = widgetState.onModified(() => {
+      if (fromWidget) {
+        return;
+      }
+      const origin = widgetState.getOrigin().map((val) => Number(val.toFixed(4)));
+      const normal = widgetState.getNormal().map((val) => Number(val.toFixed(4)));
+      if (
+        !hasPlaneChanged(
+          origin,
+          normal,
+          planes.value[planeIndex].origin,
+          planes.value[planeIndex].normal,
+        )
+      ) {
+        return;
+      }
+      fromWidget = true;
+      planes.value[planeIndex].origin = origin;
+      planes.value[planeIndex].normal = normal;
+      nextTick(() => {
+        fromWidget = false;
+      });
+      debouncedApply();
+    });
+
+    return { planeWidget, widgetHandle, subscription };
+  }
+
+  function syncWidgets() {
+    if (!widgetManager || !localRenderWindow) {
+      return;
+    }
+    while (widgetEntries.length > planes.value.length) {
+      const entry = widgetEntries.pop();
+      entry.subscription.unsubscribe();
+      widgetManager.removeWidget(entry.planeWidget);
+      entry.planeWidget.delete();
+    }
+    const { cubicBounds } = getSceneBoundsInfo();
+    for (const [idx, plane] of planes.value.entries()) {
+      const rgb = PLANE_COLORS[idx % PLANE_COLORS.length];
+      if (!widgetEntries[idx]) {
+        const planeWidget = vtkImplicitPlaneWidget();
+        const widgetHandle = widgetManager.addWidget(planeWidget);
+        widgetHandle.setAxisScale(AXIS_SCALE);
+        widgetHandle.setHandleSizeRatio(SIZE_RATIO);
+        widgetEntries.push(createWidgetEntry(planeWidget, widgetHandle, idx));
+      }
+      const entry = widgetEntries[idx];
+      entry.widgetHandle.setRepresentationStyle(getPlaneStyle(rgb));
+      fromWidget = true;
+      entry.widgetHandle.placeWidget(cubicBounds);
+      fromWidget = false;
+      entry.widgetHandle.setAxisScale(AXIS_SCALE);
+      entry.widgetHandle.setHandleSizeRatio(SIZE_RATIO);
+      const widgetState = entry.planeWidget.getWidgetState();
+      if (plane.origin) {
+        widgetState.setOrigin(plane.origin);
+      }
+      widgetState.setNormal(plane.normal);
+    }
+    localRenderWindow.getRenderWindow().render();
+  }
+
+  function limitCameraZoomOut(camera) {
+    if (maxDistance <= 0 || isLimitingCameraZoom) {
+      return;
+    }
+
+    const currentDist = camera.getDistance();
+    if (currentDist <= maxDistance + CHANGE_THRESHOLD) {
+      return;
+    }
+
+    isLimitingCameraZoom = true;
+    const focal = camera.getFocalPoint();
+    const pos = camera.getPosition();
+    const ratio = maxDistance / currentDist;
+
+    camera.setPosition(
+      focal[0] + (pos[0] - focal[0]) * ratio,
+      focal[1] + (pos[1] - focal[1]) * ratio,
+      focal[2] + (pos[2] - focal[2]) * ratio,
+    );
+    localRenderWindow.getRenderWindow().render();
+    isLimitingCameraZoom = false;
+  }
+
+  function syncLocalCamera() {
+    if (!localRenderWindow) {
+      return;
+    }
+    const renderer = localRenderWindow.getRenderer();
+    const camera = renderer.getActiveCamera();
+    const mainCam = hybridViewerStore.camera_options;
+    const { center, cubicBounds } = getSceneBoundsInfo();
+    renderer.resetCamera(cubicBounds);
+    if (mainCam && mainCam.focal_point && mainCam.position) {
+      const dir = [
+        mainCam.position[0] - mainCam.focal_point[0],
+        mainCam.position[1] - mainCam.focal_point[1],
+        mainCam.position[2] - mainCam.focal_point[2],
+      ];
+      const dirLen = Math.hypot(...dir);
+      if (dirLen > 0) {
+        const distance = camera.getDistance();
+        const normDir = dir.map((component) => component / dirLen);
+        camera.setFocalPoint(...center);
+        camera.setPosition(
+          center[0] + normDir[0] * distance,
+          center[1] + normDir[1] * distance,
+          center[2] + normDir[2] * distance,
+        );
+        if (mainCam.view_up) {
+          camera.setViewUp(...mainCam.view_up);
+        }
+      }
+    }
+
+    limitCameraZoomOut(camera);
+    localRenderWindow.getRenderWindow().render();
+  }
+
+  function cleanupLocalWidget() {
+    maxDistance = 0;
+    isLimitingCameraZoom = false;
+    for (const entry of widgetEntries) {
+      entry.subscription.unsubscribe();
+      if (widgetManager) {
+        widgetManager.removeWidget(entry.planeWidget);
+      }
+      entry.planeWidget.delete();
+    }
+    widgetEntries = [];
+    if (localRenderWindow) {
+      localRenderWindow.delete();
+      localRenderWindow = undefined;
+      widgetManager = undefined;
+    }
+  }
+
+  function initLocalWidget(container) {
+    cleanupLocalWidget();
+    container.addEventListener("wheel", (event) => event.stopPropagation(), { passive: true });
+    localRenderWindow = vtkGenericRenderWindow({
+      background: [0, 0, 0, 0],
+      listenWindowResize: false,
+    });
+    localRenderWindow.setContainer(container);
+    const camera = localRenderWindow.getRenderer().getActiveCamera();
+    camera.onModified(() => limitCameraZoomOut(camera));
+    const canvas = localRenderWindow.getApiSpecificRenderWindow().getCanvas();
+    Object.assign(canvas.style, { width: "100%", height: "100%", background: "transparent" });
+    localRenderWindow.resize();
+    widgetManager = vtkWidgetManager();
+    widgetManager.setRenderer(localRenderWindow.getRenderer());
+    updateWidgetPlacement();
+  }
+
+  function updateWidgetPlacement({ isReset = false } = {}) {
+    if (!widgetManager || !localRenderWindow) {
+      return;
+    }
+    if (isReset) {
+      maxDistance = 0;
+    }
+    const center = getSceneCenter();
+    for (const plane of planes.value) {
+      if (!plane.origin || isReset) {
+        plane.origin = [...center];
+      }
+    }
+    syncWidgets();
+    syncLocalCamera();
+    if (maxDistance <= 0) {
+      maxDistance = localRenderWindow.getRenderer().getActiveCamera().getDistance();
+    }
+  }
+
+  function isFromWidget() {
+    return fromWidget;
+  }
+
+  function setFromWidget(value) {
+    fromWidget = value;
+  }
+
+  return {
+    getSceneCenter,
+    syncWidgets,
+    syncLocalCamera,
+    cleanupLocalWidget,
+    initLocalWidget,
+    updateWidgetPlacement,
+    isFromWidget,
+    setFromWidget,
+  };
+}
+
+export { useClippingPlanesWidget };

package/app/composables/hover_highlight.js

@@ -1,3 +1,4 @@
+import { useDataStore } from "@ogw_front/stores/data";
 import { useViewerStore } from "@ogw_front/stores/viewer";
 import vtk_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
 
@@ -5,6 +6,7 @@ const HOVER_DELAY = 200;
 
 export function useHoverhighlight() {
   const viewerStore = useViewerStore();
+  const dataStore = useDataStore();
   let timer = undefined;
   let currentId = undefined;
   let currentType = undefined;
@@ -20,6 +22,10 @@ export function useHoverhighlight() {
       currentId = id;
       currentType = type;
 
+      if (!(await dataStore.isItemViewable(id))) {
+        return;
+      }
+
       let block_ids = [];
       if (typeof block_ids_provider === "function") {
         block_ids = await block_ids_provider();

package/app/composables/project_manager.js

@@ -2,8 +2,8 @@ import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.jso
 import fileDownload from "js-file-download";
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
 
+import { fetchRaw } from "@ogw_shared/utils/fetch_raw";
 import { importWorkflowFromSnapshot } from "@ogw_front/utils/import_workflow";
-
 import { useAppStore } from "@ogw_front/stores/app";
 import { useBackStore } from "@ogw_front/stores/back";
 import { useDataStore } from "@ogw_front/stores/data";
@@ -21,12 +21,14 @@ async function exportProject() {
   const snapshot = await appStore.exportStores();
   const schema = back_schemas.opengeodeweb_back.export_project;
   const defaultName = "project.vease";
-
-  const result = await $fetch(schema.$id, {
+  const params = { snapshot, filename: defaultName };
+  const result = await fetchRaw({
+    route: schema.$id,
+    params,
+    method: schema.methods[0],
     baseURL: backStore.base_url,
-    method: schema.methods.find((method) => method !== "OPTIONS"),
-    body: { snapshot, filename: defaultName },
   });
+
   fileDownload(result, defaultName);
   feedbackStore.add_success("Project exported successfully");
   return { result };
@@ -46,15 +48,15 @@ async function importProject(file) {
   if (client && client.getConnection && client.getConnection().getSession) {
     await client.getConnection().getSession().call("opengeodeweb_viewer.release_database", [{}]);
   }
-  const schema = viewer_schemas.opengeodeweb_viewer.viewer.reset_visualization;
+  const resetVisualizationSchema = viewer_schemas.opengeodeweb_viewer.viewer.reset_visualization;
   const timeout = undefined;
-  await viewerStore.request({ schema, timeout });
+  await viewerStore.request({ schema: resetVisualizationSchema, timeout });
 
   treeviewStore.clear();
   dataStore.clear();
   hybridViewerStore.clear();
 
-  const schemaImport = back_schemas.opengeodeweb_back.import_project;
+  const importProjectSchema = back_schemas.opengeodeweb_back.import_project;
   const form = new FormData();
   const originalFileName = file && file.name ? file.name : "project.vease";
   if (!originalFileName.toLowerCase().endsWith(".vease")) {
@@ -62,10 +64,11 @@ async function importProject(file) {
   }
   form.append("file", file, originalFileName);
 
-  const result = await $fetch(schemaImport.$id, {
+  const result = await fetchRaw({
+    route: importProjectSchema.$id,
+    params: form,
+    method: importProjectSchema.methods[0],
     baseURL: backStore.base_url,
-    method: "POST",
-    body: form,
   });
   const snapshot = result && result.snapshot ? result.snapshot : {};
 

package/app/composables/use_overlapping_picker.js

@@ -64,8 +64,21 @@ export function useOverlappingPicker() {
   }
 
   async function get_viewer_id({ x, y, containerWidth, containerHeight, containerRect }) {
-    const activeIds = new Set(dataItems.value.map((item) => item.id));
-    const ids = Object.keys(dataStyleStore.styles).filter((styleId) => activeIds.has(styleId));
+    const activeIds = new Set(dataItems.value.map((i) => i.id));
+    const visibleStyleIds = Object.keys(dataStyleStore.styles).filter(
+      (styleId) => activeIds.has(styleId) && dataStyleStore.objectVisibility(styleId),
+    );
+
+    const viewableChecks = await Promise.all(
+      visibleStyleIds.map(async (styleId) => {
+        try {
+          return (await dataStore.isItemViewable(styleId)) ? styleId : undefined;
+        } catch {
+          return undefined;
+        }
+      }),
+    );
+    const ids = viewableChecks.filter(Boolean);
 
     const result = { id: undefined, viewer_id: undefined };
     let pickedResponse = undefined;

package/app/stores/app.js

@@ -1,13 +1,44 @@
 // Local imports
+import { getRestApiPort, getRestApiProtocol, isCloudMode } from "@ogw_front/utils/stores.js";
+import { Status } from "@ogw_front/utils/status";
 import { api_fetch } from "@ogw_internal/utils/api_fetch.js";
-import { upload_file } from "@ogw_internal/utils/upload_file.js";
-
 import { killExtension } from "@ogw_front/utils/extension.js";
+import { upload_file } from "@ogw_internal/utils/upload_file.js";
 import { useInfraStore } from "@ogw_front/stores/infra";
 
 // oxlint-disable-next-line max-lines-per-function, max-statements
 export const useAppStore = defineStore("app", () => {
   const stores = [];
+  const globalComponents = ref(new Map());
+  const default_local_port = ref(globalThis.location.port);
+  const status = ref(Status.NOT_CONNECTED);
+  const protocol = computed(() => getRestApiProtocol());
+  const port = computed(() => getRestApiPort(default_local_port.value));
+
+  const base_url = computed(() => {
+    const infraStore = useInfraStore();
+    let app_url = `${protocol.value}://${infraStore.domain_name}:${port.value}`;
+    if (isCloudMode()) {
+      app_url += `/server`;
+    }
+    return app_url;
+  });
+
+  function registerGlobalComponent(extensionId, componentId, component) {
+    if (!globalComponents.value.has(extensionId)) {
+      globalComponents.value.set(extensionId, new Map());
+    }
+    globalComponents.value.get(extensionId).set(componentId, component);
+    console.log(
+      `[AppStore] Registered global component ${componentId} for extension ${extensionId}`,
+    );
+  }
+
+  function unregisterGlobalComponent(extensionId, componentId) {
+    if (globalComponents.value.has(extensionId)) {
+      globalComponents.value.get(extensionId).delete(componentId);
+    }
+  }
 
   function registerStore(store) {
     const isAlreadyRegistered = stores.some((registeredStore) => registeredStore.$id === store.$id);
@@ -91,7 +122,7 @@ export const useAppStore = defineStore("app", () => {
     return loadedExtensions.value.get(id);
   }
 
-  async function loadExtension(path, port, backendPath = undefined) {
+  async function loadExtension(path, extensionPort, backendPath = undefined) {
     try {
       let finalURL = path;
 
@@ -108,7 +139,7 @@ export const useAppStore = defineStore("app", () => {
       // oxlint-disable-next-line no-inline-comments
       const extensionModule = await import(/* @vite-ignore */ finalURL);
       const store = extensionModule.metadata.store();
-      store.$patch({ default_local_port: port });
+      store.$patch({ default_local_port: extensionPort });
 
       if (finalURL !== path && finalURL.startsWith("blob:")) {
         URL.revokeObjectURL(finalURL);
@@ -196,11 +227,16 @@ export const useAppStore = defineStore("app", () => {
   }
 
   function upload(file, callbacks = {}) {
-    const route = "/api/microservice/extensions/upload";
+    const schema = {
+      $id: "/api/local/extensions/upload",
+      methods: ["OPTIONS", "PUT"],
+    };
     const store = useAppStore();
+    const { PROJECT: projectName } = useRuntimeConfig().public;
+    const params = { projectName };
     return upload_file(
       store,
-      { route, file },
+      { schema, file, params },
       {
         ...callbacks,
         response_function: async (response) => {
@@ -214,16 +250,13 @@ export const useAppStore = defineStore("app", () => {
   }
 
   function request({ schema, params }, callbacks = {}) {
-    console.log("[APP] Request:", schema.$id);
-
     const store = useAppStore();
     return api_fetch(
       store,
-      { schema, params, headers: {} },
+      { schema, params },
       {
         ...callbacks,
         response_function: async (response) => {
-          console.log("[APP] Request completed:", schema.$id);
           if (callbacks.response_function) {
             await callbacks.response_function(response);
           }
@@ -239,12 +272,14 @@ export const useAppStore = defineStore("app", () => {
   function stop_request() {
     request_counter.value -= 1;
   }
+  const is_busy = computed(() => request_counter.value > 0);
 
   const projectFolderPath = ref("");
+
   function createProjectFolder() {
     const { PROJECT } = useRuntimeConfig().public;
     const schema = {
-      $id: "/api/local/project_folder_path",
+      $id: "/api/local/app/project_folder_path",
       methods: ["POST"],
       type: "object",
       properties: { PROJECT: { type: "string" } },
@@ -265,6 +300,13 @@ export const useAppStore = defineStore("app", () => {
 
   return {
     stores,
+    default_local_port,
+    request_counter,
+    status,
+    protocol,
+    port,
+    base_url,
+    is_busy,
     registerStore,
     exportStores,
     importStores,
@@ -285,5 +327,8 @@ export const useAppStore = defineStore("app", () => {
     createProjectFolder,
     start_request,
     stop_request,
+    globalComponents,
+    registerGlobalComponent,
+    unregisterGlobalComponent,
   };
 });

package/app/stores/back.js

@@ -1,6 +1,6 @@
+import { getRestApiPort, getRestApiProtocol, isCloudMode } from "@ogw_front/utils/stores";
 import { Status } from "@ogw_front/utils/status";
 import { api_fetch } from "@ogw_internal/utils/api_fetch";
-import { appMode } from "@ogw_front/utils/local/app_mode";
 import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json";
 import { upload_file } from "@ogw_internal/utils/upload_file.js";
 import { useAppStore } from "@ogw_front/stores/app";
@@ -19,24 +19,18 @@ export const useBackStore = defineStore("back", {
   }),
   getters: {
     protocol() {
-      if (useInfraStore().app_mode === appMode.CLOUD) {
-        return "https";
-      }
-      return "http";
+      return getRestApiProtocol();
     },
     port() {
-      if (useInfraStore().app_mode === appMode.CLOUD) {
-        return "443";
-      }
-      return this.default_local_port;
+      return getRestApiPort(this.default_local_port);
     },
     base_url() {
       const infraStore = useInfraStore();
-      let geode_url = `${this.protocol}://${infraStore.domain_name}:${this.port}`;
-      if (infraStore.app_mode === appMode.CLOUD) {
-        geode_url += `/geode`;
+      let back_url = `${this.protocol}://${infraStore.domain_name}:${this.port}`;
+      if (isCloudMode()) {
+        back_url += `/geode`;
       }
-      return geode_url;
+      return back_url;
     },
     is_busy() {
       return this.request_counter > 0;
@@ -81,7 +75,7 @@ export const useBackStore = defineStore("back", {
       const appStore = useAppStore();
       const { COMMAND_BACK, NUXT_ROOT_PATH } = useRuntimeConfig().public;
       const schema = {
-        $id: "/api/local/run_back",
+        $id: "/api/local/app/run_back",
         methods: ["POST"],
         type: "object",
         properties: {
@@ -110,22 +104,12 @@ export const useBackStore = defineStore("back", {
       return Promise.resolve();
     },
     request({ schema, params = {} }, callbacks = {}) {
-      console.log("[GEODE] Request:", schema.$id);
-      const start = Date.now();
-
       return api_fetch(
         this,
         { schema, params, headers: {} },
         {
           ...callbacks,
           response_function: async (response) => {
-            console.log(
-              "[GEODE] Request completed:",
-              schema.$id,
-              "in",
-              (Date.now() - start) / MILLISECONDS_IN_SECOND,
-              "s",
-            );
             if (callbacks.response_function) {
               await callbacks.response_function(response);
             }
@@ -134,17 +118,16 @@ export const useBackStore = defineStore("back", {
       );
     },
     upload(file, callbacks = {}) {
-      const route = back_schemas.opengeodeweb_back.upload_file.$id;
+      const schema = back_schemas.opengeodeweb_back.upload_file;
       return upload_file(
         this,
         {
-          route,
+          schema,
           file,
         },
         {
           ...callbacks,
           response_function: async (response) => {
-            console.log("[GEODE] Request completed:", route);
             if (callbacks.response_function) {
               await callbacks.response_function(response);
             }