diff --git a/src/views/common/DocumentSearch.vue b/src/views/common/DocumentSearch.vue index 4af1afe..b5db855 100644 --- a/src/views/common/DocumentSearch.vue +++ b/src/views/common/DocumentSearch.vue @@ -61,7 +61,7 @@ if (resolvedWorkerSrc) { pdfjsLib.GlobalWorkerOptions.workerSrc = null } -const DEFAULT_SCALE = 1 +const DEFAULT_SCALE = 0.95 export default { name: 'DocumentSearch', @@ -224,28 +224,44 @@ export default { } await page.render(renderContext).promise - const textLayerDiv = document.createElement('div') - textLayerDiv.className = 'textLayer' - textLayerDiv.style.width = `${viewport.width}px` - textLayerDiv.style.height = `${viewport.height}px` - container.appendChild(textLayerDiv) + this.pageTextDivs[index] = [] - const textLayer = new TextLayerBuilder({ - textLayerDiv, - pageIndex: index, - viewport, - eventBus: this.eventBus, - }) + const scheduleTextLayer = () => { + const textLayerDiv = document.createElement('div') + textLayerDiv.className = 'textLayer' + textLayerDiv.style.width = `${viewport.width}px` + textLayerDiv.style.height = `${viewport.height}px` + container.appendChild(textLayerDiv) - const textContent = await page.getTextContent() - textLayer.setTextContent(textContent) - textLayer.render() + const textLayer = new TextLayerBuilder({ + textLayerDiv, + pageIndex: index, + viewport, + eventBus: this.eventBus, + }) + + page.getTextContent() + .then((textContent) => { + textLayer.setTextContent(textContent) + textLayer.render() + + const textDivs = [...textLayer.textDivs] + textDivs.forEach((div) => { + div.dataset.originalText = div.textContent + }) + this.pageTextDivs[index] = textDivs + }) + .catch((err) => { + console.warn(`获取第 ${pageNumber} 页文本失败`, err) + }) + } + + if (typeof window.requestIdleCallback === 'function') { + window.requestIdleCallback(scheduleTextLayer, { timeout: 500 }) + } else { + setTimeout(scheduleTextLayer, 40) + } - const textDivs = [...textLayer.textDivs] - textDivs.forEach((div) => { - div.dataset.originalText = div.textContent - }) - this.pageTextDivs[index] = textDivs this.renderedPages.set(pageNumber, { container, viewport }) if (this.observer) { this.observer.unobserve(container) @@ -265,7 +281,7 @@ export default { } else { this.renderQueue.push(pageNumber) } - const MAX_QUEUE_LENGTH = 5 + const MAX_QUEUE_LENGTH = 4 if (this.renderQueue.length > MAX_QUEUE_LENGTH) { this.renderQueue.splice(MAX_QUEUE_LENGTH) } @@ -280,7 +296,6 @@ export default { const pageNumber = this.renderQueue.shift() await new Promise((resolve) => requestAnimationFrame(resolve)) await this.renderSinglePage(pageNumber) - this.scheduleRender(pageNumber + 1) } } finally { this.isProcessingQueue = false @@ -582,11 +597,15 @@ export default { top: 0; right: 0; bottom: 0; - pointer-events: none; + pointer-events: auto; + user-select: text; + -webkit-user-select: text; } .textLayer>span { cursor: text; + user-select: text; + -webkit-user-select: text; } .search-highlight {