Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Jonathan Cutrim Lacerda

Saber se um video do Youtube terminou

Recommended Posts

Eae galera blz?
Então, sou novo por aqui, e tenho uma dúvida.
Eu tenho um projeto que é o seguinte.
Tem uma pagina que tem o video do youtube, só que o cliente quer que quando acabe o video, no lugar dele entre um carrousel de imagens.
O meu problema é o seguinte, como faço via, jquery/javascript, saber quando o video terminou?

valeuu!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Nem imagino, mas tenho uma teoria de que talvez você consiga fazer isso com Flash, por criar um filme que sirva de contêiner para o filme principal, que contém o vídeo.

 

Não sou programador ActionScript e o que faço é pura especulação, mas imagino que desa forma o filme-contêiner tenha como saber se outro filme completou ou não sei ciclo de vida.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Veja este link, já usei e funcionou.

 

https://developers.google.com/youtube/js_api_reference?hl=pt-br

 

Procure por essa parte:

player.getPlayerState():Number
Retorna o estado do player. Os possíveis valores são não iniciado (-1), encerrado (0), em reprodução (1), pausado (2), armazenando em buffer (3), vídeo indicado (5).

 

O meu caso foi o seguinte, eu tinha que fazer com que, quando o player estivesse ativo (ou seja, na função 'tocando') ele tinha que abaixar o volume de um player em javascript.

 

Você pode ver um exemplo funcionando no link: http://opcaoimoveis-es.com.br/index2.php.

Aguarde a página carregar e dê play no vídeo, você ira perceber que, quado está tocando o volume da musica abaixa.

E quando está parado a musica sobe.

 

Então o meu código fico assim:

 

HTML:

<div class="manhattan">

  <script src="js/elements/swfobject.js"></script>
   <div class="youtube">
     <div id="ytmhtplayer"></div>    	
   </div>
        
</div>

JAVASCRIPT:

<script>
    var params = {
        allowScriptAccess: "always"
    };
	
    var atts = {
        id: "ytmhtplayer"
    };
	
    swfobject.embedSWF("http://www.youtube.com/watch?v=f9NuxUIwO7k?rel=0&fs=0&showinfo=0&wmode=transparent&enablejsapi=1&playerapiid=ytplayer","ytmhtplayer", "100%", "100%", "8", null, null, params, atts);

    function onYouTubePlayerReady(playerId) {
        ytplayer = document.getElementById("ytmhtplayer");
        ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
    }

    function onytplayerStateChange(newState) {
        if(newState == 1 || newState == 2 || newState == 3){
			alert('O player está tocando');
        } else {
			alert('O player está parado ou o video terminou');
		}
		
    }
</script>

Ali onde está 'swfobject.embedSWF("http://www.youtube.com/watch?v=f9NuxUIwO7k?' troque pelo id do vídeo que deseja.

 

Agora o estado de finalizado, como a própria API diz é o estado '0', então os if's de verificação devem ficar assim:

 

function onytplayerStateChange(newState) {
        if(newState == 0){
		alert('O video foi encerrado');
        } else {
		alert('O player está ativo');
	}		
    }

IMPORTANTE!

Você deve linkar o arquivo swfobject.js para a sua página, pra API funcionar, você pode baixar a versão atualizada nesse link:

 

https://code.google.com/p/swfobject/downloads/detail?name=swfobject_2_2.zip

 

É isso amigo, boa sorte.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.