This is a message.

Mixed content streaming

Learn how to create an RTMP playlist with audio and video clips


standalone demo

This example shows how to set up a playlist of audio and video files that are streamed using RTMP.


Below is the player container and the playlist container. Inside the playlist we have a "template" for each entry in the playlist:

<!-- player container-->
<div id="player">&nbsp;</div>
<!-- the playlist -->
<div id="playlist" class="clearfix" style="display:none">
<!-- let rest of the page float normally -->
<br clear="all" />



Note how we animate the controlbar to more prominence for the audio clip.

$f("player", "", {
// the playlist
playlist: [
{title: 'FLV file', url: 'Extremists'},
{title: 'Audio file', url: 'mp3:fake_empire-cbr'},
{title: 'MP4 file', url: 'mp4:bbb-1200'}
clip: {
// each clip of the playlist uses the rtmp plugin
provider: 'rtmp',
// configure and animate the controlbar according to clip type
onBegin: function (clip) {
var isVideo = clip.type === 'video';
// default controlbar position and height for video,
// larger controls over screen for audio
height: isVideo ? 26 : 50, bottom: isVideo ? 0 : "30%"
}, 2000, function () {
// enable fullscreen button for video
// in the optional callback function of the animation
this.setWidgets({fullscreen: isVideo});
// the rtmp plugin
plugins: {
rtmp: {
url: "flowplayer.rtmp-3.2.13.swf",
netConnectionUrl: 'rtmp://',
// needed to obtain the duration of the audio file
durationFunc: 'getStreamLength'
// include playlist buttons in the controlbar
controls: {
playlist: true,
autoHide: false
}).playlist("#playlist", {loop: true});