Gracefully handle online/offline

README.md

@@ -121,6 +121,11 @@ gives listeners a "we'll be right back" bed instead of silence. When the live
 stream returns, the player switches back automatically — without interrupting a
 listener who is already playing.
 
+If `api/nowplaying.php` is unreachable or returns invalid JSON, the player also
+treats that as offline (rather than freezing on the initial state). To preview
+the offline state without stopping your stream, append `?offline=1` to the URL
+(e.g. `https://radio.example.com/?offline=1`) and press play.
+
 You can hard-code artwork for specific tracks by creating `config/overrides.json`:
 
 ```json

assets/js/player.js

@@ -342,27 +342,42 @@
     updateMediaSession({ title: offName, artist: '', album: '' }, offArt);
   }
 
+  // Test switch: append ?offline=1 to the URL to force the offline state so you
+  // can preview the offline art + fallback audio without stopping the stream.
+  var FORCE_OFFLINE = (function () {
+    try { return new URLSearchParams(location.search).get('offline') === '1'; }
+    catch (e) { return false; }
+  })();
+
+  function markOffline() {
+    if (el.liveBadge) el.liveBadge.hidden = true;
+    currentKey = null;
+    if (!offlineMode) goOffline();                  // apply the offline state once
+  }
+
+  function applyState(data) {
+    if (FORCE_OFFLINE || !data) data = { online: false };
+    updateListeners(data);
+    if (el.liveBadge) el.liveBadge.hidden = !data.online; // green dot = truly broadcasting
+    if (!data.online) { markOffline(); return; }
+    if (offlineMode) {                              // stream came back — return to live
+      offlineMode = false;
+      setSource(liveSourceUrl, false);
+    }
+    var key = trackKey(data);
+    if (key !== currentKey && (data.artist || data.title)) {
+      currentKey = key;
+      onNewTrack(data, data.art || '');
+    }
+  }
+
   function poll() {
     api('api/nowplaying.php')
-      .then(function (data) {
-        updateListeners(data);
-        if (el.liveBadge) el.liveBadge.hidden = !data.online; // green dot = truly broadcasting
-        if (!data.online) {
-          currentKey = null;
-          if (!offlineMode) goOffline();            // apply the offline state once
-          return;
-        }
-        if (offlineMode) {                          // stream came back — return to live
-          offlineMode = false;
-          setSource(liveSourceUrl, false);
-        }
-        var key = trackKey(data);
-        if (key !== currentKey && (data.artist || data.title)) {
-          currentKey = key;
-          onNewTrack(data, data.art || '');
-        }
-      })
-      .catch(function () {})
+      .then(applyState)
+      // Endpoint unreachable or returned invalid JSON (e.g. a PHP warning before
+      // the JSON): treat as offline so the fallback engages instead of freezing
+      // on the initial online placeholder.
+      .catch(function () { markOffline(); })
       .then(function () { setTimeout(poll, POLL_MS); });
   }