sincronização de incremento de função com vídeo (ou incremento automático)

Estou ocupado com um webdoc que estou criando parcialmentehype, o vídeo está hospedado emvimeo (então eu preciso usar o vimeo api para algumas tarefas como seekto), mas minhas dificuldades devem ser limitadas a js.

o objetivo éexibir uma determinada imagem em um determinado intervalo de tempo do vídeo. Com o meu código abaixo, recebo a string "test", "success" e "confirmou sucesso" no momento certo em meu div id = popimgbox, e posso procurar o vídeo e ainda assim obter a resposta certa ", se assim posso dizer.

Agora, tenho imagens armazenadas na mesma pasta e todas nomeadas popimgX.jpg, com X sendo um número.

eu quero

para armazenar os URLs das minhas imagens em uma variável, digamos "popimgurl"

que minha variável é atualizada (por uma função ???) para conter o URL de uma determinada imagem por um determinado intervalo de tempo do vídeo

ainda poder procurar e voltar no vídeo e obter o URL certo na hora certa

Para isso, criei um incremento de função e um par de variáveis. Com o código abaixo, meupopimgurl A variável é realmente atualizada quando o vídeo chega a 3 segundos, masnão incrementa apenas uma vez... até que o vídeo atinja 6 segundos, quando eu quiser atualizar minha variável popimgurl novamente.

Eu tentei usarpara comjs quebra ejs encerramento mas não conseguiu por alguns motivos compreensíveis após reflexão;

Eu tentei bastante com o switch, mas estou preso ao fato de que o caso deve ser string ou valor numérico único, não intervalo numérico ou comparação.

Agradeço antecipadamente por sua ajuda :-)

var iframe = $('#vplayer_1')[0];
var player = $f(iframe);
var status = $('.status');              
fired = 0;

 //my try to sync increment      
var dia = (function () {
var n = 0;
return function increment() {return n += 1;}  
        })();

function dian(){
    popimgurl = '${resourcesFolderName}/popimg'+ dia() +'.jpg';
    popimgloader = '<img src ="' + popimgurl + '">'; 
}

// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
    status.text('ready');
    player.addEvent('pause', onPause);
    player.addEvent('finish', onFinish);
    player.addEvent('playProgress', onPlayProgress);
});



// Call the API when a button is pressed
$('button').bind('click', function() {
    player.api($(this).text().toLowerCase());
});


function onPause(id) {
    status.text('paused');
}

function onFinish(id) {
    status.text('finished');
}


function onPlayProgress(data, id) {
    status.text(data.seconds + 's played');


    //my chapters, when I want the img to change within popimgbox
    if (data.seconds >= 1) {
        popimgbox.innerHTML = "test"; 
    }

    if (data.seconds >= 3) {
        // popimgbox.style.display = "success"
        dian();
        popimgbox.innerHTML = popimgurl;
    }               
    if (data.seconds >= 6) {
        // popimgbox.style.display = "confirmed success"
        dian();  
        popimgbox.innerHTML = popimgurl;
    }

}

PS1: disclamer, eu sou um programador iniciante, faço o meu melhor, desculpe meu francês se minha pergunta não for bem formulada ou se a resposta estiver em algum lugar, mas eu não consegui entender / entender

PS2: eu tentei bastante com popcornjs, mas não há maneira de fazê-lo funcionar com vimeoapi e dentro do hype, bastante frustrado ;-)

PS3: como este é o meu primeiro post, gostaria de agradecer a todos pelo excelente suporte disponível aqui; Eu te devo mais ;-)

questionAnswers(1)

yourAnswerToTheQuestion