From 97b178ffa369320f8a9de614279683c6b01f4c71 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Thu, 12 Mar 2026 13:50:46 +0100 Subject: [PATCH 1/2] Enforces consistent trailing comma usage --- packages/tiffviewer/src/ui-manager.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/tiffviewer/src/ui-manager.ts b/packages/tiffviewer/src/ui-manager.ts index 83ac3eca..d3c3b0f8 100644 --- a/packages/tiffviewer/src/ui-manager.ts +++ b/packages/tiffviewer/src/ui-manager.ts @@ -21,7 +21,7 @@ export class UIManager { constructor( tiffService: TIFFService, paletteManager: PaletteManager, - appElement: HTMLElement + appElement: HTMLElement, ) { this.tiffService = tiffService; this.paletteManager = paletteManager; @@ -75,7 +75,7 @@ export class UIManager { const rgba = new Uint8ClampedArray(width * height * 4); if (samples === 1) { const palette = this.paletteManager.getPalette( - this.paletteManager.getCurrentPalette() + this.paletteManager.getCurrentPalette(), ); for (let i = 0; i < width * height; i++) { const v = data[i]; @@ -172,7 +172,7 @@ export class UIManager { // Palette panel (SVG) const palettePanelBtn = document.createElement("button"); palettePanelBtn.appendChild( - this.createIcon("palette", "Show Palette Selector") + this.createIcon("palette", "Show Palette Selector"), ); palettePanelBtn.title = "Show Palette Selector"; palettePanelBtn.type = "button"; @@ -312,7 +312,7 @@ export class UIManager { const rows = Object.entries(tags) .map( ([key, value]) => - `${key}${value}` + `${key}${value}`, ) .join(""); return ` From 753eceac99ee0f41e816854024d6d17655a7f2e2 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Thu, 12 Mar 2026 14:31:28 +0100 Subject: [PATCH 2/2] Removes device pixel ratio scaling from canvas --- packages/tiffviewer/src/ui-manager.ts | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/packages/tiffviewer/src/ui-manager.ts b/packages/tiffviewer/src/ui-manager.ts index d3c3b0f8..1d1a9b3a 100644 --- a/packages/tiffviewer/src/ui-manager.ts +++ b/packages/tiffviewer/src/ui-manager.ts @@ -96,10 +96,8 @@ export class UIManager { console.warn(`Unsupported sample format with ${samples} channels`); return; } - const dpr = window.devicePixelRatio || 1; - this.canvas.width = width * dpr; - this.canvas.height = height * dpr; - context.scale(dpr, dpr); + this.canvas.width = width; + this.canvas.height = height; this.canvas.style.width = `${width}px`; this.canvas.style.height = `${height}px`; const imageData = new ImageData(rgba, width, height); @@ -373,8 +371,8 @@ export class UIManager { const container = this.canvas.parentElement as HTMLElement; if (!container) return; const containerRect = container.getBoundingClientRect(); - const width = this.canvas.width / (window.devicePixelRatio || 1); - const height = this.canvas.height / (window.devicePixelRatio || 1); + const width = this.canvas.width; + const height = this.canvas.height; let useScale = scale; if (isNaN(useScale) || useScale <= 0) { useScale = this.panzoom.getScale() || 1; @@ -393,8 +391,8 @@ export class UIManager { const container = this.canvas.parentElement as HTMLElement; if (!container) return; const containerRect = container.getBoundingClientRect(); - const width = this.canvas.width / (window.devicePixelRatio || 1); - const height = this.canvas.height / (window.devicePixelRatio || 1); + const width = this.canvas.width; + const height = this.canvas.height; const scaleX = containerRect.width / width; const scaleY = containerRect.height / height; const scale = Math.min(scaleX, scaleY);