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);