refactor(GatedMouseRangeManipulator): simplify initialization

Author: PaulHax

src/components/vtk/VtkSliceViewSlicingKeyManipulator.vue

@@ -10,7 +10,7 @@ import vtkGatedMouseRangeManipulator from '@/src/vtk/GatedMouseRangeManipulator'
 import { IMouseRangeManipulatorInitialValues } from '@kitware/vtk.js/Interaction/Manipulators/MouseRangeManipulator';
 import vtkInteractorStyleManipulator from '@kitware/vtk.js/Interaction/Style/InteractorStyleManipulator';
 import { syncRef, useMagicKeys } from '@vueuse/core';
-import { inject, toRefs, unref, watch, computed, watchPostEffect } from 'vue';
+import { inject, toRefs, unref, watch, computed } from 'vue';
 import { useViewStore } from '@/src/store/views';
 import { actionToKey } from '@/src/composables/useKeyboardShortcuts';
 
@@ -48,15 +48,7 @@ const { instance: rangeManipulator } = useVtkInteractionManipulator(
   config
 );
 
-// run after useWebGLRenderWindow assigns the container
-watchPostEffect(() => {
-  const container = view.renderWindowView.getContainer();
-  rangeManipulator.value.initializeGlobalMouseMove(
-    view.renderWindow.getInteractor(),
-    view.renderer,
-    container
-  );
-});
+rangeManipulator.value.setupMouseMove(view.interactor);
 
 const keys = useMagicKeys();
 const enableGrabSlice = computed(() => keys[actionToKey.value.grabSlice].value);
@@ -79,14 +71,15 @@ const scroll = useMouseRangeManipulatorListener(
   sliceConfig.slice.value
 );
 
+syncRef(scroll, sliceConfig.slice, { immediate: true });
+
+// set just scrolled view as active view
 watch(scroll, () => {
   const viewStore = useViewStore();
   if (unref(viewId) !== viewStore.activeViewID) {
     viewStore.setActiveViewID(unref(viewId));
   }
 });
-
-syncRef(scroll, sliceConfig.slice, { immediate: true });
 </script>
 
 <template><slot></slot></template>

src/vtk/GatedMouseRangeManipulator/index.js

@@ -25,50 +25,27 @@ function vtkGatedMouseRangeManipulator(publicAPI, model) {
     publicAPI.modified();
   };
 
-  // Define the mouse move listener function outside initializeGlobalMouseMove
-  const createMouseMoveListener = (interactor, renderer) => {
-    return (event) => {
-      // Proceed if the mouse is inside the container.
-      if (!model.viewContainer.contains(event.target)) {
-        return;
-      }
-      // Map the event client coordinates to the container's coordinate system.
-      const rect = model.viewContainer.getBoundingClientRect();
-      const position = {
-        x: event.clientX - rect.left,
-        y: event.clientY - rect.top,
-      };
+  const cleanupListener = () => {
+    model.mouseMoveListenerSubscription?.unsubscribe();
+    model.mouseMoveListenerSubscription = null;
+  };
 
+  publicAPI.setupMouseMove = (interactor) => {
+    cleanupListener();
+    model.mouseMoveListenerSubscription = interactor.onMouseMove((event) => {
+      const invertY = {
+        ...event.position,
+        y: interactor.getView().getSize()[1] - event.position.y,
+      };
       if (model.newInteraction) {
         model.newInteraction = false;
-        publicAPI.onButtonDown(interactor, renderer, position);
+        publicAPI.onButtonDown(interactor, event.pokedRenderer, invertY);
       }
-      publicAPI.onMouseMove(interactor, renderer, position);
-    };
+      publicAPI.onMouseMove(interactor, event.pokedRenderer, invertY);
+    });
   };
 
-  // Initializes a global mousemove listener on the view container.
-  // Only events occurring over the container will trigger onMouseMove.
-  publicAPI.initializeGlobalMouseMove = (interactor, renderer, container) => {
-    model.viewContainer = container;
-    if (!model.mouseMoveListener) {
-      model.mouseMoveListener = createMouseMoveListener(interactor, renderer);
-      model.viewContainer.addEventListener(
-        'mousemove',
-        model.mouseMoveListener
-      );
-    }
-  };
-
-  publicAPI.delete = macro.chain(publicAPI.delete, () => {
-    if (model.mouseMoveListener && model.viewContainer) {
-      model.viewContainer.removeEventListener(
-        'mousemove',
-        model.mouseMoveListener
-      );
-      model.mouseMoveListener = null;
-    }
-  });
+  publicAPI.delete = macro.chain(publicAPI.delete, cleanupListener);
 }
 
 function extend(publicAPI, model, initialValues = {}) {