Render high-res partial page views when falling back to CSS zoom

test/unit/ui_utils_spec.js

@@ -279,25 +279,35 @@ describe("ui_utils", function () {
           viewTop < scrollBottom &&
           viewBottom > scrollTop
         ) {
-          const hiddenHeight =
-            Math.max(0, scrollTop - viewTop) +
-            Math.max(0, viewBottom - scrollBottom);
-          const hiddenWidth =
-            Math.max(0, scrollLeft - viewLeft) +
-            Math.max(0, viewRight - scrollRight);
+          const minY = Math.max(0, scrollTop - viewTop);
+          const minX = Math.max(0, scrollLeft - viewLeft);
+
+          const hiddenHeight = minY + Math.max(0, viewBottom - scrollBottom);
+          const hiddenWidth = minX + Math.max(0, viewRight - scrollRight);
 
           const fractionHeight =
             (div.clientHeight - hiddenHeight) / div.clientHeight;
           const fractionWidth =
             (div.clientWidth - hiddenWidth) / div.clientWidth;
           const percent = (fractionHeight * fractionWidth * 100) | 0;
 
+          let visibleArea = null;
+          if (percent < 100) {
+            visibleArea = {
+              minX,
+              minY,
+              maxX: Math.min(viewRight, scrollRight) - viewLeft,
+              maxY: Math.min(viewBottom, scrollBottom) - viewTop,
+            };
+          }
+
           views.push({
             id: view.id,
             x: viewLeft,
             y: viewTop,
             view,
             percent,
+            visibleArea,
             widthPercent: (fractionWidth * 100) | 0,
           });
           ids.add(view.id);

web/app.js

@@ -487,6 +487,7 @@ const PDFViewerApplication = {
       imageResourcesPath: AppOptions.get("imageResourcesPath"),
       enablePrintAutoRotate: AppOptions.get("enablePrintAutoRotate"),
       maxCanvasPixels: AppOptions.get("maxCanvasPixels"),
+      enableDetailCanvas: AppOptions.get("enableDetailCanvas"),
       enablePermissions: AppOptions.get("enablePermissions"),
       pageColors,
       mlManager: this.mlManager,

web/app_options.js

@@ -195,6 +195,11 @@ const defaultOptions = {
     value: true,
     kind: OptionKind.VIEWER + OptionKind.PREFERENCE + OptionKind.EVENT_DISPATCH,
   },
+  enableDetailCanvas: {
+    /** @type {boolean} */
+    value: true,
+    kind: OptionKind.VIEWER,
+  },
   enableGuessAltText: {
     /** @type {boolean} */
     value: true,