Skip to content
Product Documentation

Events

PoWa dispatches events to report its state to any listeners. There are certain window-level events to announce player instantiation or instantiation errors. The remaining events fire on the player object itself and relay the state of that specific player. A wildcard event, *, relays all events. All events are defined on window.PoWa.EVENTS but note that this will not be available until powa.js has been loaded to the page.

The PoWa object to listen to is reported on the POWA_READY event or can be located under the object window.powas keyed by the id of the .powa element.

Window events are CustomEvent events so the pertinent data is located under the detail parameter. PoWa has its own event system (on, off, once) that reports the pertinent information at the top level of the event object.

For a full list of events, you can log PoWa.EVENTS in the console

EVENTVALUEDATADESCRIPTION
POWA_READYpowaReady
{
"type": "powaReady",
"detail": {
"id": "powa-...",
"powa": "<PoWa object>"
},
...
}

Fires when a player is instantiated and ready for interaction.

window.addEventListener('powaReady", function(event) {
var playerID = event.detail.id;
var player = event.detail.powa;
...
});
POWA_ERRORpowaError
{
"type": "powaError",
"detail": {
"error": {
"error": "...",
"message": "...",
"uuid": "...",
},
"id": "powa-...",
"powa": "<PoWa object>"
},
...
}

Fires when a player fails to instantiate. One common cause for this error is that the video has reached its “publication end date” and is no longer available. The player is still viable, though, and will accept calls to loadVideo(‘<uuid>’).

window.addEventListenter('powaError", function(event) {
var error = event.detail.error;
var playerID = event.detail.id;
var powa = event.detail.powa;
powa.loadVideo('<backup video UUID>", powa.play);
});

Player Events

EVENTVALUEDATADESCRIPTION
ALL* 

Subscribe to all events.

