javascriptvideovimeovideo-playerfroogaloop

Video control using Vimeo API


I have a vimeo JavaScript here, could someone tell me if it would be possible get the vimeo video to go to start once finished;

Here is the code I have so far using JavaScript

// JavaScript Document

var animSpeed = 400;

function onPlay(id) {
jQuery('.blankOverlay').fadeIn(animSpeed);
jQuery('h2').text('You clicked play!');
}

function onPause(id) {

jQuery('.blankOverlay').fadeOut(animSpeed);
jQuery('h2').text('The video is paused.');
}

function onFinish(id) {
jQuery('.blankOverlay').fadeOut(animSpeed);
jQuery('h2').text('The video has now finished.');
}


jQuery(function($) {
// ---------------------------------------------------------------------------------------------

// --------------------------------------------- PHYSICIAN INDIVIDUAL PAGES --
/* ----- video player api (vimeo) ----- */
var iframe = $('#vplayer')[0],
player = $f(iframe);

// When the player is ready, add listeners for play, pause, finish, and playProgress
player.addEvent('ready', function() {

player.addEvent('play', onPlay);
player.addEvent('pause', onPause);
player.addEvent('finish', onFinish);
player.addEvent('playProgress', onPlayProgress);

});

$('.introContent, iframe').click(function(){    $('.blankOverlay').fadeIn(animSpeed); });
$('.blankOverlay').click(function(){ $(this).fadeOut(animSpeed);  player.api('pause'); });

// ---------------------------------------------------------------------------------------------
});

Solution

  • Try player.api('play'); in the finish event handler.

    Something like this

    player.addEvent('finish', onFinish);
    
    function onFinish(){
      player.api('play'); // this should take the video to the start again
    }
    

    If you want to just take the video back to initial state you can use

    player.api('unload'); // this should take the video to initial state but will not automatically start
    

    Here is a updated demo and here is the reference for more methods.

    Update

    1. Variable player is defined inside a function and being accessed from outside
    2. Event handler onPlayProgress is not defined at all for which an error is thrown.

    Here is an updated demo

    Hope this helps.