diff --git a/mpd.go b/mpd.go
index 80943d9..12bac1c 100644
--- a/mpd.go
+++ b/mpd.go
@@ -11,22 +11,6 @@ import (
 
 // MPD API calls
 
-func updateDb(c echo.Context) error {
-	// Connect to MPD server
-	conn, err := mpd.Dial("tcp", "localhost:6600")
-	if err != nil {
-		log.Fatalln(err)
-	}
-	defer conn.Close()
-
-	jobId, err := conn.Update("")
-	if err != nil {
-		log.Fatalln(err)
-	}
-
-	return c.String(http.StatusOK, strconv.Itoa(jobId))
-}
-
 func previousTrack(c echo.Context) error {
 	// Connect to MPD server
 	conn, err := mpd.Dial("tcp", "localhost:6600")
diff --git a/server.go b/server.go
index 8095f32..fbd02c5 100644
--- a/server.go
+++ b/server.go
@@ -78,7 +78,6 @@ func main() {
 	})
 
 	g := e.Group("/api")
-	g.GET("/update_db", updateDb)
 	g.GET("/previous_track", previousTrack)
 	g.GET("/next_track", nextTrack)
 	g.GET("/stop", stopPlayback)
diff --git a/static/controls.js b/static/controls.js
deleted file mode 100644
index f63d153..0000000
--- a/static/controls.js
+++ /dev/null
@@ -1,98 +0,0 @@
-const API_URL = `${document.location.protocol}://${document.location.host}/api`;
-
-// Get control elements
-
-const control_update_db = document.getElementById("control-update-db");
-const control_previous = document.getElementById("control-previous");
-const control_play_pause = document.getElementById("control-play-pause");
-const control_stop = document.getElementById("control-stop");
-const control_next = document.getElementById("control-next");
-const control_progress = document.getElementById("control-progress");
-const control_repeat = document.getElementById("control-repeat");
-const control_shuffle = document.getElementById("control-shuffle");
-const control_xfade = document.getElementById("control-xfade");
-const control_xfade_minus = document.getElementById("control-xfade-minus");
-const control_xfade_plus = document.getElementById("control-xfade-plus");
-const queue_table = document.querySelector("#queue tbody");
-
-// Add API calls to controls
-
-control_update_db.addEventListener("click", e => {
-  fetch(`${API_URL}/update_db`);
-});
-control_previous.addEventListener("click", e => {
-  fetch(`${API_URL}/previous_track`);
-});
-control_play_pause.addEventListener("click", e => {
-  if (e.target.innerText === "⏵︎") {  // Play
-    fetch(`${API_URL}/pause`);
-  } else {  // Pause
-    fetch(`${API_URL}/play`);
-  }
-});
-control_stop.addEventListener("click", e => {
-  fetch(`${API_URL}/stop`);
-});
-control_next.addEventListener("click", e => {
-  fetch(`${API_URL}/next_track`);
-});
-control_progress.addEventListener("change", e => {
-  fetch(`${API_URL}/seek/${e.target.value}`)
-});
-control_repeat.addEventListener("click", e => {
-  fetch(`${API_URL}/repeat`);
-});
-control_shuffle.addEventListener("click", e => {
-  fetch(`${API_URL}/shuffle`);
-});
-control_xfade_minus.addEventListener("click", e => {
-  // TODO: not yet implemented
-  fetch(`${API_URL}/xfade`);
-});
-control_xfade_plus.addEventListener("click", e => {
-  // TODO: not yet implemented
-  fetch(`${API_URL}/xfade`);
-});
-
-// Create WebSocket connection.
-const socket = new WebSocket(`${document.location.protocol === "https" ? "wss" : "ws"}://${document.location.host}/ws`);
-
-// Connection opened
-socket.addEventListener("open", (e) => {
-  socket.send("Hello Server!");
-});
-
-// Listen for messages
-socket.addEventListener("message", (e) => {
-  console.log("Message from server");
-  const msg = JSON.parse(e.data);
-  if ("error" in msg.mpd_status) {
-    console.error(msg.mpd_status.error);
-  }
-
-  if ("updating_db" in msg.mpd_status) {
-    control_update_db.disable();
-  } else {
-    control_update_db.enable();
-  }
-  if ("state" in msg.mpd_status && msg.mpd_status.state === "play") {
-    control_play_pause.innerText = "⏸︎";  // Pause
-  } else {
-    control_play_pause.innerText = "⏵︎";  // Play
-  }
-  if ("elapsed" in msg.mpd_status) {
-    control_progress.value = msg.mpd_status.elapsed;
-  }
-  if ("duration" in msg.mpd_status) {
-    control_progress.max = msg.mpd_status.duration;
-  }
-  if ("repeat" in msg.mpd_status) {
-    control_repeat.checked = msg.mpd_status.repeat;
-  }
-  if ("random" in msg.mpd_status) {
-    control_shuffle.checked = msg.mpd_status.random;
-  }
-  if ("xfade" in msg.mpd_status) {
-    control_xfade.value = msg.mpd_status.xfade;
-  }
-});
diff --git a/static/index.html b/static/index.html
index 8934465..daaf309 100644
--- a/static/index.html
+++ b/static/index.html
@@ -4,7 +4,6 @@
   <meta charset="UTF-8" />
   <title>Sanic</title>
   <link rel="stylesheet" href="style.css" />
-  <link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48 64x64" type="image/png" />
 </head>
 <body>
 <main>
@@ -12,39 +11,21 @@
     <div>
       <button>Login</button>
       <button>Config</button>
-      <button id="control-update-db" disabled="disabled">Update DB</button>
     </div>
     <div>
       <div>
-        <button id="control-previous">&#x23EE;&#xFE0E;</button> <!-- ⏮️ Last Track Button -->
-        <button id="control-stop">&#x23F9;&#xFE0E;</button> <!-- ⏹️ Stop Button -->
-        <button id="control-play-pause">&#x23F5;&#xFE0E;</button> <!-- ▶️ Play or ⏸️ Pause Button -->
-        <button id="control-next">&#x23ED;&#xFE0E;</button> <!-- ⏭️ Next Track Button -->
+        <button>&#x23EE;&#xFE0E;</button> <!-- ⏮️ Last Track Button -->
+        <button>&#x23F9;&#xFE0E;</button> <!-- ⏹️ Stop Button -->
+        <button>&#x23EF;&#xFE0E;</button> <!-- ⏯️ Play or Pause Button -->
+        <button>&#x23ED;&#xFE0E;</button> <!-- ⏭️ Next Track Button -->
       </div>
       <div>
-        <label for="control-progress"></label>
-        <input type="range" id="control-progress" name="progress" min="0" step="1" />
+        <label for="progress"></label>
+        <input type="range" id="progress" name="progress" min="0" max="100" value="0" />
       </div>
     </div>
     <div>
-      <div>
-        <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">&#x2796;</button>
-          <input type="number" id="control-xfade" name="xfade" value="00" />
-          <button id="control-xfade-plus">&#x2795;</button>
-        </div>
-      </div>
+      baz
     </div>
   </div>
   <div id="queue">
@@ -59,16 +40,15 @@
         <td>Actions</td>
       </tr>
       </thead>
-      <tbody></tbody>
+      <tbody id="queue_table"></tbody>
     </table>
   </div>
   <div id="browser">browser</div>
   <div id="result">result</div>
 </main>
-<script src="controls.js"></script>
 <script>
   // create example elements in queue
-  const queue = document.querySelector("#queue tbody");
+  const queue = document.getElementById("queue_table");
   for (let i = 0; i < 100; i++) {
     const tr = document.createElement("tr");
 
diff --git a/static/style.css b/static/style.css
index 0e0863e..92d0b44 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,7 +1,3 @@
-/* #################### */
-/* ####### main ####### */
-/* #################### */
-
 html, body { margin: 0; height: 100%; }
 
 main {
@@ -24,6 +20,8 @@ main {
   display: flex;
 }
 
+#nav
+
 #result {
   grid-area: result;
   overflow: auto;
@@ -37,28 +35,8 @@ table {
   width: 100%;
 }
 
-/* #################### */
-/* ###### debug ####### */
-/* #################### */
 
+/* debug */
 div {
   border: 1px solid blue;
 }
-
-/* #################### */
-/* ### pretty stuff ### */
-/* #################### */
-
-/* Disable arrows in input */
-
-/* Chrome, Safari, Edge, Opera */
-#control-xfade::-webkit-outer-spin-button,
-#control-xfade::-webkit-inner-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-/* Firefox */
-#control-xfade[type=number] {
-  -moz-appearance: textfield;
-}