-
-
Save andrebian/14777f6c56cc00333dc69849042650e2 to your computer and use it in GitHub Desktop.
<div id="player" data-video-id="ZZ5LpwO-An4"></div> | |
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> | |
<script type="text/javascript"> | |
var tag = document.createElement('script'); | |
var firstScriptTag = document.getElementsByTagName('script')[0]; | |
// O container do video | |
var playerDiv = $('#player'); | |
// inicializando o player | |
var player; | |
var videoDuration = 0; | |
// inicializando o contador do tempo do video | |
var videotime = 0; | |
// inicializando intervalo | |
var interval = null; | |
var lyrics = { | |
2: 'And so I cry sometimes When I\'m lying in bed just to get it all out', | |
7: 'What\'s in my head', | |
10: 'And I, I am feeling a little peculiar', | |
16: 'And so I wake in the morning', | |
18: 'And I step outside', | |
19: 'And I take a deep breath and I get real high', | |
23: 'And I scream from the top of my lungs', | |
25: 'What\'s going on?', | |
29: 'And I say, hey yeah yeah, hey yeah yeah', | |
36: 'I said hey, what\'s going on?', | |
43: 'And I say, hey yeah yeah, hey yeah yeah', | |
49: 'I said hey, what\'s going on?', | |
57: 'And he tries, oh my god do I try', | |
62: 'I try all the time, in this institution', | |
70: 'And heeeee prays, oh my god do I pray', | |
76: 'I pray every single day', | |
80: 'For a revolution', | |
85: 'And I say, hey yeah yeah, hey yeah yeah', | |
91: 'I said hey, what\'s going on?', | |
100: 'Chega... dá trabalho demais sincronizar' | |
}; | |
// Adicionando Youtube iframe API | |
tag.src = 'https://www.youtube.com/iframe_api'; | |
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); | |
// Método chamado automaticamente pela api do youtube | |
function onYouTubeIframeAPIReady() { | |
player = new YT.Player('player', { | |
height: 450, | |
width: 800, | |
videoId: $(playerDiv).attr('data-video-id'), | |
events: { | |
'onReady': onPlayerReady | |
}, | |
playerVars: { | |
rel: 0, | |
showinfo: 0 | |
} | |
}); | |
} | |
// Método chamado nos eventos do player | |
function onPlayerReady(event) { | |
// obtendo a duração do video, em segundos | |
videoDuration = parseInt(player.getDuration()); | |
// aplicando o intervalo de 1 em 1 segundo | |
interval = setInterval(discoverTime, 1000); | |
} | |
// método utilizado para descobrir o tempo atual do vídeo | |
function discoverTime() { | |
if (player && player.getCurrentTime) { | |
videotime = parseInt(player.getCurrentTime()); | |
} | |
if (videotime < videoDuration && lyrics[videotime] !== undefined) { | |
fireEvent(videotime); | |
} | |
if (videotime > videoDuration) { | |
clearInterval(interval); | |
} | |
} | |
// Aqui vem sua lógica para que algo seja feito ao atingir o tempo desejado no video | |
function fireEvent(index) { | |
console.log(lyrics[index]); | |
} | |
</script> |
Legal o script amigo, eu estava batendo cabeça aqui, tentando encontrar uma forma para detectar se o usuario realmente assistiu o video inteiro, sem pular(passar para frente), aí dentro da function discoverTime() { coloquei assim
if (videotime == '6') { seg_assistidos1 = '1'; }
if (videotime == '12') { seg_assistidos2 = '1'; }
if (videotime == '18') { seg_assistidos3 = '1'; }
if (videotime == '24') { seg_assistidos4 = '1'; }
if (videotime == '30') { seg_assistidos5 = '1'; }
if (videotime == '36') { seg_assistidos6 = '1'; }
if (videotime == '42') { seg_assistidos7 = '1'; }
if (videotime == '48') { seg_assistidos8 = '1'; }
if (videotime == '54') { seg_assistidos9 = '1'; }
if (videotime == '60') { seg_assistidos10 = '1'; }
Em um video de 1 minuto, Sempre quando bater esse determinado segundo, registra em uma variavel o valor 1, que corresponde dizendo que o usuario visualizou essa parte, aí fora dessa function, e dentro dessa function onPlayerStateChange(event) { usei o comando para testar
// se finalizar
if (event.data == YT.PlayerState.ENDED) {
player1.pauseVideo();
alert('finalizado '+seg_assistidos1+' '+seg_assistidos2+' '+seg_assistidos3+' '+seg_assistidos4+' '+seg_assistidos5+' '+seg_assistidos6+' '+seg_assistidos7+' '+seg_assistidos8+' '+seg_assistidos9+' '+seg_assistidos10);
}
quando o video chegar no fim, me envia um alerta me dizendo se o video foi visto em todas as 10 etapas, se foi me retorna tudo 1, caso contrario se em alguma etapa foi pulada me retornaria 0.
Mas não deu certo kkkkkk não sei porque, vc sabe como isso poderia ser feito?
Preview:
