62 lines
2.5 KiB
Plaintext
62 lines
2.5 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>🎵 Asteroid Radio - Player</title>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" type="text/css" href="/asteroid/static/asteroid.css">
|
|
<script src="/asteroid/static/js/front-page.js"></script>
|
|
<script src="/asteroid/static/js/stream-player.js"></script>
|
|
</head>
|
|
<body class="popout-body">
|
|
<div class="popout-container">
|
|
<div class="popout-header">
|
|
<div class="popout-title">
|
|
🎵 Asteroid Radio
|
|
<br/>
|
|
<span class="popout-subtitle">The Station at the End of Time</span>
|
|
</div>
|
|
<button class="close-btn" onclick="window.close()">✖ Close</button>
|
|
</div>
|
|
|
|
<div class="now-playing-mini">
|
|
<div class="track-info-mini">
|
|
<div class="track-title-mini" id="popout-track-title">Loading...</div>
|
|
<div class="track-artist-mini" id="popout-track-artist">Please wait</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="channel-selector">
|
|
<input type="hidden" id="stream-base-url" lquery="(val stream-base-url)">
|
|
<label for="popout-stream-channel"><strong>Channel:</strong></label>
|
|
<select id="popout-stream-channel" onchange="changeChannel()">
|
|
<option value="curated">🎧 <c:splice lquery="(text curated-channel-name)">Curated</c:splice></option>
|
|
<option value="shuffle">🎲 Shuffle</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="quality-selector">
|
|
<label for="popout-stream-quality"><strong>Quality:</strong></label>
|
|
<select id="popout-stream-quality" onchange="changeStreamQuality()">
|
|
<option value="aac">AAC 96kbps</option>
|
|
<option value="mp3">MP3 128kbps</option>
|
|
<option value="low">MP3 64kbps</option>
|
|
</select>
|
|
</div>
|
|
|
|
<audio id="live-audio" controls autoplay style="width: 100%;">
|
|
<source id="audio-source" lquery="(attr :src default-stream-url :type default-stream-encoding)">
|
|
Your browser does not support the audio element.
|
|
</audio>
|
|
|
|
<div class="status-mini">
|
|
<span style="color: #00ff00;">
|
|
<span class="live-stream-indicator">●</span>
|
|
LIVE</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Initialization handled by stream-player.js -->
|
|
</body>
|
|
</html>
|