Skip to main content

Audiobook Player

The Audiobook Player provides playback controls for audio content. The Player displays the audiobook cover, current track information, and playback controls. Users can play, pause, seek, skip tracks, and adjust playback speed. The Playlist panel shows all available chapters/tracks.


Player Interface

The Player interface consists of three main areas:

AreaContent
PosterCover artwork and track title
ControlsPlayback buttons and seek bar
PlaylistChapter/track list (modal on mobile)

Playback Controls

ControlIconActionKeyboard
Play/PausePlay/Pause iconToggle playbackSpace
RewindBackward iconJump back 30 secondsLeft Arrow
ForwardForward iconJump ahead 30 secondsRight Arrow
Previous TrackPrevious iconGo to previous chapterUp Arrow
Next TrackNext iconGo to next chapterDown Arrow

Previous Track Behavior

  • If more than 5 seconds into current track: restarts current track
  • If less than 5 seconds: goes to previous track
  • Disabled on first track

Next Track Behavior

  • Advances to next chapter
  • Auto-triggers when current track ends
  • Disabled on last track

Seek Bar

The seek bar allows direct position navigation within the current track.

ElementDisplay
Current timeMM:SS format (e.g., "2:45")
Total durationMM:SS format (e.g., "45:32")
ProgressVisual bar with gradient fill

Users can drag the seek bar to jump to any position in the track.


Playback Speed

Available speed options:

SpeedLabel
0.5xSlow
0.8x
1.0xNormal
1.2x
1.5x
2.0xFast

The speed selector displays the current playback rate and allows users to change it at any time.


Playlist

The Playlist displays all chapters/tracks in the audiobook:

ElementDescription
Chapter numberChapter identifier
TitleTrack name
DurationTrack length in MM:SS format
Current indicatorVolume icon on currently playing track

Playlist Behavior

  • Clicking a track jumps to that chapter
  • Current track is highlighted
  • Unavailable tracks (file = null) are not clickable

Accessing Playlist

DeviceAccess
DesktopPlaylist button in Header
MobilePlaylist button opens full-screen modal

Progress Tracking

The Player automatically saves playback position:

FeatureBehavior
Auto-saveEvery 5 seconds
RestoreLast position restored on reload
Data savedCurrent track index and seek position

Preview Mode

For preview/sample content:

RestrictionBehavior
Seek limitCannot seek beyond preview duration
Duration displayShows "(preview)" label
Auto-pausePauses at preview boundary

Media Session Integration

The Player integrates with OS-level media controls:

FeatureSupport
Play/Pause
Previous/Next
Track metadataTitle, artist, album, artwork
Position stateDuration, current position, playback rate

Keyboard Shortcuts

KeyAction
SpacePlay/Pause
Right ArrowForward 30 seconds
Left ArrowRewind 30 seconds
Down ArrowNext track
Up ArrowPrevious track

For more information about feature visibility and device adaptation, see Reader Features.

X

Graph View