Web player served by stemserve

Plex browsing, stem mixer with presets, shuffle, repeat all/one, playback
speed, queue, waveform seek. stemserve serves web/ at / without the token.
stemserve image now builds from the repo root.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
cdnutterandClaude Opus 5.5 committed 2026-10-20 11:30:02 -07:00
1 parent 605b88f1eb
commit 9299fee9a0
8 files changed
+1113 -20

No files matched your search

+52
View File
@@ -0,0 +1,52 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="theme-color" content="#0d0e12">
<title>Stemify</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="app">
<aside id="nav">
<div class="brand">stemify</div>
<a href="#/albums" data-nav="albums">Albums</a>
<a href="#/artists" data-nav="artists">Artists</a>
<a href="#/playlists" data-nav="playlists">Playlists</a>
<a href="#/stems" data-nav="stems">Stems only</a>
<form id="search"><input type="search" name="q" placeholder="Search" autocomplete="off"></form>
<a href="#/settings" data-nav="settings" class="settings-link">Settings</a>
</aside>
<main id="view"></main>
<aside id="drawer" hidden></aside>
</div>
<footer id="player" class="empty">
<div class="np">
<img id="np-art" alt="">
<div class="np-text"><div id="np-title"></div><div id="np-sub"></div></div>
</div>
<div class="center">
<div class="transport">
<button id="b-shuffle" class="side" title="Shuffle (S)"></button>
<button id="b-prev" title="Previous"></button>
<button id="b-play" class="play" title="Play (Space)"></button>
<button id="b-next" title="Next"></button>
<button id="b-repeat" class="side" title="Repeat (R)"></button>
</div>
<div class="seek">
<span id="t-pos">0:00</span>
<canvas id="wave"></canvas>
<span id="t-dur">0:00</span>
</div>
</div>
<div class="right">
<select id="speed" title="Speed"></select>
<button id="b-mixer" class="pill" title="Mixer (M)"></button>
<button id="b-queue" class="pill" title="Queue (Q)"></button>
<input id="volume" type="range" min="0" max="1" step="0.01" title="Volume">
</div>
</footer>
<script type="module" src="app.js"></script>
</body>
</html>