bug affichage bouton en fin de lecture

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');
     }