Playlist plugin together with instream clips JavaScript Plugins - Demo 9 / 11
Introduction
This demo continues from this instream playlist demo which has an internal playlist combined with two instream playlists. This demo shows how this configuration works with the playlist plugin.
Flowplayer configuration
As being said the configuration is the same as in instream playlist demo.
flowplayer("player", "http://releases.flowplayer.org/swf/flowplayer-3.1.5.swf", {
// properties that are common for parent and instream clips
clip: {
baseUrl: 'http://blip.tv/file/get'
},
// normal playlist
playlist: [
// 1st clip
{
url: 'KimAronson-TwentySeconds63617.flv',
duration: 10,
autoPlay: false,
autoBuffering: true,
title: 'Green grass',
// instream playlist with one clip, starts after 3 seconds
playlist: [{
url: 'http://vod01.netdna.com/vod/demo.flowplayer/flowplayer-700.flv',
duration: 3,
position: 3,
// customized controlbar settings for instream clip
controls: {
backgroundColor: '#95A1AE',
progressColor: '#00ffff',
bufferColor: '#CCFFFF',
playlist: false,
enabled: {scrubber: false}
}
}]
},
// 2nd clip
{
url: 'KimAronson-TwentySeconds59483.flv',
title: 'Palm trees',
// instream playlist with one clip, starts before the main clip.
playlist: [{
url: 'http://vod01.netdna.com/vod/demo.flowplayer/flowplayer-700.flv',
duration: 4
}]
},
// 3rd and 4th clips do not have any instream playlists
{url: 'KimAronson-TwentySeconds64268.flv', title: 'Hotel Room 213'},
{url: 'KimAronson-TwentySeconds75235.flv', title: 'Two little girls'}
],
// show playlist buttons on the controlbar + a little customization
plugins: {
controls: {
url: 'flowplayer.controls-tube-3.1.5.swf',
playlist: true,
fullscreen: false,
volume: false
}
}
});Playlist configuration
Our playlist is simply plugged into the player. Look for the standalone example for the HTML configuration.
$f().playlist(".entries", {loop: true});
Take a look at a standalone version of this demo. View its source code to get things going on your page.