john-okeefe
db4de823f3
feat: Update reader template for foliate-js integration
...
Update reader page template to use foliate-js custom element and add theme selector UI.
Template Changes:
1. Add foliate-js integration:
- Load foliate-themes.css for reading theme system
- Load foliate-js/view.js to register <foliate-view> custom element
- Replace <main id="reader-content"> with <foliate-view id="reader-view">
- Foliate auto-initializes from the custom element
2. Add Reading Theme selector:
- New section in settings panel (before Typography)
- Single dropdown with 18 themes organized by category using <optgroup>
- Categories: Classic Reading, Sky & Atmosphere, Sunset & Warmth, Nature & Earth, High Performance
- Each theme shows descriptive name
- Themes organized for easy discovery (grouped by mood/use case)
3. Remove broken references:
- Remove ebook-content class (tied to broken CSS columns approach)
- Clean up old reader-specific CSS class references
Reader Template Structure:
- Chrome (top/bottom bars): Back button, title, settings gear
- Bottom bar: Progress display, TOC/bookmarks/notes buttons, panel editor (comics)
- Settings panel: Chrome behavior, progress mode, reading themes, typography (fonts, spacing)
- TOC panel: Table of contents navigation
- Navigator panel: Page thumbnail with draggable viewport
- Bookmarks panel: User bookmarks with add button
- Dictionary popup: Word definition popup
Template Generator:
- Regenerated reader_templ.go via go generate
- Syncs template changes with Go backend
2026-04-12 12:09:56 -04:00
john-okeefe
b455f54d3c
refactor: export getDefaultSettings for reader module use
...
- Export getDefaultSettings function for use in reader-navigation
- Minor formatting improvements in settings-manager.ts
- Add tabindex and ebook-content class to reader-content in template
2026-04-05 21:15:07 -04:00
john-okeefe
f1b1eebc0b
templates: update script tags for ES modules and reader link
...
- Change script tags from 'defer' to 'type=module' for ES module support
- Add reader.js script to reader.templ for the reader bundle
- Update book_detail.templ 'Read Now' button to link to /readers/{id}
- Remove trailing blank line from register.templ
2026-04-04 18:17:06 -04:00
john-okeefe
7fd8ccb129
feat(reader): add reader JavaScript loading and backend support
...
- templates/reader.templ: add script tag to load main.js
- Enables reader shell and Alpine components to initialize
- internal/handlers/reader.go: add GetMediaReadingProgress handler
- Backend now supports fetching reading progress via API
- GET /api/media-items/:id/progress returns current progress
2026-04-04 13:38:23 -04:00
john-okeefe
2eddc1b92b
Add font loader and update reader template for font loading
...
- Add font-loader.ts for managing 8 reading fonts with preload optimization
- Include fonts: Literata, Crimson Text, Source Serif 4, EB Garamond,
Libertinus Serif, Noto Serif, Charis SIL, IBM Plex Serif
- Update reader.templ to include reader-fonts.css stylesheet
2026-04-04 01:00:23 -04:00
john-okeefe
afbe7f7220
feat: add reader.templ source file for templ code generation
...
- Add templates/reader.templ with Go templ syntax
- Contains Reader component with dockable panels
- Panel components: ReaderChrome, Settings, TOC, Navigator, Bookmarks, DictionaryPopup
2026-04-03 17:20:40 -04:00
john-okeefe