Flowplayer Configuration Tailor every aspect of the player to your needs

• Introduction
• Player
• Clips
• Playlists
• Plugins
• Streaming

Clips

Clips represent movies to play in Flowplayer. Clips can also be provided as a Playlist with a series of clips that will be played in sequence. Clip and Playlist are objects of Player. The must be specified in the configuration as follows:

flowplayer("player", "flowplayer.swf", {
    clip: {
        ...
    },
    playlist: [
        ...
    ]
});

Note: the names of clip and playlist in configuration are all lowercase. In the documentation we talk about these objects with an initial Uppercase letter.

In this section:

• Overview of Clip
• Clip properties and Custom properties
• Clip events
• Cuepoints

Overview of Clip

The Clip object in configuration has a dual role. It is either a collection of properties that will apply to all Clips, called Common Clip, or it is a string with the name and location of a single movie to play. When Flowplayer analyses Clip from the configuration, it places the properties in Common Clip and, if the Clip configuration object also has a movie, creates a Playlist in which it places the movie.

When you specify a Playlist in the configuration, you can specify for each Clip its properties and set event listeners. Properties of a Clip specified in the Playlist override those of the Common Clip. When you later replace the playlist, all Common Clip properties and event listeners are preserved. See also Clip events below for a discussion of Clip events.

Remember that the simplest form of a configuration is a string with the movie to play. Then here follow three examples that illustrate the above:

/* The simplest form of a configuration: clip to play
 */
flowplayer("player", "flowplayer.swf", "myMovie.flv");


/* Play a single clip but set a property
 */
flowplayer("player", "flowplayer.swf", {
    clip: {
        url: "myMovie.flv",
        autoPlay: false
    }
});


/* Common Clip and playlist
 */
flowplayer("player", "flowplayer.swf", {
    clip: {
        autoPlay: false		// aplies to all Clips in the playlist
    },
    playlist: [				// an array of Clip objects
        "myMovie.flv",			// simple Clip object: movie to play
        {						// Clip object
            url: "myMovie2.flv",
            autoPlay: true			// override Common Clip for this clip
        }
    ]
});

Clip types

A clip will generally be a movie to play but it can also be an audio or image file. An image file can be used as a splash screen and with audio files you can even turn Flowplayer into a jukebox.

Flowplayer supports all the video formats supported by Adobe Flash; they are listed here. The supported image formats are .jpg and .png and for audio only .mp3 is supported. When Flowplayer encounters a .mp3 file in the configuration, it automatically loads an audio plugin to play it. Note that setting a Playlist in runtime that has an .mp3 audio file, will not automaticall load the Plugin. See the audio plugin for details. Here is an example of playlist that shows a splash image and then starts playing the audio file:

playlist: [

	// show album cover
	{url: 'album_cover.jpg', scaling: 'orig'},

	// our MP3 does not start automatically
	{url: 'my_song.mp3', autoPlay: false}

]

Clip properties

The following clip properties can be set in the configuration. Properties of a Clip specified in the Playlist override those of the Common Clip.

Custom properties

You can also create custom properties for a clip. You give them a name and they can have any value, which can even be an object in json. Flowplayer stores these custom properties with the Clip object so when you refer to the Clip or receive it in an event listener, all these properties are available to you. Specifying such properties in the Common Clip makes them available for all clips; specifying them only for a single Clip makes them available only for that Clip. Here is an example:

playlist: [
    {
		// "standard" flowplayer properties
		url: 'path/to/movie.flv',
		autoPlay: false,

		// custom property
		title: 'Swimming on ice at Lapland',

		// custom properties can also be objects such as here
		details: {
			date: '03/24/2008',
			creator: 'John Doe',
			subject: ['culture', 'traveling', 'scandinavia']
		}
    }
]

Clip events

When inside a Player or Clip object a situation occurs that might be of interest to you, we have defined an event for that situation. If you want to know the situation occurs, you register an event listener, a function that you provide (write), that will be called when the particular situation occurs. For example, the onStart event of a Clip informs you the Clip has started playing and you may want to set the clip's title below the Player.

You can register Clip event listeners directly in the root of the configuration and Flowplayer will register them with the Common Clip so that they will be called when the event ocurrs for each Clip in the Player. Each Clip can also have own event listeners that will be called before the corresponsing event listener of the Common Clip. If you return false from an event listener, no other event listener will be called.

Note: Although an event listener registerd in the root level is registererd with the Common Clip, it does not replace an event listener that is set in the Common Clip. An event listener provided in the root will be called last.

The following example shows the three ways of providing an event listener in the configuration:

<SCRIPT>
flowplayer("player", "flowplayer.swf", {
    clip: {
        onStart: function() {
            msgs.innerHTML += "Common Clip event listener called<br>";
        }
    },
    playlist: [
        {
            url: 'KimAronson-TwentySeconds58192.flv',
            onStart:function() {
                msgs.innerHTML += "Playlist's Clip event listener called<br>";
            }
        },
        'KimAronson-TwentySeconds63617.flv'
    ],
    onStart: function() {
	    msgs.innerHTML += "Root's Clip event listener called<br>";
    }
});
</SCRIPT>
<div id='msgs'></div>

The output of the above code, when the first clip starts playing, is:

    Playlist's Clip event listener called
    Common Clip event listener called
    Root's Clip event listener called

Basic clip events

Listeners to clip events have their this variable set to the current Player object and receive as their first argument a reference to the Clip on which the event fires.

For some events, there is also an onBefore version of the event, e.g. onBeforePause and onPause. Returing false from an onBefore event will cancel the event, i.e. the action is not performed and its on version will not be called.

Advanced clip events

These events are rarely needed by developers and are mostly used internally by the controlbar plugin. However, they may be of interest if your particular application needs to know the status of the buffer.

Flowplayer Twitter feed