Add event listners to flow player using html5media

[manoj_de_silva1]

Hi,

I’m using http://api.html5media.info/1.1.6/html5media.min.js to use flow player on browser fallback. I want to add event listeners to flow player to capture play, pause, stop etc events. Could you please give me some guidance to do this.

Better if below method can be used without using flowplayer.js to achieve this,

html5media.configureFlowplayer = function(element, config) {
return config;
}

Appreciate swift response.

--

Thanks,

Manoj.

[Alexis_Cazes_ · Accepted solution]

Go here : https://flowplayer.org/docs/api.html

Here is a part of the doc, but you better read it yourself as there is a way to do it via jquery as well. when the event happens  send the video tracking for adobe analytics

Events

Use the bind() method to execute your own JavaScript when a specified event happens in the player. For example:

api.bind("pause", function(e, api) { // do your thing });

The first argument is the event name, and the second is a callback function which is fed with 2 or 3 arguments:

1. The jQuery event object. This jQuery convention allows fine grained control of the event object's properties.
2. Provides a handle on the player API.
3. Optional, depends on the event.

Within the callback the this keyword refers to the root element of the player - the container element. It corresponds to the currentTarget property of the first argument.

Here is a full list of events:

                                                                         

event	when it fires
beforeseek	Before seeking starts at the origin position. Since v5.4.2 the 3rd argument gives access to the seek target position. By callingevent.preventDefault() (where event is the callback's 1st argument) or returning false the seek can be stopped.
disable	When the player toggles between disabled and normal state. In disabled mode the UI elements cannot be used.
error	When an error occurred. The 3rd argument provides an object featuring the code and message properties. See the error tablebelow.
finish	When playback has finished.
fullscreen	When the player goes to fullscreen mode.
fullscreen-exit	When player exits fullscreen mode.
load	First event in the lifecycle of the player and the video, before the configured video or a new video starts playing. Offers an opportunity to alter the video properties. The 3rd argument provides the video object featuring basic data like src, but not yet the video metadata from the server (such as duration). Returningfalse will prevent the video from loading.
mute	When the player's mute state is toggled.
pause	When playback is paused.
progress	When the playhead moves forward. Happens approximately every 250 milliseconds during playback. The 3rd argument provides the current playback position, i.e. the current value of the timeproperty of the video object.
ready	When the video is fully loaded and video metadata (such asduration) becomes available from the video object which is provided by the 3rd argument.
resume	When playback is resumed.
seek	When seeking is completed at the target position. Since v5.4.2 the 3rd argument gives access to the target position.
speed	v5.1 When the playback speed is changed. The new level is provided by the 3rd argument.
stop	v5.2 When playback is stopped by the stop() method.
unload	When the player goes back to the splash state.
volume	When the volume level is changed. The new level is provided by the 3rd argument.

Note: You will often find that Flowplayer's CSS programming capabilities provide a more elegant way to customize the player's look and feel dynamically according to its state.