Listening to Multiple Message Bus Events in Player V3 (Deprecated)

You can use the message bus to listen to multiple events.

Important: Ooyala Player V3 is deprecated and is scheduled
to be disabled on 2018-01-31. After that date, Player V3 will no longer play your video
or audio content. Customers still using Player V3 need to migrate to Player V4 (see Migrating from Player V3 and Player Migration FAQ).

The following is a complete example that illustrates how to use the message bus to
listen for multiple events.

Important: Ooyala Player V3 is deprecated and is scheduled
to be disabled on 2018-01-31. After that date, Player V3 will no longer play your video
or audio content. Customers still using Player V3 need to migrate to Player V4 (see Migrating from Player V3 and Player Migration FAQ).

In this example, you will learn how to use the
onCreate() function to handle events related to the playing of a video. In
this advanced application, the user plays a video, and the event handlers determine when the
video has finished playing. At that point, the event handler destroys the player and displays
a message to the user.

The purpose of this web page is to monitor and respond to
downloading, playhead time changes, and played events, so the design will include:

A head element containing a script tag specifying
the loading and initialization request.

A body element containing:

UI presentation and layout for the Player container.

Event listeners that monitor and respond to downloading, playhead time changes,
and played events.

A script tag that creates the Player.

Step 1: Listening to Multiple Events

Sometimes it is useful to listen and respond to multiple events at once. One way to do this
is to subscribe to all events. The Event Model for HTML5 Player V3 (Deprecated) provides you
with a message bus, accessed via the created Player object's mb object.
In this case we will use the message bus subscribe() function specifying
a wildcard ("*") for the event
name:

Now that we are listening for every possible event, we can include logic based on multiple
events within the callback function via its eventName parameter. In
this example we write all events, except for downloading and playhead time changed events
(OO.EVENTS.DOWNLOADING and
OO.EVENTS.PLAYHEAD_TIME_CHANGED ), to the JavaScript console
log:

Step 2: Destroying the Player

Once the video has finished playing, we would like to properly destroy the player and
dispose of its resources. To do this we listen for the OO.EVENTS.PLAYED
event:

/* Subscribe to the PLAYED event,
* which only occurs when the video has finished playing: */
player.mb.subscribe(OO.EVENTS.PLAYED , 'example', function(eventName) {
});

To destroy the player and dispose of its associated resources, call the Ooyala V3 Player
object's destroy()
method:

/* Subscribe to the PLAYED event,
* which only occurs when the video has finished playing: */
player.mb.subscribe(OO.EVENTS.PLAYED , 'example', function(eventName) {
/* Destroy the player and properly dispose of its resources: */
player.destroy();
/* Notify the user: */
alert('The player has been destroyed!');
});

Note: In iOS you can only have one HTML5 player running at a time on a web page. You can call
the Ooyala V3 Player object's destroy() method to ensure a player does
not prevent the playback of another video in a different player on the page.

Here is the completed onCreate()
function:

function onCreate(player) {
/*
* Subscribe to all events:
* this allows you to create logic
* based on multiple events.
*/
player.mb.subscribe("*" , 'example', function(eventName) {
/* Write all events, except for downloading and playhead time changed events,
* to the JavaScript console: */
if (eventName != OO.EVENTS.DOWNLOADING &&
eventName != OO.EVENTS.PLAYHEAD_TIME_CHANGED)
console.log(eventName);
});
/* Subscribe to the PLAYED event,
* which only occurs when the video has finished playing: */
player.mb.subscribe(OO.EVENTS.PLAYED , 'example', function(eventName) {
/* Destroy the player and properly dispose of its resources: */
player.destroy();
/* Notify the user: */
alert('The player has been destroyed!');
});
}

Complete Example

You now have a complete working example of a web page that responds to multiple events when
the user plays a video. The event handlers determine when the video has finished playing, at
which point the player is destroyed and a confirmation message is displayed to the user: