Pauses régulières sur une vidéo HTML5, événements de l'élément vidéo

Bonjour à tous je suis débutant en javascript et j'ai récupéré un code qui fonctionne mais que j'aimerai améliorer. Il permet de lire une vidéo et de faire en sorte qu'elle se mette en pause pendant un certains temps puis qu'elle reprenne sa lecture... Actuellement le code met la vidéo 5 fois en pause mais lorsqu'elle se termine et se remet en boucle le script ne fonctionne plus. J'aimerai que ma vidéo se relance et que je ne sorte pas de la boucle. Ma vidéo ne dure que 9 secondes... Merci à l'avance pour votre aide.
Voici ma boucle:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

var myvideo = document.getElementById('myvideo'), var time = [1,3,5,7,9,11]; var bools = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false]; myvideo.addEventListener("timeupdate", function() { for (i = 0; i <= 100; i++) { if(this.currentTime >= time[i] && bools[i] == false) { this.pause();     setTimeout(function(){ myvideo.play(); playbutton.style.visibility = "hidden"; }, 1000); bools[i] = true;   } }   });

---

C'est un peu curieux cette boucle faite 100 fois avec une liste de 25 booléens "false", le tout pour faire 6 pauses. Il va falloir se décider sur le nombre :mrgreen:

Essaie ça:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

var myvideo = document.getElementById('myvideo'); var time = [1,3,5,7,9,11]; var bools = []; myvideo.addEventListener("timeupdate", function() { for (var i = 0; i <= time.length; i++) { if(myvideo.currentTime >= time[i] && !bools[i]) { myvideo.pause();   setTimeout(function(){ myvideo.play(); playbutton.style.visibility = "hidden"; }, 1000); bools[i] = true; } }   });   myvideo.addEventListener("ended", function() { bools = []; // quand la vidéo est finie, on réinitialise la liste des passages déjà mis en pause });

---

Là je réinitialise quand la vidéo a fini d'être lue (événement "ended"). Tu souhaites peut-être avoir un autre comportement, par exemple quand on repositionne le curseur sur la ligne de temps de la vidéo (évènement "seeked").

Tu as la liste des événements disponibles en bas de cette page: https://developer.mozilla.org/fr/doc...video_en_HTML5

Merci beaucoup:lol:. ça marche de cette manière:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

var time = [1,3,5,7]; /*This array holds the times at which the video has to stop. The time is in seconds.*/ var bools = [false, false, false, false, false]; /*This holds the boolean for when the time has passed.*/ myvideo.addEventListener("timeupdate", function() { for (i = 0; i <= time.length; i++) /*The for loop to check for the conditions. 21 stops total*/ { if(this.currentTime >= time[i] && bools[i] == false) { this.pause(); console.log("ok") if (myvideo.paused) { playbutton.style.visibility = "visible";   }   myvideo.addEventListener("click", function () {myvideo.play()}); setTimeout(function(){ myvideo.play(); playbutton.style.visibility = "hidden"; }, 1000); bools[i] = true;     } }   });   myvideo.addEventListener("seeked", function(){ bools = [false, false, false, false]; // quand la vidéo est finie, on réinitialise la liste des passages déjà mis en pause });

---

J'adore le

Code:

---

var bools = [false, false, false, false, false];

---

:ptdr:

Je suis preneur si une meilleur solution existe. Malheureusement il n' y a qu'avec ces "false" que le code fonctionne...

Ça m'intéresse de savoir qu'est-ce qui n'allait pas dans mon code. En dehors de changer l'event "ended" par "seeked" comme suggéré.