From d5e4e4d927fd81f2da89a84d3053e9fe58b839e9 Mon Sep 17 00:00:00 2001
From: ChrisChrome <chris@chrischro.me>
Date: Thu, 14 May 2026 13:46:19 -0600
Subject: [PATCH] Feat: Web player auto connect Add a simple 5 second countdown
 to the web player to get a code without interacting (for systems where
 interaction is a hassle, or impossible)

---
 server/player/index.html | 51 +++++++++++++++++++++++++++++++---------
 1 file changed, 40 insertions(+), 11 deletions(-)

diff --git a/server/player/index.html b/server/player/index.html
index 6ba350e..d17ca6b 100644
--- a/server/player/index.html
+++ b/server/player/index.html
@@ -364,6 +364,20 @@
     }
 
     // ==================== Boot ====================
+
+    // Function used by connect button and auto-connect
+    function connectBtnFunc() {
+    unlockAudio();
+      const url = document.getElementById('serverUrl').value.trim().replace(/\/$/, '');
+      if (!url) return;
+      config.serverUrl = url;
+      saveConfig(config);
+      document.getElementById('connectBtn').disabled = true;
+      document.getElementById('setupSpinner').style.display = 'block';
+      document.getElementById('setupStatus').textContent = 'Connecting...';
+      connect(url);
+    };
+
     // Auto-detect server URL from origin since player is served from the same server
     if (!config.serverUrl) {
       config.serverUrl = window.location.origin;
@@ -411,6 +425,31 @@
           }
         }, 5000);
       }
+    } else {
+      // Auto-Continue after 5s if not configured. If user interacts with form (typing in the box), stop the timer.
+      
+      let countdown = 5;
+      const connectBtn = document.getElementById('connectBtn');
+
+      connectBtn.textContent = `${_t('connect')} (${countdown})`;
+
+      const autoContinueTimer = setInterval(() => {
+        countdown--;
+        if (countdown > 0) {
+          connectBtn.textContent = `${_t('connect')} (${countdown})`;
+        } else {
+          clearInterval(autoContinueTimer);
+          connectBtn.textContent = _t('connect');
+          connectBtnFunc()
+        }
+      }, 1000);
+
+      document.getElementById('serverUrl').addEventListener('input', () => {
+        if (countdown > 0) {
+          clearInterval(autoContinueTimer);
+          connectBtn.textContent = _t('connect');
+        }
+      });
     }
 
     // ==================== Setup UI ====================
@@ -445,17 +484,7 @@
       } catch (e) { console.warn('YT unmute failed:', e); }
     }
 
-    document.getElementById('connectBtn').onclick = () => {
-      unlockAudio();
-      const url = document.getElementById('serverUrl').value.trim().replace(/\/$/, '');
-      if (!url) return;
-      config.serverUrl = url;
-      saveConfig(config);
-      document.getElementById('connectBtn').disabled = true;
-      document.getElementById('setupSpinner').style.display = 'block';
-      document.getElementById('setupStatus').textContent = 'Connecting...';
-      connect(url);
-    };
+    document.getElementById('connectBtn').onclick = connectBtnFunc;
 
     // ==================== Socket Connection ====================
     function connect(serverUrl) {