Getting Started
Welcome to the Cinematic Story Player! This app allows you to listen to audiobook chapters with a visually immersive experience. The player automatically loads your book and displays relevant artwork for each chapter.
Tip: Move your mouse to the edges of the screen to reveal hidden controls and sidebars.
Basic Playback Controls
- Play/Pause: Click the ▶/⏸ button in the center of the controls bar, or click/tap directly on the artwork.
- Previous/Next Track: Use the ⏮ and ⏭ buttons to navigate between chapters.
- Volume Control: Adjust the volume slider on the left side of the controls bar.
- Playback Speed: Use the dropdown menu on the right side of the controls bar to change playback speed (1x, 1.5x, 2x).
Navigation & Interface
- Left Sidebar (Chapters): Hover near the left edge of the screen to open the chapters list. Click any chapter to jump directly to it. The sidebar closes automatically when you select a chapter.
- Right Sidebar (Settings): Hover near the right edge to temporarily open settings, or click the ⚙️ gear icon to keep it open.
- Track Information: Current chapter title and description appear at the bottom-left. This fades after a few seconds but can be shown by double-clicking/tapping the artwork or moving your mouse.
- Controls Bar: Hover near the bottom of the screen to reveal playback controls.
Settings Explained
- Continuous Play: When enabled, the player automatically proceeds to the next chapter when the current one ends.
- Advanced Display: Toggles a different visual layout optimized for certain artwork types.
- Track Info Display Duration: Adjust how long chapter information remains visible after being triggered (5-10 seconds).
Touch & Mobile Interactions
- Tap to Play/Pause: Single tap anywhere on the artwork to play or pause.
- Double-Tap for Info: Double-tap the artwork to show the chapter title and description.
- Swipe Gestures: On touch devices, swipe horizontally near the edges to open sidebars.
Troubleshooting
- No Audio: Ensure your device volume is up and check if the audio file paths in book.json are correct.
- Images Not Loading: Check that image paths in book.json are correct and accessible.
- Player Not Responding: Try refreshing the page. If problems persist, check the browser console for errors.
- Sidebars Not Opening: Ensure your mouse is moving near the very edges of the screen (within 40 pixels).
Keyboard Shortcuts (When Focused)
- Space or K: Play/Pause
- J: Previous Chapter
- L: Next Chapter
- ←/→: Seek backward/forward
- F: Toggle fullscreen
- M: Mute/Unmute