From d5e4e4d927fd81f2da89a84d3053e9fe58b839e9 Mon Sep 17 00:00:00 2001 From: ChrisChrome Date: Thu, 14 May 2026 13:46:19 -0600 Subject: [PATCH 1/2] 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) { From f6ef75549b72c483a1e1bec7d5fbe2b1d36a9467 Mon Sep 17 00:00:00 2001 From: ChrisChrome Date: Thu, 14 May 2026 14:54:17 -0600 Subject: [PATCH 2/2] Fix possible race condition in player auto-connect --- server/player/index.html | 28 +++++++++++++++++----------- 1 file changed, 17 insertions(+), 11 deletions(-) diff --git a/server/player/index.html b/server/player/index.html index bc3e9ab..9749ba3 100644 --- a/server/player/index.html +++ b/server/player/index.html @@ -366,17 +366,23 @@ // ==================== Boot ==================== // Function used by connect button and auto-connect + let autoContinueTimer; 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); - }; + if (autoContinueTimer) { + clearInterval(autoContinueTimer); + autoContinueTimer = null; + document.getElementById('connectBtn').textContent = _t('connect'); + } + 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) { @@ -433,7 +439,7 @@ connectBtn.textContent = `${_t('connect')} (${countdown})`; - const autoContinueTimer = setInterval(() => { + autoContinueTimer = setInterval(() => { countdown--; if (countdown > 0) { connectBtn.textContent = `${_t('connect')} (${countdown})`;