Video js

[quieropaginaweb]

Hola compañeros, muchas gracias por leer el post, tengo una duda, como puedo hacer que cuando acabe de reproducir un video pase a reproducir otro video que es el principal?

Tengo este código

Código HTML:

<figure id="video_player">


	<video controls autoplay poster="video1.jpg">
		<source src="./videos/principal.mp4" type="video/mp4">
		
	</video>
	<figcaption>
		<a href="./videos/video1.mp4"><img src="video1.jpg" alt="Video 1"></a>
		<a href="./videos/video2.mp4"><img src="video2.jpg" alt="Video 2"></a>
		<a href="./videos/video3.mp4"><img src="video3.jpg" alt="Video 3"></a>
		<a href="./videos/video3.mp4"><img src="vide4.jpg" alt="Video 4"></a>
	</figcaption>
</figure>


<script>
var video_player = document.getElementById("video_player"); 
var links = video_player.getElementsByTagName('a');
var t;
for (var i=0; i<links.length; i++) { 
	links[i].onclick = handler; 
}

function handler(e) { 
	e.preventDefault();
	videotarget = this.getAttribute("href");
	filename = videotarget.substr(0, videotarget.lastIndexOf('.')) || videotarget;
	video = document.querySelector("#video_player video");
	video.removeAttribute("controls");
	video.setAttribute("poster","/assets/images/video-placeholder.png");
	source = document.querySelectorAll("#video_player video source");
	source[0].src = filename + ".mp4";
	source[1].src = filename + ".webm";
	video.load();
	video.play();	
}


</script> 

Muchas gracias

[Alexis88]

Con el evento ended puedes detectar el fin de la reproducción de un vídeo. Lo único que necesitarías sería tener el vídeo principal almacenado en alguna variable global (porque en la función lo reemplazas por el vídeo seleccionado) y lo restableces como principal al terminar la reproducción de cualquiera de los otros vídeos. Para mayor seguridad, podrías hacer una comparación entre el nombre del vídeo actual y el principal.

[quieropaginaweb]

Muchas gracias, me ha funcionado perfectamente.
He incluido esto

Código HTML:

document.getElementById('principal').addEventListener('ended', function(e) {

        document.getElementById("mp4_src").src = "./videos/principal.mp4";
        document.getElementById("principal").load();
    })

Así cuando termina cada video salta al principal.

Saludos
Carlos