diff --git a/web/ui_utils.js b/web/ui_utils.js index b7c52ab226b33..38dc6feccbfd3 100644 --- a/web/ui_utils.js +++ b/web/ui_utils.js @@ -117,43 +117,40 @@ function scrollIntoView(element, spot) { * PDF.js friendly one: with scroll debounce and scroll direction. */ function watchScroll(viewAreaElement, callback, abortSignal = undefined) { - const debounceScroll = function (evt) { - if (rAF) { - return; + function onRAF() { + rAF = null; + + const currentX = viewAreaElement.scrollLeft; + const lastX = state.lastX; + if (currentX !== lastX) { + state.right = currentX > lastX; } - // schedule an invocation of scroll for next animation frame. - rAF = window.requestAnimationFrame(function viewAreaElementScrolled() { - rAF = null; - - const currentX = viewAreaElement.scrollLeft; - const lastX = state.lastX; - if (currentX !== lastX) { - state.right = currentX > lastX; - } - state.lastX = currentX; - const currentY = viewAreaElement.scrollTop; - const lastY = state.lastY; - if (currentY !== lastY) { - state.down = currentY > lastY; - } - state.lastY = currentY; - callback(state); - }); - }; + state.lastX = currentX; + const currentY = viewAreaElement.scrollTop; + const lastY = state.lastY; + if (currentY !== lastY) { + state.down = currentY > lastY; + } + state.lastY = currentY; + callback(state); + } const state = { right: true, down: true, lastX: viewAreaElement.scrollLeft, lastY: viewAreaElement.scrollTop, - _eventHandler: debounceScroll, }; let rAF = null; - viewAreaElement.addEventListener("scroll", debounceScroll, { - useCapture: true, - signal: abortSignal, - }); + viewAreaElement.addEventListener( + "scroll", + () => { + // Schedule an invocation of scroll for next animation frame, when needed. + rAF ??= window.requestAnimationFrame(onRAF); + }, + { useCapture: true, signal: abortSignal } + ); abortSignal?.addEventListener( "abort", () => window.cancelAnimationFrame(rAF),