The Player Events API generates a list of all the events that the AnyClip Player exposes. The table below lists the available events.
Table 1. Player Events
Type | Event Name | Description | Parameters - Values |
Player Events | playerReady | The player is ready to work |
|
| playerPlaylistLoaded | The player received the playlist (with the clips) |
|
| playerItemChange | The player clip was changed |
|
| playerFullscreen | The player plays on full screen |
|
| playerVolume | The player volume changed | new volume (0-100)
|
| playerMute | The player is on mute | 0: unmuted 1: muted |
| playerPause | The player has been paused | 0: resumed 1: paused |
| CarouselItemClick | An item in the carousel was clicked | zero-based index of selected clip |
| playerClickNext | The “Next” button was clicked |
|
| playerSeek | Seek clips |
|
| FloatingPlayerClosed | Floating player closed |
|
| landingPageClick | Landing page clicked |
|
| CloseCaptionsChangedOnClick | Close Captions visibility was changed on click | 0: Disabled 1: Enabled |
| ChapterStart | Chapter start |
|
| ChapterEnd | Chapter ends |
|
| ChapterClick | Chapter clicked |
|
| playerOutOfPort | Player is scrolled out of the visible viewport while content is playing |
|
Ad Events | adImpression | Ad impression |
|
| adSkippped | Ad was skipped |
|
| adFirstQuartile | Ad in Q1 |
|
| adMidpoint | Ad in Q2 |
|
| adThirdQuartile | Ad in Q3 |
|
| adComplete | Ad in Q4 (complete) |
|
| adClick | Ad clicked |
|
| adViewability | 50% of ad pixels are visible in the browser for 2 continuous seconds |
|
Playback Events | playerPlaylistComplete | Playlist completed |
|
| playerClipImpression | Clip Impressions (Clip started) |
|
| playerFirstQuartile | Clip in Q1 |
|
| playerMidpoint | Clip in Q2 |
|
| playerThirdQuartile | Clip in Q3 |
|
| playerClipComplete | Clip in Q4 (complete) |
|
| playerDisplayClick | Clip clicked |
|
| ClipSeek | Clip seek | "startSeek, finishSeek" (Seconds), e.g. "2,72" |
Playback Events (Unique for Auto-Skip feature) | clipSkippedAuto | Clip was skipped automatically |
|
| clipSkippedUser | User clicked on "Next" button |
|
| clipStayed | User clicked on "Stay" button |
|
Social Events | ShareScreenOpen | Social share overlay opened |
|
| playerTheaterModeShare | Share button was clicked in Theater mode |
|
| ShareVideoClicked | The user clicked on one of social share buttons (Facebook, Twitter, WhatsApp, email) |
|
| SocialLikeClicked | The user liked the video (user clicked on empty thumb, liking the video) |
|
| SocialUnlikeClicked | The user unliked the video (user clicked on the solid thumb, unliking the video) |
|
X-ray Events | LuxDisplayed | X-ray is displayed |
|
| LuxHidden | X-ray is hidden |
|
| LuxUserOpen | X-ray user action: open |
|
| LuxUserClose | X-ray user action: close |
|
| LuxLabelDisplay | X-ray label is displayed |
|
| LuxLabelHide | X-ray label is hidden |
|
| LuxClickVideo | X-ray clicked on a video |
|
| LuxButtonClick | Click on one of the X-Ray buttons |
|
Form Events | formShowed | Form is displayed |
|
| formClosed | Form was closed/skipped |
|
| formSubmitted | Form was submitted |
|
Watch Events | chipClicked | Watch chip is clicked |
|
| w_viewAll | "View All" link is clicked on the watch Main page |
|
| w_playlistEnd | Watch playlist playback ends on the Player page |
|
Events Listener Subscribe Method Signature
/** * Subscribe to an event
* @param {function} Callback function
* @param {string} topic Event name
* @param {object} [context] (optional) Context to run callback function
* @param {number} [priority] (optional) Callback execution priority. Default value: 10 */subscribe = function(callback, topic, context, priority)
Usage
anyclip.widgets[0].subscribe(myFunc, <Event Name>);
Watch Players usage
Most watches have two widgets/players created under the hood. Usually, only the one of them (MAIN) is used for subscriptions. The following example shows how to subscribe to the watch w_viewAll event that is fired when user clicks on View All hyperlink to open a channel from the watch Main page.
anyclip.widgets
.find(w => w.customWidgetId && w.customWidgetId.startsWith('MAIN=='))
.subscribe(() => {
console.log('EVENT w_viewAll fired');
}, 'w_viewAll');
Examples
Anonymous function
anyclip.widgets[0].subscribe(()=>{
console.log('New clip started to play in player');
// More client code to execute when event fires
}, "playerClipImpression");
Named function
function myFunc(){
console.log('New clip started to play in player');
// More client code to execute when event fires
}
anyclip.widgets[0].subscribe(myFunc, "playerClipImpression");
Named function - with Parameters (for relevant events - see table above)
function myFunc(params){
console.log('New clip started to play in player');
// More client code to execute when event fires
}
anyclip.widgets[0].subscribe(myFunc, "playerClipImpression");
Note
The Subscribe function should be enabled for you by your AnyClip AM