feat(android): add D-pad navigation for Android TV remote controller (#3745)

* feat(android): add D-pad navigation for Android TV remote controller

Add basic D-pad/arrow key navigation support for Android TV Bluetooth
remote controllers, covering the full flow: library grid browsing,
reader page turning, toolbar interaction, and TTS toggle.

Library:
- Custom spatial navigation hook for grid D-pad navigation
- Arrow keys move between BookshelfItem elements with auto column detection
- ArrowDown from header enters the bookshelf grid

Reader:
- Enter key toggles header/footer toolbar visibility
- Left/Right navigate between toolbar buttons, Up/Down moves between
  header and footer bars
- Back button dismisses toolbar (with blur) before sidebar/library
- Focus-probe technique for reliable button visibility detection
  across fixed/hidden containers

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* fix: only auto-focus toolbar buttons on keyboard activation, not mouse hover

Track pointer activity to distinguish keyboard vs mouse toolbar activation.
When the toolbar appears due to mouse hover, skip auto-focus to prevent
unwanted focus outlines on desktop.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* fix: track keyboard events instead of pointer events for auto-focus guard

Pointer events from iframes don't bubble to the main document, so
tracking pointermove/pointerdown missed hover interactions over book
content. Track keydown instead — auto-focus only when a recent keyboard
event (Enter key) triggered the toolbar, not mouse hover.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

This commit is contained in:

Huang Xin

2026-04-05 01:50:34 +08:00

committed by

GitHub

parent 9595aa56e0

commit f361698e05

11 changed files with 472 additions and 2 deletions

									
										apps/readest-app/.claude/memory/MEMORY.md
									
		+3
		
												View File
												
				@@ -16,6 +16,9 @@

				- `src/app/reader/components/FoliateViewer.tsx` - Reader view orchestration

				- `src/app/reader/components/annotator/Annotator.tsx` - Annotation lifecycle

				## Feature Notes

				- [D-pad Navigation](dpad-navigation.md) — Android TV remote / keyboard arrow navigation design, key files, and pitfalls

				## Architecture Notes

				- foliate-js is a git submodule at `packages/foliate-js/`

				- Multiview paginator: loads adjacent sections in background, multiple View/Overlayer instances per book