Remove the shadowViewer used with Page scrolling

The only reason for using a `DocumentFragment` in the first place, originally added in PR 8724, was to prevent errors in the `PDFPageView`-constructor. However, we should be able to simply make its `container`-option *optional* instead, since it's not being used for anything else in the class.

Note that pre-rendering still works correctly in my testing, and given that the `BaseViewer` keeps references to all `PDFPageView`-instances (via its `_pages` Array) it also shouldn't be possible to "lose" any pages/canvases this way.
This commit is contained in:
Jonas Jenwald 2021-10-28 11:57:27 +02:00
parent 0e7614df7f
commit c18df2c61f
2 changed files with 12 additions and 19 deletions

View File

@ -148,6 +148,8 @@ function isSameScale(oldScale, newScale) {
* Simple viewer control to display PDF content/pages. * Simple viewer control to display PDF content/pages.
*/ */
class BaseViewer { class BaseViewer {
#scrollModePageState = null;
/** /**
* @param {PDFViewerOptions} options * @param {PDFViewerOptions} options
*/ */
@ -531,9 +533,7 @@ class BaseViewer {
this._optionalContentConfigPromise = optionalContentConfigPromise; this._optionalContentConfigPromise = optionalContentConfigPromise;
const viewerElement = const viewerElement =
this._scrollMode === ScrollMode.PAGE this._scrollMode === ScrollMode.PAGE ? null : this.viewer;
? this._scrollModePageState.shadowViewer
: this.viewer;
const scale = this.currentScale; const scale = this.currentScale;
const viewport = firstPdfPage.getViewport({ const viewport = firstPdfPage.getViewport({
scale: scale * PixelsPerInch.PDF_TO_CSS_UNITS, scale: scale * PixelsPerInch.PDF_TO_CSS_UNITS,
@ -688,8 +688,7 @@ class BaseViewer {
this._previousScrollMode = ScrollMode.UNKNOWN; this._previousScrollMode = ScrollMode.UNKNOWN;
this._spreadMode = SpreadMode.NONE; this._spreadMode = SpreadMode.NONE;
this._scrollModePageState = { this.#scrollModePageState = {
shadowViewer: document.createDocumentFragment(),
previousPageNumber: 1, previousPageNumber: 1,
scrollDown: true, scrollDown: true,
pages: [], pages: [],
@ -714,18 +713,12 @@ class BaseViewer {
throw new Error("_ensurePageViewVisible: Invalid scrollMode value."); throw new Error("_ensurePageViewVisible: Invalid scrollMode value.");
} }
const pageNumber = this._currentPageNumber, const pageNumber = this._currentPageNumber,
state = this._scrollModePageState, state = this.#scrollModePageState,
viewer = this.viewer; viewer = this.viewer;
// Remove the currently active pages, if any, from the viewer. // Temporarily remove all the pages from the DOM...
if (viewer.hasChildNodes()) { viewer.textContent = "";
// Temporarily remove all the pages from the DOM. // ... and clear out the active ones.
viewer.textContent = "";
for (const pageView of this._pages) {
state.shadowViewer.appendChild(pageView.div);
}
}
state.pages.length = 0; state.pages.length = 0;
if (this._spreadMode === SpreadMode.NONE) { if (this._spreadMode === SpreadMode.NONE) {
@ -1249,7 +1242,7 @@ class BaseViewer {
} }
const views = const views =
this._scrollMode === ScrollMode.PAGE this._scrollMode === ScrollMode.PAGE
? this._scrollModePageState.pages ? this.#scrollModePageState.pages
: this._pages, : this._pages,
horizontal = this._scrollMode === ScrollMode.HORIZONTAL, horizontal = this._scrollMode === ScrollMode.HORIZONTAL,
rtl = horizontal && this._isContainerRtl; rtl = horizontal && this._isContainerRtl;
@ -1369,7 +1362,7 @@ class BaseViewer {
} }
switch (this._scrollMode) { switch (this._scrollMode) {
case ScrollMode.PAGE: case ScrollMode.PAGE:
return this._scrollModePageState.scrollDown; return this.#scrollModePageState.scrollDown;
case ScrollMode.HORIZONTAL: case ScrollMode.HORIZONTAL:
return this.scroll.right; return this.scroll.right;
} }

View File

@ -36,7 +36,7 @@ import { RenderingStates } from "./pdf_rendering_queue.js";
/** /**
* @typedef {Object} PDFPageViewOptions * @typedef {Object} PDFPageViewOptions
* @property {HTMLDivElement} container - The viewer element. * @property {HTMLDivElement} [container] - The viewer element.
* @property {EventBus} eventBus - The application event bus. * @property {EventBus} eventBus - The application event bus.
* @property {number} id - The page unique ID (normally its number). * @property {number} id - The page unique ID (normally its number).
* @property {number} scale - The page scale display. * @property {number} scale - The page scale display.
@ -140,7 +140,7 @@ class PDFPageView {
}); });
this.div = div; this.div = div;
container.appendChild(div); container?.appendChild(div);
} }
setPdfPage(pdfPage) { setPdfPage(pdfPage) {