diff --git a/static/js/ui-soundboard.js b/static/js/ui-soundboard.js
index 6387319..d775f4b 100644
--- a/static/js/ui-soundboard.js
+++ b/static/js/ui-soundboard.js
@@ -2,6 +2,7 @@
// Verantwortlich für: Soundboard-Buttons, Play/Stop, Volume-Regler
let currentSoundButton = null; // welcher Button gerade spielt (für optisches Feedback)
+let currentResetTimer = null; // Timer zum automatischen Rücksetzen der UI
// Initialisierung – wird von app.js aufgerufen
function initSoundboard() {
@@ -39,16 +40,31 @@ function initSoundboard() {
}
// ── Play-Buttons ───────────────────────────────────────────────────────────
- document.querySelectorAll('.play-sound-btn').forEach(btn => {
+ const playButtons = document.querySelectorAll('.play-sound-btn');
+
+ const resetButtonUI = (btn) => {
+ if (!btn) return;
+ btn.classList.remove('btn-success');
+ btn.classList.add('btn-outline-primary', 'btn-outline-secondary');
+ btn.innerHTML = btn.dataset.originalText || ' Abspielen';
+ btn.disabled = false;
+ };
+
+ const clearCurrentTimer = () => {
+ if (currentResetTimer) {
+ clearTimeout(currentResetTimer);
+ currentResetTimer = null;
+ }
+ };
+
+ playButtons.forEach(btn => {
btn.addEventListener('click', async () => {
const soundId = btn.dataset.soundId;
// Alten Play-Button zurücksetzen
if (currentSoundButton && currentSoundButton !== btn) {
- currentSoundButton.classList.remove('btn-success');
- currentSoundButton.classList.add('btn-outline-primary', 'btn-outline-secondary');
- currentSoundButton.innerHTML = currentSoundButton.dataset.originalText || ' Abspielen';
- currentSoundButton.disabled = false;
+ clearCurrentTimer();
+ resetButtonUI(currentSoundButton);
}
// Neuen Button markieren
@@ -72,25 +88,22 @@ function initSoundboard() {
btn.innerHTML = ' Gespielt';
currentSoundButton = btn;
- // Optional: Automatisch nach 3–5 Sekunden zurücksetzen
- setTimeout(() => {
+ clearCurrentTimer();
+ // Automatisches Reset nach maximal 15s, falls Track serverseitig stoppt
+ currentResetTimer = setTimeout(() => {
if (currentSoundButton === btn) {
- btn.classList.remove('btn-success');
- btn.classList.add('btn-outline-primary');
- btn.innerHTML = originalText;
- btn.disabled = false;
+ resetButtonUI(btn);
+ currentSoundButton = null;
}
- }, 4000); // 4 Sekunden – anpassbar
+ }, 15000);
} else {
alert('Fehler beim Abspielen:\n' + (data.message || 'Unbekannt'));
- btn.innerHTML = originalText;
- btn.disabled = false;
+ resetButtonUI(btn);
}
} catch (err) {
console.error('Sound-Play-Fehler:', err);
alert('Netzwerkfehler beim Abspielen');
- btn.innerHTML = originalText;
- btn.disabled = false;
+ resetButtonUI(btn);
}
});
});
@@ -109,10 +122,8 @@ function initSoundboard() {
if (data.success) {
// Visuelles Feedback: aktuellen Play-Button zurücksetzen
if (currentSoundButton) {
- currentSoundButton.classList.remove('btn-success');
- currentSoundButton.classList.add('btn-outline-primary', 'btn-outline-secondary');
- currentSoundButton.innerHTML = currentSoundButton.dataset.originalText || ' Abspielen';
- currentSoundButton.disabled = false;
+ clearCurrentTimer();
+ resetButtonUI(currentSoundButton);
currentSoundButton = null;
}
@@ -132,4 +143,4 @@ function initSoundboard() {
}
// Export für app.js
-window.initSoundboard = initSoundboard;
\ No newline at end of file
+window.initSoundboard = initSoundboard;