From 52150da02c8bdc5bb354bad64511d1b7821acf19 Mon Sep 17 00:00:00 2001
From: Paul Elliott <paul@vizworkshop.com>
Date: Thu, 6 Nov 2025 08:40:32 -0500
Subject: [PATCH] fix: reverse slice slider and scroll direction for anatomical
 consistency

Scrolling down now decreases slice number and moves anatomically down.
The slider handle position now corresponds to anatomical position where
lower slice numbers appear at the bottom.
---
 src/components/SliceSlider.vue                        | 7 +++++--
 src/components/vtk/VtkSliceViewSlicingManipulator.vue | 3 ++-
 src/core/vtk/useMouseRangeManipulatorListener.ts      | 6 ++++--
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/SliceSlider.vue b/src/components/SliceSlider.vue
index 7708633a5..456d40f9c 100644
--- a/src/components/SliceSlider.vue
+++ b/src/components/SliceSlider.vue
@@ -72,7 +72,9 @@ export default {
   computed: {
     handlePosition() {
       const range = this.max - this.min <= 0 ? 1 : this.max - this.min;
-      const pos = this.maxHandlePos * ((this.modelValue - this.min) / range);
+      // Invert mapping: lower slice numbers at bottom for anatomical consistency
+      const pos =
+        this.maxHandlePos * (1 - (this.modelValue - this.min) / range);
       return this.dragging ? this.draggingHandlePos : pos;
     },
     draggingHandlePos() {
@@ -148,7 +150,8 @@ export default {
     },
 
     getNearestSlice(pos) {
-      const sliceEstimate = pos / this.maxHandlePos;
+      // Invert position: bottom of slider = lower slice numbers
+      const sliceEstimate = 1 - pos / this.maxHandlePos;
       const frac = sliceEstimate * (this.max - this.min) + this.min;
       return Math.round(frac / this.step) * this.step;
     },
diff --git a/src/components/vtk/VtkSliceViewSlicingManipulator.vue b/src/components/vtk/VtkSliceViewSlicingManipulator.vue
index 1725b9426..a7f92f089 100644
--- a/src/components/vtk/VtkSliceViewSlicingManipulator.vue
+++ b/src/components/vtk/VtkSliceViewSlicingManipulator.vue
@@ -54,7 +54,8 @@ const scroll = useMouseRangeManipulatorListener(
   'scroll',
   sliceConfig.range,
   1,
-  sliceConfig.slice.value
+  sliceConfig.slice.value,
+  -1 // Invert scroll: scroll down = decrease slice for anatomical consistency
 );
 
 watch(scroll, () => {
diff --git a/src/core/vtk/useMouseRangeManipulatorListener.ts b/src/core/vtk/useMouseRangeManipulatorListener.ts
index 439fd1672..fa5c39cce 100644
--- a/src/core/vtk/useMouseRangeManipulatorListener.ts
+++ b/src/core/vtk/useMouseRangeManipulatorListener.ts
@@ -14,7 +14,8 @@ export function useMouseRangeManipulatorListener(
   type: ListenerType,
   range: MaybeRef<Maybe<[number, number]>>,
   step: MaybeRef<Maybe<number>>,
-  initialValue?: number
+  initialValue?: number,
+  scale: number = 1 // Negative scale inverts scroll direction
 ) {
   const internalValue = ref(initialValue ?? 0);
 
@@ -37,7 +38,8 @@ export function useMouseRangeManipulatorListener(
         () => internalValue.value,
         (val) => {
           internalValue.value = val;
-        }
+        },
+        scale
       );
 
       onCleanup(() => {