gui functions nearly done
This commit is contained in:
parent
114d6ba4da
commit
f65918db8b
6 changed files with 297 additions and 81 deletions
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/html">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Sanic</title>
|
||||
|
@ -9,13 +9,14 @@
|
|||
<body>
|
||||
<main>
|
||||
<div id="nav">
|
||||
<div>
|
||||
<div id="control-admin">
|
||||
<button id="connection-state">❌ Disconnected</button> <!-- ❌ Cross Mark -->
|
||||
<button>Login</button>
|
||||
<button>Config</button>
|
||||
<button id="control-update-db" disabled="disabled">Update DB</button>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<div class="spaced">
|
||||
<button id="control-previous">⏮︎</button> <!-- ⏮️ Last Track Button -->
|
||||
<button id="control-stop">⏹︎</button> <!-- ⏹️ Stop Button -->
|
||||
<button id="control-play-pause">⏵︎</button> <!-- ▶️ Play or ⏸️ Pause Button -->
|
||||
|
@ -27,24 +28,38 @@
|
|||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<div class="spaced">
|
||||
<button id="control-repeat">🔘 repeat</button>
|
||||
<button id="control-shuffle">🔘 shuffle</button>
|
||||
</div>
|
||||
<div class="spaced">
|
||||
<label for="control-xfade">xfade</label>
|
||||
<div>
|
||||
<div>
|
||||
<label for="control-repeat">repeat</label>
|
||||
<input type="checkbox" id="control-repeat" name="repeat" />
|
||||
</div>
|
||||
<div>
|
||||
<label for="control-shuffle">shuffle</label>
|
||||
<input type="checkbox" id="control-shuffle" name="shuffle" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label for="control-xfade">xfade</label>
|
||||
<button id="control-xfade-minus">➖</button>
|
||||
<input type="number" id="control-xfade" name="xfade" value="00" />
|
||||
<button id="control-xfade-plus">➕</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="spaced">
|
||||
<button id="control-volume-down">🔉</button> <!-- 🔉 Speaker with sound wave -->
|
||||
<input id="control-volume" name="volume" type="range" min="0" max="100" value="50" />
|
||||
<button id="control-volume-up">🔊</button> <!-- 🔊 Speaker with sound waves -->
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p>Now playing:</p>
|
||||
<div>
|
||||
<label for="control-track">Track:</label>
|
||||
<input type="text" id="control-track" name="track" disabled="disabled" />
|
||||
</div>
|
||||
<div>
|
||||
<label for="control-time">Time:</label>
|
||||
<input type="text" id="control-time" name="time" value="00:00:00/00:00:00" disabled="disabled" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img id="sanic-logo" alt="sanic logo" src="/img/sanic-logo.webp" />
|
||||
<div>Sanic © 2023</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="queue">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue