From fcdf266d8ef03105ff4052f306a77ebcfafeba53 Mon Sep 17 00:00:00 2001 From: Artur Adib Date: Wed, 11 Jan 2012 16:57:57 -0500 Subject: [PATCH] Lazy textLayer rendering - pauses after scroll ev --- web/viewer.js | 36 +++++++++++++++++++++++++++++++++--- 1 file changed, 33 insertions(+), 3 deletions(-) diff --git a/web/viewer.js b/web/viewer.js index ac3fbff0c..359b9d3da 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -960,9 +960,14 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv) { var self = this; var textDivs = this.textDivs; var textLayerDiv = this.textLayerDiv; - this.textLayerTimer = setInterval(function renderTextLayer() { + var renderTimer = null; + var renderingDone = false; + + // Render the text layer, one div at a time + var renderTextLayer = function textLayerRender() { if (textDivs.length === 0) { - clearInterval(self.textLayerTimer); + clearInterval(renderTimer); + renderingDone = true; return; } var textDiv = textDivs.shift(); @@ -974,7 +979,32 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv) { ((textDiv.dataset.canvasWidth - textDiv.offsetWidth) / (textDiv.dataset.textLength - 1)) + 'px'; } - }, 0); + } + renderTimer = setInterval(renderTextLayer, 0); + + var scrollTimer = null; + if (window.onscroll) + var oldScrollHandler = window.onscroll; + + // Stop rendering when user scrolls. Resume after XXX milliseconds + // of no scroll events + window.onscroll = function textLayerOnScroll() { + if (oldScrollHandler) + oldScrollHandler.apply(window, arguments); + + // This avoids handler wrapper bloat + if (renderingDone) + window.onscroll = oldScrollHandler; + + // Immediately pause rendering + clearInterval(renderTimer); + + clearTimeout(scrollTimer); + scrollTimer = setTimeout(function() { + // Resume rendering + renderTimer = setInterval(renderTextLayer, 0); + }, 500); + } }; this.appendText = function textLayerBuilderAppendText(text,