From e67cd7fae06eeec9bf4ceba9bc301954898f13b1 Mon Sep 17 00:00:00 2001
From: Jonas Jenwald <jonas.jenwald@gmail.com>
Date: Thu, 14 Apr 2022 12:43:44 +0200
Subject: [PATCH] Replace the `--viewport-scale-factor` CSS variable

This CSS variable is only used together with the `annotationCanvasMap`-functionality in the canvas-code, however its value can be *trivially* computed by using the older `--zoom-factor` CSS variable together with the `PixelsPerInch`-structure.
Rather than having *two different* CSS variables that are this closely linked, it seems better to simplify things by using just one CSS variable instead.
---
 src/display/canvas.js | 5 +++--
 web/base_viewer.js    | 4 ----
 web/pdf_page_view.js  | 4 +---
 web/pdf_viewer.css    | 1 -
 4 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/src/display/canvas.js b/src/display/canvas.js
index ef789af81..5b98d9581 100644
--- a/src/display/canvas.js
+++ b/src/display/canvas.js
@@ -2726,8 +2726,9 @@ class CanvasGraphics {
           canvasHeight
         );
         const { canvas, context } = this.annotationCanvas;
-        canvas.style.width = `calc(${width}px * var(--viewport-scale-factor))`;
-        canvas.style.height = `calc(${height}px * var(--viewport-scale-factor))`;
+        const viewportScaleFactorStr = `var(--zoom-factor) * ${PixelsPerInch.PDF_TO_CSS_UNITS}`;
+        canvas.style.width = `calc(${width}px * ${viewportScaleFactorStr})`;
+        canvas.style.height = `calc(${height}px * ${viewportScaleFactorStr})`;
         this.annotationCanvasMap.set(id, canvas);
         this.annotationCanvas.savedCtx = this.ctx;
         this.ctx = context;
diff --git a/web/base_viewer.js b/web/base_viewer.js
index 3ba5d3a9d..3a47df701 100644
--- a/web/base_viewer.js
+++ b/web/base_viewer.js
@@ -1012,10 +1012,6 @@ class BaseViewer {
     }
 
     this._doc.style.setProperty("--zoom-factor", newScale);
-    this._doc.style.setProperty(
-      "--viewport-scale-factor",
-      newScale * PixelsPerInch.PDF_TO_CSS_UNITS
-    );
 
     const updateArgs = { scale: newScale };
     for (const pageView of this._pages) {
diff --git a/web/pdf_page_view.js b/web/pdf_page_view.js
index 65085c0a7..e769077f5 100644
--- a/web/pdf_page_view.js
+++ b/web/pdf_page_view.js
@@ -329,16 +329,14 @@ class PDFPageView {
     }
 
     const totalRotation = (this.rotation + this.pdfPageRotate) % 360;
-    const viewportScale = this.scale * PixelsPerInch.PDF_TO_CSS_UNITS;
     this.viewport = this.viewport.clone({
-      scale: viewportScale,
+      scale: this.scale * PixelsPerInch.PDF_TO_CSS_UNITS,
       rotation: totalRotation,
     });
 
     if (this._isStandalone) {
       const { style } = document.documentElement;
       style.setProperty("--zoom-factor", this.scale);
-      style.setProperty("--viewport-scale-factor", viewportScale);
     }
 
     if (this.svg) {
diff --git a/web/pdf_viewer.css b/web/pdf_viewer.css
index 01c9cfa2d..154e2004f 100644
--- a/web/pdf_viewer.css
+++ b/web/pdf_viewer.css
@@ -22,7 +22,6 @@
   --page-border: 9px solid transparent;
   --spreadHorizontalWrapped-margin-LR: -3.5px;
   --zoom-factor: 1;
-  --viewport-scale-factor: 1;
 }
 
 @media screen and (forced-colors: active) {