Audio e video - HTML5 con CSS e JavaScript - page 192

// NETWORK_NO_SOURCE
if (e.target.networkState == e.target.NETWORK_LOADING)
document.getElementById('time').innerHTML = "Caricamen-
to...";
}
function videoStateChanged(e) {
// HAVE_NOTHING
// HAVE_METADATA
// HAVE_CURRENT_DATA
// HAVE_FUTURE_DATA
// HAVE_ENOUGH_DATA
if (e.target.readyState == e.target.HAVE_ENOUGH_DATA)
document.getElementById('time').innerHTML = "Pronto";
if (e.target.paused)
document.getElementById("play").innerHTML = "Play";
else
document.getElementById("play").innerHTML = "Pausa";
}
Nelle due funzioni ci limitiamo a controllare le proprietà e a indicare, attraverso lo span
con ID time , se è in corso il caricamento o se il video è pronto per la riproduzione. Dentro
al codice, nei commenti, sono indicate le costanti che networkState e readyState
possono assumere, così da poter gestire tutte le fasi del caricamento.
Un altro evento fondamentale da intercettare è error , scatenato nel caso ci siano pro-
blemi nel caricamento del contenuto multimediale, nella decodifica o nella riproduzione.
Tramite la proprietà error possiamo, anche in questo caso, controllare le costanti e in-
formare l'utente dell'errore. Nell'esempio 9.9 possiamo vedere la funzione che intercetta
l'evento e mostra l'errore.
Esempio 9.9
// Evento di errore
video.addEventListener("error", videoError, false);
function videoError(e) {