
The SproutVideo Javascript Player API provides a way to both receive events and control the SproutVideo Player. You can see an example below or checkout the documentation here.
| Count | Data | |
|---|---|---|
| Ready Event | 0 | |
| Play Event | 0 | |
| Pause Event | 0 | |
| Loading Event | 0 | |
| Progress Event | 0 | |
| Completed Event | 0 | |
| Volume Event | 0 | |
| RateChange Event | 0 |
$(document).ready(function(){
// create a new SV.Player instance for the video.
// videoID: the id of the video from which you want to receive events and control.
var player = new SV.Player({videoId: '709adcb31f19e5c6f8'});
//Bind events for the buttons.
$('#play').bind('click', function(e){
player.play();
});
$('#pause').bind('click', function(e){
player.pause();
});
$('#seek').bind('click', function(e){
player.seek(50);
});
$('#currentTime').bind('click', function(e){
alert(player.getCurrentTime());
});
$('#setVolume').bind('click', function(e){
player.setVolume(0.5);
});
$('#getVolume').bind('click', function(e){
alert(player.getVolume());
});
$('#loaded').bind('click', function(e){
alert(player.getPercentLoaded());
});
$('#duration').bind('click', function(e){
alert(player.getDuration());
});
$('#email').bind('click', function(e){
alert(player.getEmail());
});
$('#setPlaybackRate').bind('click', function(e){
player.setPlaybackRate(0.5);
});
$('#getPlaybackRate').bind('click', function(e){
alert(player.getPlaybackRate());
});
// Available events
var events = ['ready', 'play', 'pause', 'loading', 'progress', 'completed', 'volume', 'rateChange'];
// Bind all events
for (var i = 0; i < events.length; i++) {
player.bind(events[i], function(e) {
var count = parseInt($('#' + e.type + '_count').text());
$('#' + e.type + '_count').html(count + 1);
$('#' + e.type + '_data').html(JSON.stringify(e.data));
});
}
});