From 9e08079decbcce1c497e75d3d3df11e998d45c77 Mon Sep 17 00:00:00 2001
From: marwin <marwin@creamfresh.xyz>
Date: Sun, 22 Mar 2026 10:39:43 +0100
Subject: [PATCH] Fix stream player autoplay: handle blocked play() promise

window.open() doesn't transfer the user gesture to the new tab, so autoplay
is blocked. Previously play().catch(()=>{}) swallowed the error silently while
setting playing=true, leaving the UI in a broken state.

Now: if play() rejects, reset state and show "Click Play to start". The user's
click on the Play button IS a user gesture, so it succeeds on the second attempt.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 templates/radio/stream_player.html | 36 +++++++++++++++++-------------
 1 file changed, 21 insertions(+), 15 deletions(-)

diff --git a/templates/radio/stream_player.html b/templates/radio/stream_player.html
index 6b270d1..7c80b9a 100644
--- a/templates/radio/stream_player.html
+++ b/templates/radio/stream_player.html
@@ -118,22 +118,28 @@
     function startPlay() {
       audio.src = streamUrl;
       setVol(parseInt(slider.value, 10));
-      audio.play().catch(() => {});
-      playing = true;
-      playBtn.innerHTML = '&#9646;&#9646; Stop';
+      audio.play().then(() => {
+        playing = true;
+        playBtn.innerHTML = '&#9646;&#9646; Stop';
 
-      // SSE metadata
-      if (sse) sse.close();
-      sse = new EventSource('/radio/sse/?url=' + encodeURIComponent(streamUrl));
-      sse.onmessage = e => {
-        try {
-          const data = JSON.parse(e.data);
-          if (data.track) {
-            document.getElementById('track-name').textContent = data.track;
-            document.title = data.track + ' — ' + stationName;
-          }
-        } catch (_) {}
-      };
+        if (sse) sse.close();
+        sse = new EventSource('/radio/sse/?url=' + encodeURIComponent(streamUrl));
+        sse.onmessage = e => {
+          try {
+            const data = JSON.parse(e.data);
+            if (data.track) {
+              document.getElementById('track-name').textContent = data.track;
+              document.title = data.track + ' — ' + stationName;
+            }
+          } catch (_) {}
+        };
+      }).catch(() => {
+        // Autoplay blocked — reset state, prompt user to click
+        playing = false;
+        audio.src = '';
+        playBtn.innerHTML = '&#9654; Play';
+        document.getElementById('track-name').textContent = 'Click Play to start';
+      });
     }
 
     function stopPlay() {