cdnutterandClaude Opus 5.5
9299fee9a0
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>
53 lines
1.8 KiB
HTML
53 lines
1.8 KiB
HTML
<!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>
|