Begin implementing UI design, implement metadata fetching

Player.qml

@@ -3,38 +3,39 @@ import QtMultimedia 6.8
 
 pragma Singleton
 
-MediaPlayer {
-    readonly property var streams: ([
+Item {
+    readonly property string streamURLPrefix: "https://youradio.nonamesoft.xyz/youradio/api/"
+    readonly property string metadataURL: "https://youradio.nonamesoft.xyz/youradio/api/status-json.xsl"
+    readonly property var slugLookup: ({
+        "autoradio": 0,
+        "live": 1,
+        "bassboosted": 2
+    })
+    property var streams: ([
         {
             name: "Autoradio",
-            streamURL: "https://youradio.nonamesoft.xyz/api/autoradio"
+            slug: "autoradio",
+            title: "",
+            listeners: 0
         },
         {
             name: "Live Mix",
-            streamURL: "https://youradio.nonamesoft.xyz/api/live"
+            slug: "live",
+            title: "",
+            listeners: 0
         },
         {
             name: "Deep Bass",
-            streamURL: "https://youradio.nonamesoft.xyz/api/bassboosted"
+            slug: "bassboosted",
+            title: "",
+            listeners: 0
         }
     ])
+    property var failedConnAttempts: 0
 
-    id: player
-    source: ""
-
-    audioOutput: AudioOutput {
-        id: output
-        volume: 0.4
-    }
-
-    onErrorOccurred: function(error, errorString) {
-        const index = currentIndex
-        currentIndex = null
-        currentIndex = index;
-    }
-
+    property alias playing: player.playing
     property alias volume: output.volume
-    readonly property var loading: mediaStatus == Qt.LoadingMedia
+    readonly property var loading: player.mediaStatus == Qt.LoadingMedia
 
     property var currentIndex: null
     property var currentStream: null
@@ -49,7 +50,7 @@ MediaPlayer {
         print("Starting playing stream no. " + index);
         currentIndex = index;
         currentStream = streams[index];
-        source = currentStream.streamURL;
+        player.source = streamURLPrefix + currentStream.slug;
         player.play();
     }
 
@@ -60,7 +61,63 @@ MediaPlayer {
         print("Stopping playback");
         currentIndex = null;
         currentStream = null;
-        source = "";
+        player.source = "";
         player.stop()
     }
+
+    MediaPlayer {
+        id: player
+        source: ""
+
+        audioOutput: AudioOutput {
+            id: output
+            volume: 0.4
+        }
+
+        onErrorOccurred: function(error, errorString) {
+            const index = currentIndex
+            currentIndex = null
+            currentIndex = index;
+        }
+    }
+
+    Timer {
+        interval: 10000
+        repeat: true
+        running: true
+        triggeredOnStart: true
+        onTriggered: function() {
+            const xhr = new XMLHttpRequest();
+            xhr.onreadystatechange = function() {
+                if (xhr.readyState == XMLHttpRequest.DONE) {
+                    parent.failedConnAttempts = 0;
+                    // try {
+                        const object = JSON.parse(xhr.responseText.toString()).icestats;
+                        object.source.forEach(station => {
+                            const index = parent.slugLookup[station.server_name];
+                            if (index == null) {
+                                console.warn("Unknown slug encountered in metadata: " + station.server_name);
+                                return
+                            }
+                            parent.streams[index].title = station.title;
+                            parent.streams[index].listeners = station.listeners;
+                            if (index == parent.currentIndex) {
+                                parent.currentStream.title = station.title;
+                                parent.currentStream.listeners = station.listeners;
+                            }
+                        });
+                    // } catch {
+                    //     console.error("Failed deserializing metadata response");
+                    // }
+                }
+            }
+            xhr.open("GET", parent.metadataURL);
+            xhr.timeout = 10000;
+            xhr.ontimeout = function() {
+                console.log("Metadata request timed out after 10 seconds");
+                parent.failedConnAttempts++;
+            }
+            xhr.send();
+        }
+    }
 }