Neuroglancer Precomputed Mesh (#8236)

Co-authored-by: Philipp Otto <[email protected]>

Author: frcroth

CHANGELOG.unreleased.md

@@ -11,6 +11,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.released
 [Commits](https://github.com/scalableminds/webknossos/compare/25.05.0...HEAD)
 
 ### Added
+- Meshes of Neuroglancer Precomputed Datasets can now be viewed. [#8236](https://github.com/scalableminds/webknossos/pull/8236)
 - Added the possibility to join an organization without requiring a paid user slot in case an organization already pays for the same user. Such a user is called a "Guest User". [#8502](https://github.com/scalableminds/webknossos/pull/8502)
 
 ### Changed

frontend/javascripts/admin/api/mesh.ts

@@ -1,5 +1,5 @@
 import Request from "libs/request";
-import type { APIDataSourceId } from "types/api_types";
+import type { APIDataSourceId, APIMeshFileInfo } from "types/api_types";
 import type { Vector3, Vector4 } from "viewer/constants";
 import { doWithToken } from "./token";
 
@@ -10,30 +10,27 @@ export type MeshChunk = {
   unmappedSegmentId: number;
 };
 
-type MeshLodInfo = {
-  scale: number;
-  vertexOffset: Vector3;
-  chunkShape: Vector3;
+export type MeshLodInfo = {
   chunks: Array<MeshChunk>;
+  transform: [Vector4, Vector4, Vector4]; // 4x3 matrix
 };
 
 type MeshSegmentInfo = {
-  chunkShape: Vector3; // unused
-  gridOrigin: Vector3; // unused
+  meshFormat: "draco";
   lods: Array<MeshLodInfo>;
+  chunkScale: Vector3;
 };
 
-type SegmentInfo = {
-  transform: [Vector4, Vector4, Vector4]; // 4x3 matrix
-  meshFormat: "draco";
-  chunks: MeshSegmentInfo;
+type ListMeshChunksRequest = {
+  meshFile: APIMeshFileInfo;
+  segmentId: number;
 };
 
 export function getMeshfileChunksForSegment(
   dataStoreUrl: string,
   dataSourceId: APIDataSourceId,
   layerName: string,
-  meshFile: string,
+  meshFile: APIMeshFileInfo,
   segmentId: number,
   // targetMappingName is the on-disk mapping name.
   // In case of an editable mapping, this should still be the on-disk base
@@ -44,7 +41,7 @@ export function getMeshfileChunksForSegment(
   // editableMappingTracingId should be the tracing id, not the editable mapping id.
   // If this is set, it is assumed that the request is about an editable mapping.
   editableMappingTracingId: string | null | undefined,
-): Promise<SegmentInfo> {
+): Promise<MeshSegmentInfo> {
   return doWithToken((token) => {
     const params = new URLSearchParams();
     params.append("token", token);
@@ -54,13 +51,14 @@ export function getMeshfileChunksForSegment(
     if (editableMappingTracingId != null) {
       params.append("editableMappingTracingId", editableMappingTracingId);
     }
+    const payload: ListMeshChunksRequest = {
+      meshFile,
+      segmentId,
+    };
     return Request.sendJSONReceiveJSON(
       `${dataStoreUrl}/data/datasets/${dataSourceId.owningOrganization}/${dataSourceId.directoryName}/layers/${layerName}/meshes/chunks?${params}`,
       {
-        data: {
-          meshFile,
-          segmentId,
-        },
+        data: payload,
         showErrorToast: false,
       },
     );
@@ -70,10 +68,11 @@ export function getMeshfileChunksForSegment(
 type MeshChunkDataRequest = {
   byteOffset: number;
   byteSize: number;
+  segmentId: number | null; // Only relevant for neuroglancer precomputed meshes
 };
 
 type MeshChunkDataRequestList = {
-  meshFile: string;
+  meshFile: APIMeshFileInfo;
   requests: MeshChunkDataRequest[];
 };
 

frontend/javascripts/admin/rest_api.ts

@@ -28,7 +28,7 @@ import {
   type APIMagRestrictions,
   type APIMapping,
   type APIMaybeUnimportedDataset,
-  type APIMeshFile,
+  type APIMeshFileInfo,
   type APIOrganization,
   type APIOrganizationCompact,
   type APIPricingPlanStatus,
@@ -2034,8 +2034,8 @@ export async function getMeshfilesForDatasetLayer(
   dataStoreUrl: string,
   dataSourceId: APIDataSourceId,
   layerName: string,
-): Promise<Array<APIMeshFile>> {
-  const meshFiles: Array<APIMeshFile> = await doWithToken((token) =>
+): Promise<Array<APIMeshFileInfo>> {
+  const meshFiles: Array<APIMeshFileInfo> = await doWithToken((token) =>
     Request.receiveJSON(
       `${dataStoreUrl}/data/datasets/${dataSourceId.owningOrganization}/${dataSourceId.directoryName}/layers/${layerName}/meshes?token=${token}`,
     ),

frontend/javascripts/types/api_types.ts

@@ -941,8 +941,10 @@ export type ServerEditableMapping = {
   tracingId: string;
 };
 
-export type APIMeshFile = {
-  meshFileName: string;
+export type APIMeshFileInfo = {
+  name: string;
+  path: string | null | undefined;
+  fileType: string | null | undefined;
   mappingName?: string | null | undefined;
   // 0   - is the first mesh file version
   // 1-2 - the format should behave as v0 (refer to voxelytics for actual differences)

frontend/javascripts/viewer/api/api_latest.ts

@@ -2300,7 +2300,7 @@ class DataApi {
       true,
       false,
     );
-    return meshFiles.map((meshFile) => meshFile.meshFileName);
+    return meshFiles.map((meshFile) => meshFile.name);
   }
 
   /**
@@ -2318,7 +2318,7 @@ class DataApi {
     }
 
     const { currentMeshFile } = Store.getState().localSegmentationData[effectiveLayer.name];
-    return currentMeshFile != null ? currentMeshFile.meshFileName : null;
+    return currentMeshFile != null ? currentMeshFile.name : null;
   }
 
   /**
@@ -2351,7 +2351,7 @@ class DataApi {
     if (
       state.localSegmentationData[effectiveLayerName].availableMeshFiles == null ||
       !state.localSegmentationData[effectiveLayerName].availableMeshFiles.find(
-        (el) => el.meshFileName === meshFileName,
+        (el) => el.name === meshFileName,
       )
     ) {
       throw new Error(
@@ -2403,7 +2403,7 @@ class DataApi {
       throw new Error("No segmentation layer was found.");
     }
 
-    const { mappingName, meshFileName } = currentMeshFile;
+    const { mappingName, name: meshFileName } = currentMeshFile;
 
     if (mappingName != null) {
       const activeMapping = this.getActiveMapping(effectiveLayerName);

frontend/javascripts/viewer/controller/url_manager.ts

@@ -313,7 +313,7 @@ class UrlManager {
 
     for (const layerName of Object.keys(state.localSegmentationData)) {
       const { currentMeshFile } = state.localSegmentationData[layerName];
-      const currentMeshFileName = currentMeshFile?.meshFileName;
+      const currentMeshFileName = currentMeshFile?.name;
       const localMeshes = getMeshesForCurrentAdditionalCoordinates(state, layerName);
       const meshes =
         localMeshes != null

frontend/javascripts/viewer/model/actions/annotation_actions.ts

@@ -6,7 +6,7 @@ import type {
   APIAnnotationVisibility,
   APIDataLayer,
   APIDataset,
-  APIMeshFile,
+  APIMeshFileInfo,
   APIUserCompact,
   EditableLayerProperties,
 } from "types/api_types";
@@ -245,7 +245,7 @@ export const maybeFetchMeshFilesAction = (
   dataset: APIDataset,
   mustRequest: boolean,
   autoActivate: boolean = true,
-  callback: (meshes: Array<APIMeshFile>) => void = _.noop,
+  callback: (meshes: Array<APIMeshFileInfo>) => void = _.noop,
 ) =>
   ({
     type: "MAYBE_FETCH_MESH_FILES",
@@ -302,7 +302,7 @@ export const finishedLoadingMeshAction = (layerName: string, segmentId: number)
     segmentId,
   }) as const;
 
-export const updateMeshFileListAction = (layerName: string, meshFiles: Array<APIMeshFile>) =>
+export const updateMeshFileListAction = (layerName: string, meshFiles: Array<APIMeshFileInfo>) =>
   ({
     type: "UPDATE_MESH_FILE_LIST",
     layerName,
@@ -374,8 +374,8 @@ export const dispatchMaybeFetchMeshFilesAsync = async (
   dataset: APIDataset,
   mustRequest: boolean,
   autoActivate: boolean = true,
-): Promise<Array<APIMeshFile>> => {
-  const readyDeferred = new Deferred<APIMeshFile[], unknown>();
+): Promise<Array<APIMeshFileInfo>> => {
+  const readyDeferred = new Deferred<APIMeshFileInfo[], unknown>();
   const action = maybeFetchMeshFilesAction(
     segmentationLayer,
     dataset,

frontend/javascripts/viewer/model/reducers/annotation_reducer.ts

@@ -491,7 +491,7 @@ function AnnotationReducer(state: WebknossosState, action: Action): WebknossosSt
       const { layerName, meshFileName } = action;
       const availableMeshFiles = state.localSegmentationData[layerName].availableMeshFiles;
       if (availableMeshFiles == null) return state;
-      const meshFile = availableMeshFiles.find((el) => el.meshFileName === meshFileName);
+      const meshFile = availableMeshFiles.find((el) => el.name === meshFileName);
       return updateKey2(state, "localSegmentationData", layerName, {
         currentMeshFile: meshFile,
       });