fix(handleWheel): mouse scrolling behavior for out-of-focus windows

When rebinding events with a different container, make sure all timeouts and state variables from previous containter are cleared.
Kitware · Jan 23, 2024 · cd5c980 · cd5c980
1 parent 4945167
commit cd5c980
Showing 1 changed file with 41 additions and 16 deletions.
diff --git a/Sources/Rendering/Core/RenderWindowInteractor/index.js b/Sources/Rendering/Core/RenderWindowInteractor/index.js
@@ -216,7 +216,9 @@ function vtkRenderWindowInteractor(publicAPI, model) {
   }
 
   publicAPI.bindEvents = (container) => {
+    publicAPI.unbindEvents();
     model.container = container;
+
     container.addEventListener('contextmenu', preventDefault);
     container.addEventListener('wheel', publicAPI.handleWheel);
     container.addEventListener('DOMMouseScroll', publicAPI.handleWheel);
@@ -248,23 +250,46 @@ function vtkRenderWindowInteractor(publicAPI, model) {
   };
 
   publicAPI.unbindEvents = () => {
+    // Clear any previous timeouts and state variables that control mouse / touchpad behavior.
+    clearTimeout(model.moveTimeoutID);
+    clearTimeout(model.wheelTimeoutID);
+    model.moveTimeoutID = 0;
+    model.wheelTimeoutID = 0;
+    wheelCoefficient = 1.0;
+
     const { container } = model;
-    container.removeEventListener('contextmenu', preventDefault);
-    container.removeEventListener('wheel', publicAPI.handleWheel);
-    container.removeEventListener('DOMMouseScroll', publicAPI.handleWheel);
-    container.removeEventListener('pointerenter', publicAPI.handlePointerEnter);
-    container.removeEventListener('pointerleave', publicAPI.handlePointerLeave);
-    container.removeEventListener('pointermove', publicAPI.handlePointerMove, {
-      passive: false,
-    });
-    container.removeEventListener('pointerdown', publicAPI.handlePointerDown, {
-      passive: false,
-    });
-    container.removeEventListener('pointerup', publicAPI.handlePointerUp);
-    container.removeEventListener(
-      'pointercancel',
-      publicAPI.handlePointerCancel
-    );
+    if (container) {
+      container.removeEventListener('contextmenu', preventDefault);
+      container.removeEventListener('wheel', publicAPI.handleWheel);
+      container.removeEventListener('DOMMouseScroll', publicAPI.handleWheel);
+      container.removeEventListener(
+        'pointerenter',
+        publicAPI.handlePointerEnter
+      );
+      container.removeEventListener(
+        'pointerleave',
+        publicAPI.handlePointerLeave
+      );
+      container.removeEventListener(
+        'pointermove',
+        publicAPI.handlePointerMove,
+        {
+          passive: false,
+        }
+      );
+      container.removeEventListener(
+        'pointerdown',
+        publicAPI.handlePointerDown,
+        {
+          passive: false,
+        }
+      );
+      container.removeEventListener('pointerup', publicAPI.handlePointerUp);
+      container.removeEventListener(
+        'pointercancel',
+        publicAPI.handlePointerCancel
+      );
+    }
     document.removeEventListener('keypress', publicAPI.handleKeyPress);
     document.removeEventListener('keydown', publicAPI.handleKeyDown);
     document.removeEventListener('keyup', publicAPI.handleKeyUp);