update for soundboard with global soundfiles

static/js/app.js

@@ -307,6 +307,47 @@ document.addEventListener('DOMContentLoaded', () => {
   }
 }
 
+// ── Soundboard Buttons ─────────────────────────────────────────────────────
+document.querySelectorAll('.play-sound-btn').forEach(btn => {
+  btn.addEventListener('click', async () => {
+    const soundId = btn.dataset.soundId;
+    btn.disabled = true;
+    const originalText = btn.innerHTML;
+    btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span> Spielt...';
+
+    try {
+      const res = await fetch('/api/play_sound', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ sound_id: soundId })
+      });
+
+      const data = await res.json();
+
+      if (data.success) {
+        btn.classList.remove('btn-outline-primary', 'btn-outline-secondary');
+        btn.classList.add('btn-success');
+        btn.innerHTML = '<i class="bi bi-check-lg me-2"></i> Gespielt';
+        setTimeout(() => {
+          btn.classList.remove('btn-success');
+          btn.classList.add('btn-outline-primary'); // oder secondary
+          btn.innerHTML = originalText;
+          btn.disabled = false;
+        }, 2000);
+      } else {
+        alert('Fehler: ' + (data.message || 'Unbekannt'));
+        btn.disabled = false;
+        btn.innerHTML = originalText;
+      }
+    } catch (err) {
+      console.error('Sound-Play-Fehler:', err);
+      alert('Netzwerkfehler beim Abspielen');
+      btn.disabled = false;
+      btn.innerHTML = originalText;
+    }
+  });
+});
+
   // Initialer Status
   updateStatus(false);