bug affichage bouton en fin de lecture

public/index.html

@@ -16,7 +16,7 @@
     <header>
         <div style="display: flex; gap: 10px; align-items: center;">
             <button class="stop-all" onclick="stopAll()">🛑 STOP ALL</button>
-            <span id="app-version" style="color: #555; font-size: 0.8rem; margin-left: 10px;">v1.212</span>
+            <span id="app-version" style="color: #555; font-size: 0.8rem; margin-left: 10px;">v1.213</span>
             
             <button id="installBtn" style="display:none; ...">📥 INSTALLER</button>
         </div>

public/script.js

@@ -256,13 +256,14 @@ async function playSound(i) {
 
     const btnElement = document.getElementById(`btn-${i}`);
 
+    // Si déjà en lecture : on arrête
     if (players[i] && !players[i].paused) {
         players[i].pause();
         players[i].currentTime = 0;
         btnElement.classList.remove('playing');
         btnElement.style.setProperty('--progress', '0%');
     } else {
-        // Si le player n'existe pas, on récupère le fichier dans IndexedDB
+        // Si le player n'existe pas ou a été supprimé, on le crée
         if (!players[i]) {
             const fileData = await getSound(`sound-${i}`);
             if (!fileData) return;
@@ -272,7 +273,21 @@ async function playSound(i) {
         players[i].loop = data.loop;
         players[i].volume = data.volume || 1;
         
-        // ... (votre logique de ontimeupdate et play reste la même)
+        // Gestion de la progression
+        players[i].ontimeupdate = () => {
+            const percentage = (players[i].currentTime / players[i].duration) * 100;
+            btnElement.style.setProperty('--progress', `${percentage}%`);
+        };
+
+        // --- CORRECTION ICI : Gestion de la fin de lecture ---
+        players[i].onended = () => {
+            btnElement.style.setProperty('--progress', '0%');
+            // On ne retire la classe que si on n'est pas en boucle
+            if (!data.loop) {
+                btnElement.classList.remove('playing');
+            }
+        };
+
         players[i].play();
         btnElement.classList.add('playing');
     }

public/sw.js

@@ -1,4 +1,4 @@
-const CACHE_NAME = 'sb-v1.212'; // Change ce numéro pour forcer une mise à jour globale
+const CACHE_NAME = 'sb-v1.213'; // Change ce numéro pour forcer une mise à jour globale
 const ASSETS = [
   './', // Racine
   './index.html',