Event management

This tutorial will help you use the events emitted by the video player.

Available events

HTML documents loaded by the embedded web browser can retrieve events concerning various aspects of the system:

• playback events:
  • FileStartEvent: the playback of a media file has started.
  • FileEndEvent: the playback of a media file is over.
  • FolderEnterEvent: the playback of a folder has started.
  • FolderLeaveEvent: the playback of a folder is over.
  • TimeUpdateEvent : the playback position is updated.
  • StateChangeEvent : the playback engine state has changed.
  • TrackSelectionEvent : the played tracks have changed.
• audio events:
  • VolumeChangeEvent: the volume has been changed.
  • MuteChangeEvent: the audio has been (un)muted.
• input contact events:
  • InputContactEvent: input contacts have been modified.
• printer events:
  • PrinterStateEvent: the printer state has changed.
  • JobStateEvent: a print job has changed.

You will find examples on how to use a specific events in their own documentation.

Event registration

You can use two different ways to handle events, but the first one is highly recommended.

1. Using an addListener() method

Some control interfaces offer an addListener() method which can be used to register events handlers.
These methods are available since firmware version v1.08 or by using the ID-AL JavaScript SDK version 1.1.0.

This first way of doing is highly recommended because it makes it possible to receive events from control interface retrieved by IDAL.getControlInterfaces() or IDAL.getRemoteControlInterfaces().

Your code can then be run as is on the video player or on a third-party browser.

Available methods:

• Player.addListener()
• Contact.addListener()
• Printer.addListener()

For example, if you want to be informed when the playback of a file starts or ends:

// Event handler definition
function playerEventHandler(e) {
    switch (e.detail.type) {
        case 'file-start':
            // Do something with e.detail.filename
            break;
        case 'file-end':
            // Do something with e.detail.filename
            break;
    }
}

// Control interfaces retrieval
// Note: you can also use IDAL.getRemoteControlInterfaces()
IDAL.getControlInterfaces()
    .then(function(ifaces) {
        // Event handler registration
        ifaces.player.addListener(playerEventHandler);
    });

2. Using window.addEventListener()

Although available, this way of doing is not recommended because it only works when the code is run on the video player.
It is indeed not possible to retrieve events of remote control interfaces retrieved by IDAL.getRemoteControlInterfaces() this way.

Like any other standard event ("click", "mouseover", "load"...), the above events can be registered using window.addEventListener().

For example, if you want to be informed when the playback of a file starts or ends:

function playerEventHandler(e) {
    switch (e.detail.type) {
        'file-start':
            // Do something with e.detail.filename
            break;
        'file-end':
            // Do something with e.detail.filename
            break;
    }
}
window.addEventListener('idal-player-event', playerEventHandler);