powa.on('*", function (event, eventName) {...});
BUFFERINGpowaBuffering
{"type": "buffering"}

Fires when data is available for the current playback position, but not enough to actually play more than one frame.
For testing, adjusting “throttling” in browser dev tools work to trigger the powaBuffer event

COMPLETEcomplete
{"type": "complete"}
The content has finished playing.
ENDend
{"type": "end"}
The video has either errored out, been skipped, or reached completion.
ERRORerror
{"type": "error"}
The video has experienced an error.
FIRST_FRAMEfirstFrame
{"type": "firstFrame"}

This event ensures that the first frame of the content is visible to the user. The content is playing.

LOADEDloaded
{"type": "loaded"}
Loading of media has begun.
MEDIA_STARTmediaStart
{"type": "mediaStart"}
When the content is set and ads rolled, the player triggers this event for internal components to prepare to play content.
NOT_VIEWABLEnotViewable
{
"type": "notViewable",
"isViewable": false,
"intersectionRatio": 0.5,
}
Fires when an element hits the viewable threshold (default: 0.5) is vertically outside of the viewport. The default can be overridden via a threshold option, powa.on(PoWa.EVENTS.NOT_VIEWABLE, notViewableHandler, {"threshold": 0.0}). The threshold can be set from 0 (any amount of element not visible) to 1 (entire element not visible). Multiple VIEWABLE or NOT_VIEWABLE listeners can be registered but only the threshold of the first listener is honored, all other listeners will be triggered at that initial threshold.
VIEWABLEviewable
{
"type": "viewable",
"isViewable": true,
"intersectionRatio": 0.5,
}
Fires when an element hits the viewable threshold (default: 0.5) is vertically within the viewport. The default can be overridden via a threshold option, powa.on(PoWa.EVENTS.VIEWABLE, viewableHandler, {"threshold": 1.0}). The threshold can be set from 0 (any amount of element visible) to 1 (entire element visible). Multiple VIEWABLE or NOT_VIEWABLE listeners can be registered but only the threshold of the first listener is honored, all other listeners will be triggered at that initial threshold.
PAUSEpause
{"type": "pause"}
The video has been paused.
PLAYplay
{"type": "play"}
The video is playing.
PROGRESSprogress
{"type": "progress"}
Reports the amount of buffered media that has been loaded.
SKIPskip
{"type": "skip"}
This event indicates the user skipped the displayed ad.
STARTstart
{"type": "start"}
The sequence of events for a new video has begun. The event is triggered when the user clicks a promo image or the auto play feature is engaged. From this event, the content playback flow begins. The event begins to download information about the video to play, and, if there are ads, the corresponding requests are made to play them. The content is not playing yet.
TIMEtime
{
"time": 1.340799,
"controls": true,
"duration": 6.130067,
"source": "<stream URL>",
"running": true,
"state": "playing",
"type": "time",
"event": "{<Media Event>}"
}
The current timing information of the video. Fires about once per second.
POWA_RENDERpowaRenderDefaultThe player has appeared on the page.
PLAYBACK_0playback0 This event is called immediately after MEDIA_START is triggered. This event indicates that playback has started but content is not guaranteed to be currently viewable.
PLAYBACK_25playback25 The video is 25% complete. This event triggers only if the content reaches the 25% played mark.
PLAYBACK_50playback50 The video is 50% complete. This event triggers only if the content reaches the 50% played mark.
PLAYBACK_75playback75 The video is 75% complete. This event triggers only if the content reaches the 75% played mark.
PLAYBACK_100playback100 The video is complete. This event triggers only if the content reaches the 100% played mark. This event is called immediately after COMPLETE is triggered.
PROMO_CLICKpromoClick
{
"type": "promoClick",
"event": "{<Native Event>}"
}
The user has clicked a .powa-shot-click element on the promo.
PROMO_CUSTOMpromoCustom
{
"type": "promoCustom",
"event": "{<Native Event>}"
}
The user has interacted with a .powa-shot-<(click|hover|touch)>-<custom event> element on the promo. Will subsequently fire a promo(Click|Hover|Touch)<Custom> event (e.g.
would fire promoCustom then promoClickTest).
PROMO_HOVERpromoHover
{
"type": "promoHover",
"event": "{<Native Event>}"
}
The user has clicked a .powa-shot-click-play element on the promo (issues ‘play()’ on the accompanying player).
PROMO_TOUCHpromoTouch
{
"type": "promoTouch",
"event": "{<Native Event>}"
}
The user has touched a ‘.powa-shot-touch’ element on the promo.

Ads Events

EVENTVALUEDATADESCRIPTION
AD_BAR_MUTEadBarMute
{"type": "adBarMute"}
The user clicked ‘mute’ on the ad bar.
AD_BAR_PAUSEadBarPause
{"type": "adBarPause"}
The user clicked ‘pause’ on the ad bar.
AD_BAR_PLAYadBarPlay
{"type": "adBarPlay"}
The user clicked ‘play’ on the ad bar.
AD_BAR_SKIPadBarSkip
{"type": "adBarSkip"}
The user clicked ‘skip’ on the ad bar.
AD_CLICKadClick
{
"type": "adClick",
"adMeta": "{...}"
}
The user clicked the preroll ad.
AD_COMPANIONSadCompanions
{
"adCompanions": [
"{<adCompanion>}",
"{<adCompanion>}",
...
],
"type": "adCompanions"
}
The ad has companion ads available.
AD_COMPLETEadComplete
{
"type": "adComplete",
"adMeta": "{...}"
}
The ad has played through to completion.
AD_DESTROYEDadDestroyed
{"type": "adDestroyed"}
The ad module has been torn down.
AD_DURATION_CHANGEadDurationChange
{"type": "adDurationChange"}
The duration of the ad has changed.
AD_ENDadEnd
{"type": "adEnd"}
The ad has errored out, been skipped, or reached completion.
AD_ERRORadError
{
"type": "adError",
"error": "<error message>",
"event": {...}
}
The ad has experienced an error.
AD_FIRST_FRAMEadFirstFrame
{
"type": "adFirstFrame",
"adMeta": {...}
}
The ad video has begun playing.
AD_LOADEDadLoaded
{
"type": "adLoaded",
"adMeta": {...}
}
Ad has been loaded
AD_MUTEadMute
{
"type": "adMute",
"muted": (true|false)
}
The ad has been muted.
AD_PAUSEadPause
{
"type": "adPause",
"adMeta": {...}
}
The ad has been paused.
AD_PLAYadPlay
{
"type": "adPlay",
"adMeta": {...}
}
The ad is playing.
AD_SETUP_ERRORadSetupError
{"type": "adSetupError"}
The ad module has failed to instantiate.
AD_SKIPadSkip
{"type": "adSkip"}
The ad has been skipped.
AD_STARTadStart
{"type": "adStart"}
The sequence of ad events has begun.
AD_START_UNREPORTEDadStartUnreported
{"type": "adStartUnreported"}
The ad in question is buggy and does not report ‘timeRemaining’ so we use a shadow timer instead.
AD_TIMEadTime
{
"duration": 15.065,
"elapsed": 1.087,
"remaining": 13.978,
"type": "adTime'
}
The current timing information of the ad. Fires about once per second.