2 files changed, 64 insertions, 63 deletions
diff --git a/templates/var/www/html/audio-controls.js b/templates/var/www/html/audio-controls.js
new file mode 100644
index 0000000..3b0a0c1
--- /dev/null
+++ b/templates/var/www/html/audio-controls.js
@@ -0,0 +1,63 @@
+const player = document.getElementById('radioPlayer');
+const button = document.getElementById('radioButton');
+const infoEl = document.getElementById('info');
+
+button.addEventListener('click', () => {
+  if (player.paused) {
+    player.play();
+    button.textContent = 'stop';
+  } else {
+    player.pause();
+    player.currentTime = 0;
+    button.textContent = 'play';
+  }
+});
+
+let spinnerInterval;
+
+function startSpinner() {
+  const spinnerChars = ['|', '/', '-', '\\'];
+  let i = 0;
+  spinnerInterval = setInterval(() => {
+    infoEl.textContent = `${spinnerChars[i++ % spinnerChars.length]}`;
+  }, 100);
+}
+
+function stopSpinner() {
+  clearInterval(spinnerInterval);
+}
+
+let spinnerHasRun = false;
+
+async function fetchCurrentTrack() {
+  if (!spinnerHasRun) {
+    startSpinner();
+    await new Promise(resolve => setTimeout(resolve, 3000));
+  }
+
+  try {
+    const response = await fetch('/info');
+    if (!response.ok) throw new Error('Network response was not ok');
+
+    const data = await response.json();
+    const source = data.icestats.source;
+
+    const title = source.title || 'Unknown';
+    const bitrate = source['ice-bitrate'] || 0;
+    const listeners = source.listeners || 0;
+    const listenerLabel = listeners === 1 ? 'listener' : 'listeners';
+
+    stopSpinner();
+    infoEl.textContent = `${title} | ${bitrate} kbps | ${listeners} ${listenerLabel}`;
+
+    spinnerHasRun = true;
+
+  } catch (error) {
+    stopSpinner();
+    infoEl.textContent = 'Error loading track info';
+    console.error(error);
+  }
+}
+
+fetchCurrentTrack();
+setInterval(fetchCurrentTrack, 10000);
diff --git a/templates/var/www/html/index.html b/templates/var/www/html/index.html
index 7c45f1d..f62cf53 100644
--- a/templates/var/www/html/index.html
+++ b/templates/var/www/html/index.html
@@ -23,70 +23,8 @@
   </div>
 
   <script>
-    const player = document.getElementById('radioPlayer');
-    const button = document.getElementById('radioButton');
-    const infoEl = document.getElementById('info');
-
-    button.addEventListener('click', () => {
-      if (player.paused) {
-        player.play();
-        button.textContent = 'Stop';
-      } else {
-        player.pause();
-        player.currentTime = 0;
-        button.textContent = 'Play';
-      }
-    });
-
-    let spinnerInterval;
-
-    function startSpinner() {
-      const spinnerChars = ['|', '/', '-', '\\'];
-      let i = 0;
-      spinnerInterval = setInterval(() => {
-        infoEl.textContent = `${spinnerChars[i++ % spinnerChars.length]}`;
-      }, 100);
-    }
-
-    function stopSpinner() {
-      clearInterval(spinnerInterval);
-    }
-
-    let spinnerHasRun = false;
-
-    async function fetchCurrentTrack() {
-      if (!spinnerHasRun) {
-        startSpinner();
-        await new Promise(resolve => setTimeout(resolve, 3000));
-      }
-
-      try {
-        const response = await fetch('/info');
-        if (!response.ok) throw new Error('Network response was not ok');
-
-        const data = await response.json();
-        const source = data.icestats.source;
-
-        const title = source.title || 'Unknown';
-        const bitrate = source['ice-bitrate'] || 0;
-        const listeners = source.listeners || 0;
-        const listenerLabel = listeners === 1 ? 'listener' : 'listeners';
-
-        stopSpinner();
-        infoEl.textContent = `${title} | ${bitrate} kbps | ${listeners} ${listenerLabel}`;
-
-        spinnerHasRun = true;
-
-      } catch (error) {
-        stopSpinner();
-        infoEl.textContent = 'Error loading track info';
-        console.error(error);
-      }
-    }
-
-    fetchCurrentTrack();
-    setInterval(fetchCurrentTrack, 10000);
   </script>
+  <script src="audio-controls.js"></script>
   <script src="video-background.js"></script>
 </body>
 </html>