Untitled
// Temps total (30 minutes) en secondes const TOTAL_TIME = 30 * 60; let remainingTime = TOTAL_TIME; // Sélection de l'élément timer et du cercle de progression const timerElement = document.getElementById("timer"); const circleProgress = document.querySelector(".circle-progress"); // Vérification que l'élément existe if (timerElement && circleProgress) { // Mettre à jour l'affichage du timer function updateTimer() { // Si le temps est écoulé, arrêter le chronomètre if (remainingTime <= 0) { clearInterval(timerInterval); timerElement.textContent = "00:00:00"; circleProgress.style.strokeDashoffset = "0"; // Cercle entièrement rempli return; } // Calculer les minutes et secondes restantes const minutes = Math.floor(remainingTime / 60); const seconds = remainingTime % 60; // Formater les minutes et secondes en ajoutant des zéros au besoin const formattedMinutes = String(minutes).padStart(2, "0"); const formattedSeconds = String(seconds).padStart(2, "0"); // Mettre à jour l'affichage du timer timerElement.textContent = `00:${formattedMinutes}:${formattedSeconds}`; // Mettre à jour le cercle de progression const progress = (remainingTime / TOTAL_TIME) * 113; // Proportion du cercle circleProgress.style.strokeDashoffset = progress; // Décrémenter le temps restant remainingTime--; } // Mettre à jour le timer toutes les secondes const timerInterval = setInterval(updateTimer, 1000); // Initialiser l'affichage immédiatement updateTimer(); } else { console.error("Erreur : L'élément avec l'ID 'timer' ou le cercle de progression est introuvable dans le DOM."); }
Leave a Comment