fix(reader): PDF highlights offset from the words — wrong fraction denominator · 34a27a5951 - bookhoard

fix(reader): PDF highlights offset from the words — wrong fraction denominator

Highlights landed on the right line but shifted right and oversized
on any display with devicePixelRatio != 1. Cause: selection fractions
divided the textLayer span rects by documentElement's screen rect,
but pdf.js scales the iframe's <html> by 1/dpr — that rect is dpr×
smaller than the visible page, inflating every x/w fraction by dpr
(on a 2× display a highlight started twice as far right and was twice
as wide). dpr=1 displays were coincidentally correct, which is why
the geometry looked sound when written.

The denominator is now the rendered canvas (#canvas canvas), whose
post-transform rect IS the visible page and shares the textLayer's
transform space — the dpr scaling cancels exactly. Comics keep the
img denominator; a viewport fallback covers any page without either.
The popover-placement scale factors (frame/denominator) become 1 for
PDFs as a side effect, fixing popover drift too. The fork's click
hit-test (86e234d) gets the same canvas-aware denominator so clicking
highlights opens the editor at the right spot.

Highlights saved before this fix stored dpr-inflated fractions and
will still render misplaced — delete and re-create them.

This commit is contained in:

john-okeefe

2026-08-17 08:33:11 -04:00

parent 1905feceea

commit 34a27a5951

2 changed files with 24 additions and 10 deletions

									
										package.json
									
		+1
		-1
	
												View File
												
				@@ -12,7 +12,7 @@

				    "dev": "npm run build:ts:dev && npm run build:css"

				  },

				  "dependencies": {

				    "@bookhoard/foliate-js": "git+https://github.com/john-okeefe/foliate-js.git#d065495",

				    "@bookhoard/foliate-js": "git+https://github.com/john-okeefe/foliate-js.git#86e234d",

				    "alpinejs": "^3.15.8",

				    "chart.js": "^4.5.1",

				    "highlight.js": "^11.11.1",