Skip to main content
Custom X-Ray Campaigns
Updated over a week ago

Overview

AnyClip's X-Ray Campaign functionality allows companies to integrate and showcase multiple offers or calls-to-action with custom graphic overlays and click-through capability in both live and on-demand video. X-ray enables you to schedule campaigns, adjust and target messaging and monitor performance as they occur

The Custom X-Ray Campaigns API provides the ability to customize X-Ray functionality using an API. Specifically, customers can render X-Ray-like creatives on a player widget with customer-side content generated on-the-fly.

API

Start show X-Ray visual elements:

showXRay(xrayData);

where “xrayData“ is an object containing creatives and buttons.

If “xrayData“ is null or not specified, this command will close currently displaying custom X-Ray, like the method “hideXRay()“.

If "xrayData" is not valid (one of the required text strings is missing, empty, or contains spaces), this command will be ignored.

Custom X-Ray Campaign Data Format

const xrayData = {
id: 369, // mandatory, integer from 0 to 9999999999
name: 'line-369', // optional
creatives: [
{
id: 749, // mandatory, integer from 0 to 9999999999
title: 'Creative Alpha', // mandatory
image: '/images/creatives/icon-alpha.jpg', // mandatory
buttons: [
{ // first button is mandatory
label: 'Learn more...', // mandatory
url: '/pages/learn-more/alpha.html', // optional
tooltip: 'Click here to learn more about Alpha', // optional
},
{ // second button is optional
label: 'Your opinion...', // mandatory
tooltip: 'Click here to answer the questions, // optional
},
],
},
// second creative (optional) ...
// third creative (optional) ...
],
};

Restrictions

A maximum of 3 creatives are allowed with 1 or 2 buttons each. Data exceeding these limits will be ignored.

Additional Parameters for the Buttons

For any button – any set of custom parameters may be added, excluding the parameters mentioned below in the table of notifications.

These parameters will be reproduced in the button-related data object received via “button click” notification. These parameters may be useful to identify the buttons and corresponding actions without using indexes.

For example, you can add to the button data a new parameter “tag” as number, string or complex object. You will receive this parameter as is (in the notification handler) and it may be used for any purpose by the caller.

Hide Custom X-Ray

In order to hide the Custom X-Ray campaign, close the custom X-Ray currently displayed (no parameters required):

hideXRay();

Notifications

Here we describe notifications of user actions related to the X-Ray Campaign. To get notifications use the player's internal EventBus. Subscribe with the subscribe() method. For example:

...
widget.subscribe(onXRayButtonClick, 'LuxButtonClick');
...
function onXRayButtonClick(dto) {
console.log('X-RAY BUTTON CLICK', dto);
...
...}

Event: LuxButtonClick

Description: One of the X-Ray buttons has been clicked

Event Data: Button-related info (object). For example:

{
"lineId": 369,
"lineName": "line-369",
"creativeIndex": 1,
"creativeId": 749,
"creativeTitle": "Creative Alpha",
"buttonIndex": 1,
"label": "Learn more...",
"url": "/pages/learn-more/alpha.html",
}

Additionally, the parameter "creativeIndex" is the position of the creative in the list, from top to bottom (1-based).

The parameter "buttonIndex" is the position of the button in the corresponding creative, from left to right (1-based).

Any custom parameters for the button will be added here as is.

Did this answer your question?