Minuteur, sans l'objet date.
Bonjour,
j'essaie de comprendre le fonctionnement d'un script créant un minuteur qui n'utilise pas l'objet date dans le but de progresser.
Le code est fonctionnel mais je ne comprends pas du tout la première partie(de la ligne 1 à la ligne 4) et ce qui est à l'origine du déclenchement du minuteur dans la fenêtre du navigateur.
var seconds = 600 (ça en faisant des essais je m'aperçois que c'est une valeur qui détermine le temps en seconde du minuteur)
mais la suite là je bloque totalement. Si jamais quelqu'un pourrai me donner un piste je vous en remercie d'avance. =)
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
| <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<title> TIMER 2 </title>
</head>
<body>
<span id="countdown" class="timer"></span>
<script src="timer.js"> </script>
</body>
</html> |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| var seconds = 600; // 10 minutes
function secondPassed(){
var minutes = Math.round((seconds - 30) / 60); // (600- 30) / 60) = 9.5 // math round permet d'arrondir à 10
var remainingSeconds = seconds % 60; //seconde restantes ( 600 modulo 60 = 0)
if(remainingSeconds < 10) {
remainingSeconds = "0" + remainingSeconds;
}
document.getElementById("countdown").innerHTML = + minutes + " minutes" + ":" +remainingSeconds + " secondes";
if(seconds == 0) { // si var seconds = 0 alors le minuteur est terminé et affiche un message.
clearInterval(countdownTimer); // Permet d'annuler une action répétée minutée initiée via un appel à setInterval().
document.getElementById("countdown").innerHTML = "fin du compte à rebours"; // si les secondes sont = 0 alors affiche "fin du compte à rebours"
}else{
seconds --; // si les secondes ne sont pas à zéro alors on décremente.
}
}
var countdownTimer = setInterval('secondPassed()',1000); // / l'interval du décompte est de 1000 millisecondes soit 1 seconde. |
