From 7e4921f1dc59c33be4af99e4e585eb6061dfaec8 Mon Sep 17 00:00:00 2001 From: Martin Date: Sun, 13 Oct 2024 10:24:08 +0200 Subject: [PATCH] Fix blurry pdf player rendering for all viewport sizes (#6182) --- src/plugins/pdfPlayer/plugin.js | 16 +++++----------- 1 file changed, 5 insertions(+), 11 deletions(-) diff --git a/src/plugins/pdfPlayer/plugin.js b/src/plugins/pdfPlayer/plugin.js index 7b7e3fa4b8..de30a73bfd 100644 --- a/src/plugins/pdfPlayer/plugin.js +++ b/src/plugins/pdfPlayer/plugin.js @@ -290,22 +290,16 @@ export class PdfPlayer { } renderPage(canvas, number) { + const devicePixelRatio = window.devicePixelRatio || 1; this.book.getPage(number).then(page => { - const width = dom.getWindowSize().innerWidth; - const height = dom.getWindowSize().innerHeight; - const scale = Math.ceil(window.devicePixelRatio || 1); + const original = page.getViewport({ scale: 1 }); + const scale = Math.max((window.screen.height / original.height), (window.screen.width / original.width)) * devicePixelRatio; const viewport = page.getViewport({ scale }); - const context = canvas.getContext('2d'); + canvas.width = viewport.width; canvas.height = viewport.height; - if (width < height) { - canvas.style.width = '100%'; - canvas.style.height = 'auto'; - } else { - canvas.style.height = '100%'; - canvas.style.width = 'auto'; - } + const context = canvas.getContext('2d'); const renderContext = { canvasContext: context,