feat(reader): touch & mobile — tap zones, gesture engine, mobile sheets
Phase 2 of the reader redesign: - Fixed-layout touch engine (foliate-js e9e61d8): pinch-zoom around the midpoint, two-finger pan, single-finger pan while zoomed, horizontal swipe page-turn at fit (RTL-aware via next()/prev()), and double-tap to zoom 2.5x / reset. Touch events forwarded from page iframes with converted coordinates; preventDefault only when the engine consumes the gesture, so PDF text selection and native taps stay intact. touch-action: none on the host and in comic/pdf page documents keeps the browser from fighting the engine. - Tap zones (Kindle-style) for touch devices: tap the outer margins to page, center to toggle chrome. Size configurable (10-50%) via the revived tap_zone_size setting; toggle via new tap_zones_enabled (Behavior section of the settings drawer). Pointer-based + passive so drags/swipes/selection never trigger; attached both to the viewport and inside every page document (iframe events don't bubble); debounced 280ms so double-tap zoom doesn't also page; no zone actions while a fixed-layout page is zoomed. - Drawers become full-width sheets on screens <= 640px.
This commit is contained in:
+1
-1
@@ -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#29bc958",
|
||||
"@bookhoard/foliate-js": "git+https://github.com/john-okeefe/foliate-js.git#e9e61d8",
|
||||
"alpinejs": "^3.15.8",
|
||||
"chart.js": "^4.5.1",
|
||||
"highlight.js": "^11.11.1",
|
||||
|
||||
Reference in New Issue
Block a user