Iframe API Reference

Methods#

PLAY#

Plays or resumes the video.

window.wirewax.triggerEvent(window.wirewax.events.triggers.PLAY)

PAUSE#

Pauses the video.

window.wirewax.triggerEvent(window.wirewax.events.triggers.PAUSE)

SEEK#

Seeks the video to the value of data in seconds. data must be an int or float.

window.wirewax.triggerEvent(window.wirewax.events.triggers.SEEK, 20)

GO_TO_TAG#

Seeks the video to the starting time of the tag. data is the spriteId of the tag.

window.wirewax.triggerEvent(window.wirewax.events.triggers.GO_TO_TAG, 6145757)

OPEN_TAG#

Seeks the video to the starting time of the tag and opens the overlay associated with that tag. data is the spriteId of the tag.

window.wirewax.triggerEvent(window.wirewax.events.triggers.OPEN_TAG, 6145757)

CLOSE_WIDGET#

Closes widget/overlay.

window.wirewax.triggerEvent(window.wirewax.events.triggers.CLOSE_WIDGET)

Getters#

GET_CURRENT_TIME#

Triggers the return current time event.

window.wirewax.triggerEvent(window.wirewax.events.triggers.GET_CURRENT_TIME)

IS_PLAYER_READY#

Triggers the player ready event if the player is ready.

window.wirewax.triggerEvent(window.wirewax.events.triggers.IS_PLAYER_READY)

Setters#

MUTE_VOLUME#

Mute volume.

window.wirewax.triggerEvent(window.wirewax.events.triggers.MUTE_VOLUME)

UNMUTE_VOLUME#

Unmute volume.

window.wirewax.triggerEvent(window.wirewax.events.triggers.UNMUTE_VOLUME)

CHANGE_VOLUME#

Changes the volume. The data is a float between 0 and 1.

Note: CHANGE_VOLUME is not supported on iOS, as iOS does not allow to set volume programmatically. We recommend to use MUTE_VOLUME and UNMUTE_VOLUME instead.

window.wirewax.triggerEvent(window.wirewax.events.triggers.CHANGE_VOLUME, 0.3)

DEVICE_MOTION#

note

This event is for customization only in Player 4. Player 5 no longer support this event.

Inform the player of the device motion. The device motion can be retrieved from the window event “devicemotion”. The data must have the following properties:

var data = {
accelerationIncludingGravity: {
z: **value**
}
}
var data = {
accelerationIncludingGravity: {
z: **value**
}
}
window.wirewax.triggerEvent(window.wirewax.events.triggers.DEVICE_MOTION, data)

DEVICE_ORIENTATION#

note

This event is for customization only in Player 4. Player 5 no longer support this event.

Inform the player of the device orientation. The device orientation can be retrieved from the window event “deviceorientation”.
The data must have the following properties:

var data = {
gamma: **value**,
alpha: **value**,
beta: **value**,
webkitCompassHeading: **value** [optional]
}
var data = {
gamma: **value**,
alpha: **value**,
beta: **value**,
webkitCompassHeading: **value** [optional]
}
window.wirewax.triggerEvent(window.wirewax.events.triggers.DEVICE_ORIENTATION, data)

DEVICE_SCREEN_ORIENTATION#

note

This event is for customization only in Player 4. Player 5 no longer support this event.

Inform the player of the device screen orientation. The device screen orientation can be retrieved from the window event “orientationchange” .
The data must be one of the following values: -90, 0, 90, 180.

window.wirewax.triggerEvent(window.wirewax.events.triggers.DEVICE_SCREEN_ORIENTATION, -90)

CLIENT_CUSTOM_TRIGGER#

note

This event is for customization only in Player 4. Player 5 no longer support this event.

window.wirewax.triggerEvent(window.wirewax.events.triggers.CLIENT_CUSTOM_TRIGGER, data)

Event Listeners#

PLAYER_READY#

Triggered when the player is ready.

window.wirewax.addEventListener(window.wirewax.events.listeners.PLAYER_READY, function() {
// Player is ready
})

VIDEO_END#

Triggered when the video has ended.

window.wirewax.addEventListener(window.wirewax.events.listeners.VIDEO_END, function() {
// video has ended
})

HAS_PAUSED#

Triggered when the video is paused.

window.wirewax.addEventListener(window.wirewax.events.listeners.HAS_PAUSED, function() {
// video is paused
})

HAS_PLAYED#

Triggered when the video is played.

window.wirewax.addEventListener(window.wirewax.events.listeners.HAS_PLAYED, function() {
// video is played
})

HAS_SEEKED#

Triggered when the user seeks in the video. Passes information about the seeked to time to the callback.

window.wirewax.addEventListener(window.wirewax.events.listeners.HAS_SEEKED, function(data) {
console.log(data)
// {
// name: "hasSeeked"
// data: 20
// }
})

STARTED_BUFFERING#

note

Player 5 no longer support this event.

Triggered when the player starts buffering.

window.wirewax.addEventListener(window.wirewax.events.listeners.STARTED_BUFFERING, function() {
// Player starts buffering
})

ENDED_BUFFERING#

note

Player 5 no longer support this event.

Triggered the player has finished buffering.

window.wirewax.addEventListener(window.wirewax.events.listeners.ENDED_BUFFERING, function() {
// Player has finished buffering
})

TAG_CLICK#

Triggered when a tag is clicked. Passes the tag object which has been clicked through to the callback.

