Comportamento del video player HTML5 su iPhone e iPod in Safari Web Apps

Su iPhone e iPod, se un video di YouTube è incorporato in una pagina Web, l’utente può toccare il video e il video inizia a riprodursi – il lettore multimediale iOS scorre e il video viene riprodotto a schermo intero con orientamento orizzontale. Al termine della riproduzione del video, il lettore multimediale iOS torna indietro, rivelando la pagina Web in cui è stato incorporato il video.

Usando il tag HTML5, l’utente può toccare il video e il video “eseguirà lo zoom” a schermo intero e inizierà a suonare in qualunque sia l’orientamento corrente del dispositivo. Una volta che il video ha finito di giocare, l’utente deve toccare una volta per far apparire i controlli del giocatore, e quindi toccare “Fatto” per tornare alla pagina web.

Sfortunatamente, caricare i miei video su YouTube non è un’opzione per questa applicazione e non ho trovato un video player HTML5 che ritorni al sito Web dopo che il video è finito. Preferirei che il video player mostri lo stesso comportamento dei video incorporati di YouTube o che il video sia riprodotto in linea. Forzare video in linea è ansible in un UIWebView personalizzato, ma sfortunatamente non è un’opzione (dato che si tratta di un’app Web, non di un’app nativa). Inoltre, la proprietà webkit-playsinline non funziona.

Esistono lettori video HTML5 in grado di replicare il comportamento dei video di YouTube incorporati? Mi mancano alcune ovvie soluzioni JavaScript? C’è un metodo per dire alla finestra che il video ha finito di giocare senza l’interazione dell’utente?

MODIFICARE:

Grazie a Jan, questo problema è risolto. Segue il codice di lavoro, insieme a un elenco di errori / note.

     scratchpad     document.getElementById('video').addEventListener('ended',function(){document.getElementById('video').webkitExitFullScreen();},false);    

Gli errori che ho fatto:
1. Hai dimenticato di aggiungere un ID nel tag .
2. Test per webkitSupportsFullscreen non ho mai potuto ottenere quella proprietà da verificare come “true”. Un commento nel codice in questo post del forum dice,

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

ma non sono riuscito a creare una condizione in cui è tornato vero.
3. Completamente perso questo post StackOverflow .

Hm, non posso provarlo da solo … ma certo che l’hai visto?

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

Quindi, “webkitEnterFullScreen ()” potrebbe essere tuo amico (anche se il documento dice che è di sola lettura):

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

Il video in linea non è ansible su nessun dispositivo iOS accanto all’iPad (finora).

Ad ogni modo, puoi rilevare la fine di un video in Javascript usando un listener di eventi:

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

Saluti,

Jan

Dalla documentazione di Safari:

“Importante: il metodo webkitEnterFullscreen () può essere richiamato solo in risposta a un’azione dell’utente, ad esempio facendo clic su un pulsante. Ad esempio, non è ansible richiamare webkitEnterFullscreen () in risposta a un evento onload ().”

Questo potrebbe spiegare perché il tuo webkitEnterFullscreen è sempre 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 soluzione di Jan che gestisce l’evento “finito” è la migliore nel tuo caso.