feat: dodanie trybu zapętlania całej kolejki (playlisty) w Discord (/loopplaylist) i w dashboardzie web

static/app.js

@@ -28,6 +28,7 @@ const playPauseIcon = document.getElementById('play-pause-icon');
 const btnSkip = document.getElementById('btn-skip');
 const btnStop = document.getElementById('btn-stop');
 const btnLoop = document.getElementById('btn-loop');
+const btnLoopPlaylist = document.getElementById('btn-loop-playlist');
 const vinylRecord = document.getElementById('vinyl-record');
 const musicWave = document.getElementById('music-wave');
 const volumeSlider = document.getElementById('volume-slider');
@@ -138,6 +139,9 @@ function bindEvents() {
     btnSkip.addEventListener('click', skipTrack);
     btnStop.addEventListener('click', stopPlayback);
     btnLoop.addEventListener('click', toggleLoop);
+    if (btnLoopPlaylist) {
+        btnLoopPlaylist.addEventListener('click', toggleLoopPlaylist);
+    }
     
     // Volume slider
     volumeSlider.addEventListener('input', (e) => {
@@ -385,9 +389,25 @@ function updateUI(status) {
     if (status.loop_single) {
         loopBadge.style.display = 'flex';
         btnLoop.classList.add('active');
+        btnLoop.style.background = 'var(--primary)';
+        btnLoop.style.color = 'var(--bg-card)';
     } else {
         loopBadge.style.display = 'none';
         btnLoop.classList.remove('active');
+        btnLoop.style.background = '';
+        btnLoop.style.color = '';
+    }
+
+    if (btnLoopPlaylist) {
+        if (status.loop_playlist) {
+            btnLoopPlaylist.classList.add('active');
+            btnLoopPlaylist.style.background = 'var(--primary)';
+            btnLoopPlaylist.style.color = 'var(--bg-card)';
+        } else {
+            btnLoopPlaylist.classList.remove('active');
+            btnLoopPlaylist.style.background = '';
+            btnLoopPlaylist.style.color = '';
+        }
     }
     
     // 6. Queue render (if not currently dragging)
@@ -707,6 +727,18 @@ async function toggleLoop() {
     }
 }
 
+// Toggle Playlist Loop State
+async function toggleLoopPlaylist() {
+    try {
+        const res = await fetch('/api/loop_playlist', { method: 'POST' });
+        const data = await res.json();
+        if (!res.ok) throw new Error(data.detail || 'Błąd zapętlania');
+        showToast(data.loop_playlist ? 'Włączono zapętlanie całej kolejki (playlisty)!' : 'Wyłączono zapętlanie kolejki.', 'info');
+    } catch (err) {
+        showToast('Nie udało się zmienić trybu zapętlania', 'error');
+    }
+}
+
 // Set Volume
 async function setVolume(vol) {
     try {

static/index.html

@@ -118,6 +118,9 @@
                         <button class="btn-icon btn-secondary" id="btn-loop" title="Zapętl ten utwór">
                             <i data-lucide="repeat-1"></i>
                         </button>
+                        <button class="btn-icon btn-secondary" id="btn-loop-playlist" title="Zapętlij całą kolejkę (tryb playlisty)">
+                            <i data-lucide="repeat"></i>
+                        </button>
                     </div>
 
                     <!-- Volume Control -->