Error when using Froogaloop api to rewind 30 seconds

Question

I am using Vimeo's Froogaloop API to control an embedded Vimeo video. I have created some buttons that go back 30 seconds, back 60 seconds, forward 30 seconds and forward 60 seconds with the following code. Everything works perfectly but...

I am getting about 33 instances of the following error each time I click on one of the 'Back' buttons. The error does not occur when I click on the 'Forward' buttons.

Why is this error showing up and how can I fix this code so that the error doesn't occur?

JSFIDDLE
http://jsfiddle.net/serkyen/553htq60/8/

ERROR
Uncaught Error: Seconds must be a positive float less than the duration of the video (undefined).

JAVASCRIPT

window.onload = (function() {

var iframe_player = jQuery('#player_1')[0];
var player_1 = $f(iframe_player);

player_1.addEvent('ready', function() {
        player_1.addEvent('pause', onPause_part1);
        player_1.addEvent('finish', onFinish_part1);
        player_1.addEvent('playProgress', onPlayProgress_part1);
});

function onPlayProgress_part1(data, id) {

    jQuery("#part1-60s-b").click(function(){    
        player_1.api('seekTo', data.seconds - 60);
        player_1.api('play');       
    });

    jQuery("#part1-30s-b").click(function(){
        player_1.api('seekTo', data.seconds - 30);
        player_1.api('play');
    });

    jQuery("#part1-30s-f").click(function(){    
        player_1.api('seekTo', data.seconds + 30);
        player_1.api('play');       
    });

    jQuery("#part1-60s-f").click(function(){    
        player_1.api('seekTo', data.seconds + 60);
        player_1.api('play');       
    });
}
}

HTML

<a id="part1-60s-b" href="javascript:void(0);" class="simple-button">Back 60s</a>
<a id="part1-30s-b" href="javascript:void(0);" class="simple-button">Back 30s</a>
<a id="part1-30s-f" href="javascript:void(0);" class="simple-button">Forward 30s</a>
<a id="part1-60s-f" href="javascript:void(0);" class="simple-button">Forward 60s</a>

score 0 · Answer 1 · answered Nov 25 '14 at 19:52

There are a couple things going on here:

You are setting up a new listener on the links for each progress event, so there are quickly hundreds of them. You can fix that by putting the click handlers inside the callback for the ready event.
Make sure that you are not passing a seekTo time that is less than 0 or greater than the duration of the video. The player will ignore any seekTo calls that are outside of those bounds.

Error when using Froogaloop api to rewind 30 seconds

1 Answers1