Add audio player dock to episode list #10

Merged

w33ble merged 1 commit from feat/player-dock into main

2026-09-08 15:30:23 -06:00

hijynx commented

2026-09-08 15:28:34 -06:00

Collaborator

Summary

Adds a basic click-and-play audio player to the list UI. No server-side changes: /audio/ already serves mp3s with Range support via http.ServeContent, so seeking works out of the box and no transcoding is involved.

Single player dock (<section class="player" hidden>) sits above the Episodes heading, outside #episode-list — the 30s polling refresh replaces list innerHTML and can never interrupt playback
Done rows get a Play button (data-audio attr); first click unhides the dock, sets src/title/download link, calls play(); one episode plays at a time
× close control pauses audio, resets src/buffering, clears title/link, re-hides the dock
Native <audio controls preload="none"> so the list doesn't prefetch every episode
Styling follows the existing card/button design language (surface card, ghost buttons, danger tint on close hover); dock stacks vertically on narrow viewports

Tests

internal/server/page_test.go: play button + data-audio on done rows only, dock rendered outside the list, close button present
mise run check + mise run test green (-count=1)

## Summary Adds a basic click-and-play audio player to the list UI. No server-side changes: `/audio/` already serves mp3s with Range support via `http.ServeContent`, so seeking works out of the box and no transcoding is involved. - Single player dock (`<section class="player" hidden>`) sits above the Episodes heading, **outside** `#episode-list` — the 30s polling refresh replaces list innerHTML and can never interrupt playback - Done rows get a Play button (`data-audio` attr); first click unhides the dock, sets src/title/download link, calls `play()`; one episode plays at a time - `×` close control pauses audio, resets src/buffering, clears title/link, re-hides the dock - Native `<audio controls preload="none">` so the list doesn't prefetch every episode - Styling follows the existing card/button design language (surface card, ghost buttons, danger tint on close hover); dock stacks vertically on narrow viewports ## Tests - `internal/server/page_test.go`: play button + `data-audio` on done rows only, dock rendered outside the list, close button present - `mise run check` + `mise run test` green (`-count=1`)

hijynx added 1 commit

2026-09-08 15:28:35 -06:00