This is a message.

Embedded cuepoints

Handle events raised by embedded cuepoints

standalone demo

Please wait for 10 seconds and you'll see our embedded cuepoints in action.

The above has embedded cuepoints on seconds 10, 25, 55, 75, 95 and 110. We will trigger a function that will update the info box below the video.

Usage

Flowplayer offers you a lot of methods for working with cuepoints. You can set up cuepoints manually by using onCuepoint as shown below: 

clip: {
    // make something happen on the first, the fifth and on the last second
    onCuepoint: [[1000, 5000, -1000], function(clip, cuepoint) {
        alert("cuepoint entered");
    }]
}

JavaScript

Cuepoints are supplied in milliseconds, not seconds. It's also possible to embed cuepoints directly into the video file using tools such as flvtool2. These cuepoints are called "embedded cuepoints" and you can listen to those cuepoints in following way:

clip: {
    // do something on embedded cuepoint
    onCuepoint: function(clip, cuepoint) {
        alert("embedded cuepoint entered, time: " + cuepoint.time);
    }
}

JavaScript

See this tutorial about embedding cuepoints to learn more.

Configuration

var info = document.getElementById("info");
flowplayer("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.11.swf", {
 
    clip: {
        url: 'http://pseudo01.hddn.com/vod/demo.flowplayervod/honda_accord.flv',
 
        // you can do different things on each cuepoint by checking the time
        onCuepoint: function(clip, p) {
            info.innerHTML = "time : " +p.time+ ", name: " + p.name;
        }
    }
 
});

JavaScript