Sparse state file manifest

.github/workflows/e2e.yml

@@ -10,7 +10,7 @@ jobs:
     name: E2E Testing on ${{ matrix.os }}
     runs-on: ${{ matrix.os }}
     env:
-      DOWNLOAD_TIMEOUT: 220000
+      DOWNLOAD_TIMEOUT: 60000
       VITE_SHOW_SAMPLE_DATA: true
     steps:
       - uses: actions/checkout@v4

src/components/EditableChipList.vue

@@ -39,7 +39,11 @@ const itemsToRender = computed(() =>
     mandatory
   >
     <v-row dense>
-      <v-col cols="6" v-for="({ key, title }, idx) in itemsToRender" :key="key">
+      <v-col
+        cols="12"
+        v-for="({ key, title }, idx) in itemsToRender"
+        :key="key"
+      >
         <v-item v-slot="{ selectedClass, toggle }" :value="key">
           <v-chip
             variant="tonal"
@@ -59,7 +63,7 @@ const itemsToRender = computed(() =>
       </v-col>
 
       <!-- Add Label button -->
-      <v-col cols="6">
+      <v-col cols="12">
         <v-chip variant="outlined" class="w-100" @click="$emit('create')">
           <v-icon class="mr-2">mdi-plus</v-icon>
           {{ createLabelText }}

src/components/ModulePanel.vue

@@ -149,6 +149,7 @@ export default defineComponent({
   position: relative;
   flex: 2;
   overflow: auto;
+  scrollbar-gutter: stable;
 }
 
 .module-text {

src/components/SaveSession.vue

@@ -35,7 +35,7 @@ import { defineComponent, onMounted, ref } from 'vue';
 import { saveAs } from 'file-saver';
 import { onKeyDown } from '@vueuse/core';
 
-import { serialize } from '../io/state-file';
+import { serialize } from '../io/state-file/serialize';
 
 const DEFAULT_FILENAME = 'session.volview.zip';
 

src/components/tools/ScalarProbe.vue

@@ -1,7 +1,9 @@
 <script setup lang="ts">
 import { inject, watch, computed, toRefs } from 'vue';
 import type { ReadonlyVec3 } from 'gl-matrix';
+import { vec3 } from 'gl-matrix';
 import { onVTKEvent } from '@/src/composables/onVTKEvent';
+import { worldPointToIndex } from '@/src/utils/imageSpace';
 import { VtkViewContext } from '@/src/components/vtk/context';
 import { useCurrentImage } from '@/src/composables/useCurrentImage';
 import vtkPointPicker from '@kitware/vtk.js/Rendering/Core/PointPicker';
@@ -110,29 +112,54 @@ const getImageSamples = (x: number, y: number) => {
   pointPicker.pick([x, y, 1.0], view.renderer);
   if (pointPicker.getActors().length === 0) return undefined;
 
-  const ijk = pointPicker.getPointIJK() as unknown as ReadonlyVec3;
-  const samples = sampleSet.value.map((item: any) => {
-    const dims = item.image.getDimensions();
-    const scalarData = item.image.getPointData().getScalars();
-    const index = dims[0] * dims[1] * ijk[2] + dims[0] * ijk[1] + ijk[0];
-    const scalars = scalarData.getTuple(index) as number[];
-    const baseInfo = { id: item.id, name: item.name };
-
-    if (item.type === 'segmentGroup') {
-      return {
-        ...baseInfo,
-        displayValues: scalars.map(
-          (v) => item.segments.byValue[v]?.name || 'Background'
-        ),
-      };
-    }
-    return { ...baseInfo, displayValues: scalars };
-  });
-
-  const position = firstToSample.image.indexToWorld(ijk);
+  // Get world position from the picked point
+  const pickedIjk = pointPicker.getPointIJK() as unknown as ReadonlyVec3;
+  const worldPosition = vec3.clone(
+    firstToSample.image.indexToWorld(pickedIjk) as vec3
+  );
+
+  const samples = sampleSet.value
+    .map((item: any) => {
+      // Convert world position to this specific image's IJK
+      const itemIjk = worldPointToIndex(item.image, worldPosition);
+      const dims = item.image.getDimensions();
+      const scalarData = item.image.getPointData().getScalars();
+
+      // Round to nearest integer indices
+      const i = Math.round(itemIjk[0]);
+      const j = Math.round(itemIjk[1]);
+      const k = Math.round(itemIjk[2]);
+
+      // Check bounds
+      if (
+        i < 0 ||
+        j < 0 ||
+        k < 0 ||
+        i >= dims[0] ||
+        j >= dims[1] ||
+        k >= dims[2]
+      ) {
+        return null;
+      }
+
+      const index = dims[0] * dims[1] * k + dims[0] * j + i;
+      const scalars = scalarData.getTuple(index) as number[];
+      const baseInfo = { id: item.id, name: item.name };
+
+      if (item.type === 'segmentGroup') {
+        return {
+          ...baseInfo,
+          displayValues: scalars.map(
+            (v) => item.segments.byValue[v]?.name || 'Background'
+          ),
+        };
+      }
+      return { ...baseInfo, displayValues: scalars };
+    })
+    .filter((s): s is NonNullable<typeof s> => s !== null);
 
   return {
-    pos: position,
+    pos: worldPosition,
     samples,
   };
 };

src/components/tools/paint/PaintWidget2D.vue

@@ -16,8 +16,10 @@ import { getLPSAxisFromDir } from '@/src/utils/lps';
 import { useImage } from '@/src/composables/useCurrentImage';
 import { updatePlaneManipulatorFor2DView } from '@/src/utils/manipulators';
 import { usePaintToolStore } from '@/src/store/tools/paint';
+import { useSegmentGroupStore } from '@/src/store/segmentGroups';
 import { vtkPaintViewWidget } from '@/src/vtk/PaintWidget';
 import { LPSAxisDir } from '@/src/types/lps';
+import { getLPSDirections } from '@/src/utils/lps';
 import { onVTKEvent } from '@/src/composables/onVTKEvent';
 import { useSliceInfo } from '@/src/composables/useSliceInfo';
 import { VtkViewContext } from '@/src/components/vtk/context';
@@ -48,6 +50,7 @@ export default defineComponent({
     const slice = computed(() => sliceInfo.value?.slice);
 
     const paintStore = usePaintToolStore();
+    const segmentGroupStore = useSegmentGroupStore();
     const widgetFactory = paintStore.getWidgetFactory();
     const widgetState = widgetFactory.getWidgetState();
 
@@ -57,32 +60,34 @@ export default defineComponent({
       () => imageMetadata.value.lpsOrientation[viewAxis.value]
     );
 
-    const worldPointToIndex = (worldPoint: vec3) => {
-      const { worldToIndex } = imageMetadata.value;
-      const indexPoint = vec3.create();
-      vec3.transformMat4(indexPoint, worldPoint, worldToIndex);
-      return indexPoint;
-    };
+    // Get the active labelmap for coordinate transforms
+    const activeLabelmap = computed(() => {
+      const groupId = paintStore.activeSegmentGroupID;
+      if (!groupId) return null;
+      return segmentGroupStore.dataIndex[groupId] ?? null;
+    });
 
     const widget = view.widgetManager.addWidget(
       widgetFactory
     ) as vtkPaintViewWidget;
 
-    onMounted(() => {
-      view.widgetManager.renderWidgets();
-      view.widgetManager.grabFocus(widget);
-    });
-
-    onUnmounted(() => {
-      view.widgetManager.removeWidget(widgetFactory);
-    });
-
     // --- widget representation config --- //
 
     watchEffect(() => {
-      const metadata = imageMetadata.value;
-      const slicingIndex = metadata.lpsOrientation[viewAxis.value];
-      if (widget) {
+      if (!widget) return;
+
+      const labelmap = activeLabelmap.value;
+      if (labelmap) {
+        // Use labelmap's transforms so brush preview matches where paint appears
+        const labelmapLps = getLPSDirections(labelmap.getDirection());
+        const slicingIndex = labelmapLps[viewAxis.value];
+        widget.setSlicingIndex(slicingIndex);
+        widget.setIndexToWorld(labelmap.getIndexToWorld());
+        widget.setWorldToIndex(labelmap.getWorldToIndex());
+      } else {
+        // Fall back to parent image transforms
+        const metadata = imageMetadata.value;
+        const slicingIndex = metadata.lpsOrientation[viewAxis.value];
         widget.setSlicingIndex(slicingIndex);
         widget.setIndexToWorld(metadata.indexToWorld);
         widget.setWorldToIndex(metadata.worldToIndex);
@@ -95,17 +100,19 @@ export default defineComponent({
       if (!imageId.value) return;
       paintStore.setSliceAxis(viewAxisIndex.value, imageId.value);
       const origin = widgetState.getBrush().getOrigin()!;
-      const indexPoint = worldPointToIndex(origin);
-      paintStore.startStroke(indexPoint, viewAxisIndex.value, imageId.value);
+      paintStore.startStroke(
+        vec3.clone(origin),
+        viewAxisIndex.value,
+        imageId.value
+      );
       paintStore.updatePaintPosition(origin, viewId.value);
     });
 
     onVTKEvent(widget, 'onInteractionEvent', () => {
       if (!imageId.value) return;
       const origin = widgetState.getBrush().getOrigin()!;
-      const indexPoint = worldPointToIndex(origin);
       paintStore.placeStrokePoint(
-        indexPoint,
+        vec3.clone(origin),
         viewAxisIndex.value,
         imageId.value
       );
@@ -114,8 +121,11 @@ export default defineComponent({
 
     onVTKEvent(widget, 'onEndInteractionEvent', () => {
       if (!imageId.value) return;
-      const indexPoint = worldPointToIndex(widgetState.getBrush().getOrigin()!);
-      paintStore.endStroke(indexPoint, viewAxisIndex.value, imageId.value);
+      paintStore.endStroke(
+        vec3.clone(widgetState.getBrush().getOrigin()!),
+        viewAxisIndex.value,
+        imageId.value
+      );
     });
 
     // --- manipulator --- //
@@ -137,19 +147,10 @@ export default defineComponent({
 
     let checkIfPointerInView = false;
 
-    onMounted(() => {
-      widget.setVisibility(false);
-      checkIfPointerInView = true;
-    });
-
-    // Turn on widget visibility and update stencil
-    // if mouse starts within view
+    // Turn on widget visibility and update stencil if mouse starts within view
     onVTKEvent(view.interactor, 'onMouseMove', () => {
-      if (!checkIfPointerInView) {
-        return;
-      }
+      if (!checkIfPointerInView) return;
       checkIfPointerInView = false;
-
       widget.setVisibility(true);
       if (imageId.value) {
         paintStore.setSliceAxis(viewAxisIndex.value, imageId.value);
@@ -186,12 +187,17 @@ export default defineComponent({
     };
 
     onMounted(() => {
+      view.widgetManager.renderWidgets();
+      view.widgetManager.grabFocus(widget);
+      widget.setVisibility(false);
+      checkIfPointerInView = true;
       view.renderWindowView
         .getContainer()
         ?.addEventListener('wheel', handleWheelEvent, { passive: false });
     });
 
     onUnmounted(() => {
+      view.widgetManager.removeWidget(widgetFactory);
       view.renderWindowView
         .getContainer()
         ?.removeEventListener('wheel', handleWheelEvent);

src/components/tools/polygon/PolygonTool.vue

@@ -110,6 +110,8 @@ import type { IGrid2D } from '@thi.ng/api';
 import vtkImageData from '@kitware/vtk.js/Common/DataModel/ImageData';
 import type { Vector2, Vector3 } from '@kitware/vtk.js/types';
 import { containsPoint } from '@kitware/vtk.js/Common/DataModel/BoundingBox';
+import { convertSliceIndex } from '@/src/utils/imageSpace';
+import { getLPSDirections } from '@/src/utils/lps';
 import { type ToolID } from '@/src/types/annotation-tool';
 import PolygonWidget2D from '@/src/components/tools/polygon/PolygonWidget2D.vue';
 import { usePaintToolStore } from '@/src/store/tools/paint';
@@ -177,7 +179,6 @@ export default defineComponent({
 
     const sliceInfo = useSliceInfo(viewId, imageId);
     const slice = computed(() => sliceInfo.value?.slice ?? 0);
-    const sliceAxis = computed(() => sliceInfo.value?.axisIndex ?? 0);
 
     const { metadata: imageMetadata } = useImage(imageId);
     const isToolActive = computed(() => toolStore.currentTool === toolType);
@@ -279,25 +280,41 @@ export default defineComponent({
         paintStore.setActiveSegment(segment.value);
       }
 
-      const image = segmentGroupStore.dataIndex[segmentGroupID];
-      if (!image) {
+      const segmentGroup = segmentGroupStore.dataIndex[segmentGroupID];
+      if (!segmentGroup) {
         throw new Error(
-          `Failed to get labelmap for segment group ${segmentGroupID}`
+          `Failed to get segment group data for ${segmentGroupID}`
         );
       }
 
+      // Convert parent slice index to segment group slice index
+      const parentMeta = imageMetadata.value;
+      const segmentGroupSlice = convertSliceIndex(
+        slice.value,
+        parentMeta.lpsOrientation,
+        parentMeta.indexToWorld,
+        segmentGroup,
+        viewAxis.value
+      );
+
       const points = activeToolStore.getPoints(toolId);
-      const axis = sliceAxis.value;
+      const segmentGroupIjkIndex = getLPSDirections(
+        segmentGroup.getDirection()
+      )[viewAxis.value];
 
       const indexSpacePoints2D = points.map((pt) => {
-        const output = [...image.worldToIndex(pt)];
-        output.splice(axis, 1);
+        const output = [...segmentGroup.worldToIndex(pt)];
+        output.splice(segmentGroupIjkIndex, 1);
         return output as Vector2;
       });
 
-      const grid = createGridAccessor(image, slice.value, axis);
+      const grid = createGridAccessor(
+        segmentGroup,
+        segmentGroupSlice,
+        segmentGroupIjkIndex
+      );
       fillPoly(grid, indexSpacePoints2D, segment.value);
-      image.modified();
+      segmentGroup.modified();
     }
 
     return {