Player events

Using the on and once methods of JavaScript SDK, you can subscribe to Cloud Video Player events:

SourceChangeSourceChange

Switching content.

The handler in the { source } object receives a new content link.

Example:

player.on('SourceChange', ({ source }) => {
    console.log(source);
});

StatusChangeStatusChange

Changing the playback status.

The handler in the { status } object receives a new playback status value.

Example:

player.on('StatusChange', ({ status }) => {
    console.log(status);
});

ErrorChangeErrorChange

Getting or resetting an error.

The handler in the { error } object receives an error.

An error is reset when switching content (if switching content is possible). In this case, the handler receives the error object with the undefined value.

Example:

player.on('ErrorChange', ({ error }) => {
    console.log(error);
});

CurrentTimeChangeCurrentTimeChange

Changing the position on the timeline.

The handler in the { currentTime } object receives a new current time value.

Example:

player.on('CurrentTimeChange', ({ currentTime }) => {
    console.log(currentTime);
});

DurationChangeDurationChange

Changing the video duration.

The handler in the { duration } object receives a new duration value.

This event may occur:

• When you change content.
• Periodically for the EVENT type videos as their duration continuously increases.
• When the LIVE video type changes to VOD.

Example:

player.on('DurationChange', ({ duration }) => {
    console.log(duration);
});

VideoTypeChangeVideoTypeChange

Changing the video type.

The handler in the { videoType } object receives a new video type value.

This event may occur:

• When you change content.
• When the LIVE or EVENT video type changes to VOD.

Example:

player.on('VideoTypeChange', ({ videoType }) => {
    console.log(videoType);
});

MutedChangeMutedChange

Changing the video muted status.

The handler in the { muted } object receives a new muted status value.

Example:

player.on('MutedChange', ({ muted }) => {
    console.log(muted);
});

VolumeChangeVolumeChange

Changing the video sound volume.

The handler in the { volume } object receives a new volume level value.

Example:

player.on('VolumeChange', ({ volume }) => {
    console.log(volume);
});

UtcStartTimeChangeUtcStartTimeChange

Changing the UTC video start time.

The handler in the { utcStartTime } object receives a new UTC time value.

This event may occur:

• When you change content.
• When the LIVE video type changes to VOD.

Example:

player.on('UtcStartTimeChange', ({ utcStartTime }) => {
    console.log(utcStartTime);
});

SeekableRangeChangeSeekableRangeChange

Changing the seekable range.

The handler in the { seekableRange } object receives a new seekable range value.

This event may occur:

• When you change content.
• Periodically for the LIVE and EVENT type videos as their seekable range continuously increases.

Example:

player.on('SeekableRangeChange', ({ seekableRange }) => {
    console.log(seekableRange.start, seekableRange.end);
});

BufferedRangesChangeBufferedRangesChange

Changing the buffered ranges.

The handler in the { bufferedRanges } object receives an array with a new description of buffered ranges.

Example:

player.on('BufferedRangesChange', ({ bufferedRanges }) => {
    console.log(bufferedRanges);
});

See alsoSee also

• Interface: PlayerSdkEventHandlers in the API reference.