Mantén la atención porque en esta sección hallarás la respuesta que buscas.
Solución:
Este es un comienzo rápido e improvisado de una solución que al menos debería orientarlo en la dirección correcta. Esto le brinda un singleton con un método de inicio que, cuando se llama, configura un predesplazamiento en un elemento de video en particular.
var adManager = function ()
var vid = document.getElementById("myVid"),
adSrc = "videos/epic_rap_battles_of_history_16_adolf_hitler_vs_darth_vader_2_1280x720.mp4",
src;
var adEnded = function ()
vid.removeEventListener("ended", adEnded, false);
vid.src = src;
vid.load();
vid.play();
;
return
init: function ()
src = vid.src;
vid.src = adSrc;
vid.load();
vid.addEventListener("ended", adEnded, false);
;
();
Sin embargo, hay una serie de cosas que no se tratan aquí. Por ejemplo, si configura el método init para que se llame cuando comience a reproducir el video, deberá mantener una marca que indique si se está reproduciendo un anuncio para que el controlador de reproducción no haga nada cuando esté en la transición de el anuncio al contenido (que requiere un evento de “reproducción” después de la llamada de carga () para obtener una reproducción perfecta).
Usamos algo similar en nuestro proyecto de reproducción de video, y la mayoría de los servicios de anuncios de video hacen algo como esto para la reproducción de video basada en HTML (a diferencia de la reproducción de video Flash).
Es relativamente sencillo, pero solo debe asegurarse de realizar un seguimiento de cuándo se deben activar las devoluciones de llamada de eventos y cuándo agregar y eliminar esas devoluciones de llamada.
Otra cosa a considerar es la falta de fiabilidad del evento “terminado”. Todavía no he descubierto cuándo y en qué plataformas se dispara constantemente, pero es un problema bastante conocido. Una posible solución es usar “timeupdate” en su lugar y probar si la propiedad “currentTime” está en algún lugar alrededor de un segundo menos que la propiedad “duration” para que sepa que está justo al final del video.
Lo siento, no puedo probar este código en este momento, pero en teoría debería funcionar.
Es posible que desee ver lo que puede hacer Popcorn.js. Te permite interactuar con video Html5 y texto superpuesto y muchas otras cosas geniales:
http://popcornjs.org/documentación
Si posees alguna indecisión o capacidad de avanzar nuestro sección puedes ejecutar una interpretación y con gusto lo observaremos.