window.wirewax.addEventListener(window.wirewax.events.listeners.TAG_CLICK, function(data) {
console.log(data)
// { data:
// tagData: {
// customNameRef: "custom ref in studio",
// nameLink: 337933,
// spriteId: 6146547,
// tagId: 100596,
// tagName: "testing hotspot"
// },
// name: "tagClick",
// uniqueViewId: "e44c6863-1159-48a8-9b35-467b1e21eba0",
// vidId: 8169359,
// vidName: "test",
// duration: 232.62,
// }
})

ADD_TO_CART#

Triggered when an addToCart link is clicked (only for customisations where this has been implemented). Passes information about the added product to the callback.

window.wirewax.addEventListener(window.wirewax.events.listeners.ADD_TO_CART, function(data) {
// add to cart
})

RETURN_CURRENT_TIME#

Triggered when the getCurrentTime event is triggered. Passes information about the current time to the callback.

Note: Requesting the current time more than once per second might lead to player slowdown.

window.wirewax.addEventListener(window.wirewax.events.listeners.RETURN_CURRENT_TIME, function(data) {
console.log(data)
// {
// data: {
// currentTime: 10
// },
// name: "returnCurrentTime",
// uniqueViewId: "d19e85a6-31c3-417a-8a10-d2752a1ad6bd",
// vidId: 8169359,
// vidName: "test",
// duration: 232.62,
// }
})

WIDGET_SHOWN#

Triggered when the widget/overlay is open.

Note: Only Player 5 will return hotspot meta data.

// Old Player
window.wirewax.addEventListener(window.wirewax.events.listeners.WIDGET_SHOWN, function() {
console.log(data)
// {
// data: undefined,
// name: "widgetShown",
// uniqueViewId: "e7ac1417-b7ce-4108-a4d0-e32d198bdadd",
// vidId: 8169359
// vidName: "test",
// duration: 232.62,
// }
})
// New Player
window.wirewax.addEventListener(window.wirewax.events.listeners.WIDGET_SHOWN, function() {
console.log(data)
// {
// data: {
// customNameRef: "This is meta data",
// nameLink: 337723,
// spriteId: 6145757,
// tagId: 100596,
// tagName: "1"
// },
// name: "widgetShown",
// uniqueViewId: "e7ac1417-b7ce-4108-a4d0-e32d198bdadd",
// vidId: 8169359,
// vidName: "test",
// duration: 232.62,
// }
})

WIDGET_CLOSED#

Triggered when the widget/overlay is closed.

Note: Only Player 5 will return hotspot meta data.

// Old Player
window.wirewax.addEventListener(window.wirewax.events.listeners.WIDGET_CLOSED, function() {
console.log(data)
// {
// data: undefined,
// name: "widgetShown",
// uniqueViewId: "e7ac1417-b7ce-4108-a4d0-e32d198bdadd",
// vidId: 8169359
// vidName: "test",
// duration: 232.62,
// }
})
// New Player
window.wirewax.addEventListener(window.wirewax.events.listeners.WIDGET_SHOWN, function() {
console.log(data)
// {
// data: {
// customNameRef: "This is meta data",
// nameLink: 337723,
// spriteId: 6145757,
// tagId: 100596,
// tagName: "1"
// },
// name: "widgetShown",
// uniqueViewId: "e7ac1417-b7ce-4108-a4d0-e32d198bdadd",
// vidId: 8169359,
// vidName: "test",
// duration: 232.62,
// }
})

VOLUME_CHANGE#

window.wirewax.addEventListener(window.wirewax.events.listeners.VOLUME_CHANGE, function() {
console.log(data)
// {
// data: {
// volume: 0.325
// },
// name: "volumeChange",
// uniqueViewId: "cc0867cc-3c28-427d-84be-7c23c2419097",
// vidId: 8169359,
// vidName: "test",
// duration: 232.62,
// }
})

CLIENT_CUSTOM_EVENT#

note

Player 5 no longer support this event.

Triggered when the volume is changed.

window.wirewax.addEventListener(window.wirewax.events.listeners.CLIENT_CUSTOM_EVENT, function(data) {
console.log(data)
})

OVERLAY_EVENT#

note

This event is only available in Player 5.

Triggered when "Add to cart" or "Clickthrough" buttons inside overlay are clicked.

window.wirewax.addEventListener(window.wirewax.events.listeners.OVERLAY_EVENT, function(data) {
console.log(data)
// { data:
// {
// action: "addToCart or clickthrough",
// value: "product info or clickthrough link",
// spriteId: 6146547,
// overlayId: "257255",
// },
// name: "overlayEvent",
// uniqueViewId: "e44c6863-1159-48a8-9b35-467b1e21eba0",
// vidId: 8169359,
// vidName: "test",
// duration: 232.62,
// }
})

Breaking Changes#

  • Player 4 doesn't support OVERLAY_EVENT listener.
  • Player 5 no longer support trigger event DEVICE_MOTION, DEVICE_ORIENTATION, DEVICE_SCREEN_ORIENTATION, CLIENT_CUSTOM_TRIGGER, customization features are implemented within Studio now.
  • Player 5 no longer support listener event STARTED_BUFFERING, ENDED_BUFFERING, CLIENT_CUSTOM_EVENT, because of tech stacks upgrade.
  • Player 5 no longer support enableGyro().
Edit this page