From cd5c980973fb99bd95f16f7e7152a1369a2cf9a5 Mon Sep 17 00:00:00 2001
From: Shreeraj Jadhav <shreerajjadhav@gmail.com>
Date: Fri, 19 Jan 2024 17:29:54 -0500
Subject: [PATCH] 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.
---
 .../Core/RenderWindowInteractor/index.js      | 57 +++++++++++++------
 1 file changed, 41 insertions(+), 16 deletions(-)

diff --git a/Sources/Rendering/Core/RenderWindowInteractor/index.js b/Sources/Rendering/Core/RenderWindowInteractor/index.js
index 50979535a73..90beff0d136 100644
--- 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);