segundo reproducir pwa plano escuchar como iphone html5 video webkit mobile-safari

iphone - reproducir - video html5 safari



Comportamiento del reproductor de video HTML5 en iPhone y iPod en Safari Web Apps (2)

En el iPhone y iPod, si un video de YouTube está incrustado en una página web, el usuario puede tocar el video y el video comenzará a reproducirse: el reproductor multimedia iOS se desliza y el video se reproduce a pantalla completa en orientación horizontal. Una vez que el video ha terminado de reproducirse, el reproductor multimedia de iOS se desliza hacia afuera, revelando la página web donde se incrustó el video.

Con la etiqueta HTML5 <video> , el usuario puede tocar el video y el video se "acercará" a la pantalla completa y comenzará a reproducirse en cualquiera que sea la orientación actual del dispositivo. Una vez que el video ha terminado de reproducirse, el usuario debe tocar una vez para que aparezcan los controles del reproductor, y luego toque "Listo" para regresar a la página web.

Desafortunadamente, subir mis videos a YouTube no es una opción para esta aplicación, y no he encontrado un reproductor de video HTML5 que regrese al sitio web después de que el video haya terminado de reproducirse. Preferiría que el reproductor de video muestre el mismo comportamiento que los videos incrustados de YouTube o que el video se reproduzca en línea. Es posible UIWebView video en línea en un UIWebView personalizado, pero lamentablemente no es una opción (ya que se trata de una aplicación web, no una aplicación nativa). Además, la propiedad <video> webkit-playsinline no funciona.

¿Hay reproductores de video HTML5 que puedan replicar el comportamiento de video incrustado de YouTube? ¿Me estoy perdiendo algunas soluciones obvias de Javascript? ¿Hay algún método para indicarle a la ventana que el video se terminó de reproducir sin interacción del usuario?

EDITAR:

Gracias a Jan, este problema está resuelto. El código de trabajo sigue, junto con una lista de errores / notas.

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>scratchpad</title> </head> <body> <video id="video"> <source src="movie.mp4" type="video/mp4" /> </video> <script type="text/javascript"> document.getElementById(''video'').addEventListener(''ended'',function(){document.getElementById(''video'').webkitExitFullScreen();},false); </script> </body> </html>

Errores que cometí:
1. Olvidé agregar una identificación en la etiqueta <video> .
2. Pruebas de webkitSupportsFullscreen no podría conseguir que esa propiedad se pruebe como "verdadera". Un comentario en el código en esta publicación en el foro dice:

// note: .webkitSupportsFullscreen is false while the video is loading

pero no pude crear una condición en la que devuelva verdadero.
3. Completamente perdido esta publicación stackoverflow .


Hm, no puedo intentarlo yo mismo ... pero seguro que has visto esto?

http://developer.apple.com/library/safari/#documentation/AudioVideo/Reference/HTMLVideoElementClassReference/HTMLVideoElement/HTMLVideoElement.html#//apple_ref/doc/uid/TP40009356

Por lo tanto, "webkitEnterFullScreen ()" podría ser tu amigo (aunque el documento dice que es de solo lectura):

http://nathanbuskirk.com/?p=1

El video en línea no es posible en ningún dispositivo iOS al lado del iPad (hasta el momento).

De todos modos, puede detectar el final de un video en Javascript utilizando un Escuchador de eventos:

document.getElementById(''video'').addEventListener(''ended'',videoEndListener,false);

Aclamaciones,

Ene


De la documentación de Safari:

"Importante: El método webkitEnterFullscreen () solo se puede invocar en respuesta a una acción del usuario, como hacer clic en un botón. No puede invocar webkitEnterFullscreen () en respuesta a un evento onload (), por ejemplo."

Eso podría explicar por qué tu webkitEnterFullscreen siempre es falso.

http://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/ControllingMediaWithJavaScript/ControllingMediaWithJavaScript.html#//apple_ref/doc/uid/TP40009523-CH3-SW13

La solución de Jan para manejar el evento ''finalizado'' es la mejor en su caso.