Improve pre-rendering at the start/end of the document

This is a very old "issue", which has existed since essentially forever, and it affects all of the available scrollModes. However, in the recently added Page-mode it's particularily noticeable since we use a *simulated* scroll direction there.

When deciding what page(s) to pre-render, we only consider the current scroll direction. This works well in most cases, but can break down at the start/end of the document by trying to pre-render a page *outside* of the existing ones. To improve this, we'll thus *force* the scroll direction at the start/end of the document.

*Steps to reproduce:*

 0. Open the viewer, e.g. https://mozilla.github.io/pdf.js/web/viewer.html
 1. Enable vertical scrolling.
 2. Press the <kbd>End</kbd> key.
 3. Open the devtools and, using the DOM Inspector, notice how page 13 is *not* being pre-rendered.
This commit is contained in:
Jonas Jenwald 2021-10-18 12:13:54 +02:00
parent 0aaa4e3dbe
commit 24b7fb20ef
2 changed files with 18 additions and 6 deletions

View File

@ -1361,10 +1361,12 @@ class BaseViewer {
return promise;
}
/**
* @private
*/
get _scrollAhead() {
#getScrollAhead(views) {
if (views.first.id === 1) {
return true;
} else if (views.last.id === this.pagesCount) {
return false;
}
switch (this._scrollMode) {
case ScrollMode.PAGE:
return this._scrollModePageState.scrollDown;
@ -1376,7 +1378,7 @@ class BaseViewer {
forceRendering(currentlyVisiblePages) {
const visiblePages = currentlyVisiblePages || this._getVisiblePages();
const scrollAhead = this._scrollAhead;
const scrollAhead = this.#getScrollAhead(visiblePages);
const preRenderExtra =
this._spreadMode !== SpreadMode.NONE &&
this._scrollMode !== ScrollMode.HORIZONTAL;

View File

@ -295,12 +295,22 @@ class PDFThumbnailViewer {
return promise;
}
#getScrollAhead(views) {
if (views.first.id === 1) {
return true;
} else if (views.last.id === this._thumbnails.length) {
return false;
}
return this.scroll.down;
}
forceRendering() {
const visibleThumbs = this._getVisibleThumbs();
const scrollAhead = this.#getScrollAhead(visibleThumbs);
const thumbView = this.renderingQueue.getHighestPriority(
visibleThumbs,
this._thumbnails,
this.scroll.down
scrollAhead
);
if (thumbView) {
this._ensurePdfPageLoaded(thumbView).then(() => {