Warning: Parameter 1 to wp_default_scripts() expected to be a reference, value given in /home/crian734/public_html/blog.kolaborativa/wp-includes/plugin.php on line 601

Warning: Parameter 1 to wp_default_styles() expected to be a reference, value given in /home/crian734/public_html/blog.kolaborativa/wp-includes/plugin.php on line 601
Novos eventos de mídia no HTML5 - Kolaborativa

Novos eventos de mídia no HTML5

Bem pessoal, como prometido, trago agora os novos eventos de mídia compatíveis com o HTML5. Não são todos, ainda faltam alguns. Porém, os que estão aqui foram devidamente testados por mim. Há também propriedades que não tinha falado antes. Veja o exemplo abaixo:
.
.
.
.
.
.
.
.











Volume

Barra de tempo

Barra de buffer



Informações do vídeo

O vídeo começou a carregar
O vídeo teve seus metadados carregados
O vídeo foi carregado

O vídeo está pronto para tocar
O vídeo tocará sem interrupção de buffer
O vídeo tem o seu carregamento paralizado

O vídeo está tocando
O vídeo está pausado
O vídeo está na espera
Acabou o vídeo

Situação da internet

Situação do arquivo

Situação do erro do arquivo

Novos eventos:

oncanplay: Script para ser executado quando a mídia está pronta para começar a tocar (quando se tem buffer o suficiente para começar).
oncanplaythrough: Script para ser executado quando a mídia pode ser executada até o fim sem pausa para buffer.
onended: Script para ser executado quando a mídia chega ao fim.
onerror: Script para ser executado quando um erro ocorre ao carregar o arquivo de mídia.
onloadeddata: Script para ser executado assim que os dados de mídia forem lidos.
onloadedmetadata: Script para ser executado assim que os metadados (como dimensão e duração) de mídia forem lidos.
onloadstart: Script para ser executado assim que a mídia começa a ser carregada.
onpause: Script para ser executado quando a mídia é pausada pelo usuário ou por programa.
onplay: Script para ser executado assim que o usuário começa a tocar a mídia.
onplaying: Script para ser executado quando a mídia começou a tocar.
onprogress: Script para ser executado quando o navegador está em processo de obter os dados de mídia.
onstalled: Script para ser executado quando o navegador não é capaz de buscar os dados de mídia por qualquer motivo.
ontimeupdate: Script para ser executado quando a posição de reprodução muda.
onvolumechange: Script para ser executado assim que o volume muda (incluindo coloca-lo no “mute”).
onwaiting: Script para ser executado quando a mídia pausa para buscar mais dados.

Novos métodos:

play(): Executa o arquivo de mídia.
pause(): Pausa o arquivo de mídia.
webkitEnterFullScreen(): Coloca o vídeo em tela cheia. Funciona somente no Chrome.

Novas propriedades:

volume: Define o volume da mídia. Seu valor padrão é 1.
muted: Define se a mídia está no modo mudo ou não.
duration: Define o tempo total de duração da mídia, em milisegundos.
currentTime: Define o tempo transcorrido da mídia, em milisegundos.
height: Altura em pixels da mídia.
width: Comprimento em pixels da mídia.
src: URL onde a mídia está localizada.
buffered: Define o buffer da mídia. Possui os métodos start() e end() (serão explicados em outro post).
networkState: informa estado da rede em relação ao carregamento do vídeo. É definida pelos seguintes valores:
1) Ainda não inicializado.
2) Rede não está sendo usado agora (vídeo está completamente carregado, por exemplo).
3) Navegador está carregando dados da rede.
4) Dados foram carregados.
5) Recurso de vídeo não pôde ser encontrado / carregado.
readyState: informa estado da mídia. É definida pelos seguintes valores:
1) Não há dados disponíveis.
2) Duração e dimensões estão disponíveis.
3) Os dados para a posição atual estão disponíveis.
4) Os dados para a posição atual e futura estão disponíveis para que a reprodução possa começar.
5) Dados suficientes para reproduzir o vídeo completo estão disponíveis.
error: informa o erro, caso ocorra. É definida pelos seguintes valores:
1) Usuário abortou a reprodução do vídeo.
2) Erro na rede (não pode ler a stream).
3) Erro de decodificação, o vídeo está quebrado ou o codec tem problemas.
4) O formato não é suportado.

Analisem o código e, caso tenham alguma dúvida, não esqueçam de comentar.

Confira aqui o Tutorial Completo HTML5 2012

Author Description

dukountra

Nenhum comentário ainda.

Join the Conversation