From f90536c0d3c4b5d8e907315676f6bc71c73dc9d6 Mon Sep 17 00:00:00 2001
From: Erik Ziegler <erik.sweed@gmail.com>
Date: Fri, 5 Aug 2016 12:26:00 +0200
Subject: [PATCH] Throttle scrolling to prevent requests from firing too
 quickly (OHIF-39)

---
 .../viewer/imageControls/imageControls.js     | 32 ++++++++++++-------
 .../imageViewerViewport.js                    |  3 --
 2 files changed, 21 insertions(+), 14 deletions(-)

diff --git a/Packages/viewerbase/client/components/viewer/imageControls/imageControls.js b/Packages/viewerbase/client/components/viewer/imageControls/imageControls.js
index befc98885..c2237ae8f 100644
--- a/Packages/viewerbase/client/components/viewer/imageControls/imageControls.js
+++ b/Packages/viewerbase/client/components/viewer/imageControls/imageControls.js
@@ -1,14 +1,24 @@
-Template.imageControls.events({
-    'change #imageSlider': function(e) {
-        // Using the slider in an inactive viewport
-        // should cause that viewport to become active
-        var slider = $(e.currentTarget);
-        var newActiveElement = slider.parents().eq(2).siblings('.imageViewerViewport').get(0);
-        setActiveViewport(newActiveElement);
+const slideTimeoutTime = 40;
+let slideTimeout;
 
-        // Subtract 1 here since the slider goes from 1 to N images
-        // But the stack indexing starts at 0
-        var newImageIdIndex = parseInt(slider.val(), 10) - 1;
-        switchToImageByIndex(newImageIdIndex);
+Template.imageControls.events({
+    'input #imageSlider, change #imageSlider': function(e) {
+        // Note that we throttle requests to prevent the
+        // user's ultrafast scrolling from firing requests too quickly.
+        clearTimeout(slideTimeout);
+        slideTimeout = setTimeout(() => {
+            // Using the slider in an inactive viewport
+            // should cause that viewport to become active
+            const slider = $(e.currentTarget);
+            const newActiveElement = slider.parents().eq(2).siblings('.imageViewerViewport').get(0);
+            setActiveViewport(newActiveElement);
+
+            // Subtract 1 here since the slider goes from 1 to N images
+            // But the stack indexing starts at 0
+            const newImageIdIndex = parseInt(slider.val(), 10) - 1;
+            switchToImageByIndex(newImageIdIndex);
+        }, slideTimeoutTime);
+
+        return false;
     }
 });
diff --git a/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js b/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js
index db7d237eb..5949ba016 100644
--- a/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js
+++ b/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js
@@ -564,17 +564,14 @@ Template.imageViewerViewport.onDestroyed(function() {
 
 Template.imageViewerViewport.events({
     'ActivateViewport .imageViewerViewport': function(e) {
-        console.log('activateViewport');
         log.info('imageViewerViewport ActivateViewport');
         setActiveViewport(e.currentTarget);
     },
     'click .imageViewerViewport': function(e) {
-        console.log('click imageViewerViewport handler');
         var viewportIndex = $('.imageViewerViewport').index(e.currentTarget);
         Session.set('activeViewport', viewportIndex);
     },
     'CornerstoneToolsMouseDoubleClick .imageViewerViewport, CornerstoneToolsDoubleTap .imageViewerViewport': function(e) {
-        console.log('CornerstoneToolsMouseDoubleClick handler');
         var viewportIndex = $('.imageViewerViewport').index(e.currentTarget);
         layoutManager.toggleEnlargement(viewportIndex);
     }