From 089ed6fb6522257017741d5737ac205bc745b565 Mon Sep 17 00:00:00 2001
From: Calixte Denizet <calixte.denizet@gmail.com>
Date: Mon, 16 Jan 2023 19:38:33 +0100
Subject: [PATCH] Move --scale-factor variable in the viewer container (fix
#15929)
When a css variable is update in a node then all the children under this
node are updated.
In order to avoid to update all the UI when a page is rescaling, this
patch moves the --scale-factor from the :root to the viewer container.
---
web/pdf_page_view.js | 8 +++++---
web/pdf_viewer.css | 5 ++++-
web/pdf_viewer.js | 4 ++--
3 files changed, 11 insertions(+), 6 deletions(-)
diff --git a/web/pdf_page_view.js b/web/pdf_page_view.js
index fdc4ac819..a9301035f 100644
--- a/web/pdf_page_view.js
+++ b/web/pdf_page_view.js
@@ -36,7 +36,6 @@ import {
import {
approximateFraction,
DEFAULT_SCALE,
- docStyle,
OutputScale,
RendererType,
RenderingStates,
@@ -206,7 +205,7 @@ class PDFPageView {
) {
// Ensure that the various layers always get the correct initial size,
// see issue 15795.
- docStyle.setProperty(
+ container?.style.setProperty(
"--scale-factor",
this.scale * PixelsPerInch.PDF_TO_CSS_UNITS
);
@@ -562,7 +561,10 @@ class PDFPageView {
PDFJSDev.test("!PRODUCTION || GENERIC")) &&
this._isStandalone
) {
- docStyle.setProperty("--scale-factor", this.viewport.scale);
+ this.div.parentNode?.style.setProperty(
+ "--scale-factor",
+ this.viewport.scale
+ );
}
if (
diff --git a/web/pdf_viewer.css b/web/pdf_viewer.css
index 5a045f55b..69bce3125 100644
--- a/web/pdf_viewer.css
+++ b/web/pdf_viewer.css
@@ -23,7 +23,6 @@
--page-margin: 1px auto -8px;
--page-border: 9px solid transparent;
--spreadHorizontalWrapped-margin-LR: -3.5px;
- --scale-factor: 1;
--loading-icon-delay: 400ms;
}
@@ -47,6 +46,10 @@
}
.pdfViewer {
+ /* Define this variable here and not in :root to avoid to reflow all the UI
+ when scaling (see #15929). */
+ --scale-factor: 1;
+
padding-bottom: var(--pdfViewer-padding-bottom);
}
diff --git a/web/pdf_viewer.js b/web/pdf_viewer.js
index 6cf32cc4b..a2a6631c6 100644
--- a/web/pdf_viewer.js
+++ b/web/pdf_viewer.js
@@ -758,7 +758,7 @@ class PDFViewer {
});
// Ensure that the various layers always get the correct initial size,
// see issue 15795.
- docStyle.setProperty("--scale-factor", viewport.scale);
+ this.viewer.style.setProperty("--scale-factor", viewport.scale);
for (let pageNum = 1; pageNum <= pagesCount; ++pageNum) {
const pageView = new PDFPageView({
@@ -1093,7 +1093,7 @@ class PDFViewer {
return;
}
- docStyle.setProperty(
+ this.viewer.style.setProperty(
"--scale-factor",
newScale * PixelsPerInch.PDF_TO_CSS_UNITS
);