AdProduct API (jpxApi)

The AdProduct API is an interface with the adproduct. It can be accessed from the PremiumJS library on the Premium.jpxApi namespace.

jpxApi.addSheet(styles);

This function allows adding your own styles.

jpxApi.addSheet('body { background: red; }');

This function is compatible with the products below:

Code	Product
all	all

jpxApi.allowToExpand();

Information for the product that expanding of the top layer is allowed. It is also information that tracking should be sent when the user, for example, presses the expand button.

jpxApi.allowToExpand();

This function is compatible with the products below:

Code	Product
wp	Wallpaper Fireplace Pushdown
wp	Rich Skin

jpxApi.changeCounterColor(spinnerColor, numberColor);

This funtion allows changing the look of the color and the counter of the spinner.

jpxApi.changeCounterColor('red', '#FFF');

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.close();

Function responsible for closing the product and it removes all of the content connected with it.

jpxApi.close();

This function is compatible with the products below:

Code	Product
all	all

jpxApi.clearInit(fn);

Fires the function after destroying the product.

window.top.document.body.style.marginTop = '1000px';
function fn() {
  window.top.document.body.style.marginTop = '0px';
}
jpxApi.clearInit(fn);

This function is compatible with the products below:

Code	Product
all	all

jpxApi.createVideo(name, element, source, jpControls);

The function is responsible for creating a vast or local video element in custom creative.

Vast video:
jpxApi.createVastVideo('master', '#elmId', 'https://track.adform.net/serving/videoad/?bn=22592277', false);

Local video:
jpxApi.createVideo('master', '#elmId', { src: "assets/video.mp4", type: "video/mp4" }, true);

This function is compatible with the products below:

Code	Product
all	all

##jpxApi.disablePushBody(); Don't add a 'margin-top' style to the body element.

jpxApi.disablePushBody();

This function is compatible with the products below:

Code	Product
wp	Rich Skin

jpxApi.expandTop(value);

This function is responsible for making the top layer expandable on mouseover. After using this function, the "mouseenter" and "mouseleave" events are added to the top layer. The top layer extends by the given value.

jpxApi.expandTop(580);

This function is compatible with the products below:

Code	Product
wp	wallpaper fireplace

jpxApi.geo();

This function returns the geo details of the user.

console.log(jpxApi.geo());
setTimeout(function () {
  console.log(jpxApi.geo().country);
}, 5000);

This function is compatible with the products below:

Code	Product
all	all

jpxApi.getPercentageVideoVisibility();

This function returns the actual percentage of the visibility of the ad video.

setTimeout(function () {
  if (jpxApi.getPercentageVideoVisibility() > 40) {
    console.log(jpxApi.getPercentageVideoVisibility());
  }
}, 5000);
setInterval(function () {
  console.log(jpxApi.getPercentageVideoVisibility());
}, 1000);
window.addEventListener('scroll', function () {
  console.log(jpxApi.getPercentageVideoVisibility());
});

Mobile Skin
window.addEventListener('scroll', function () {
  console.log(jpxApi.getPercentageVideoVisibility('top'));
});
window.addEventListener('scroll', function () {
  console.log(jpxApi.getPercentageVideoVisibility('main'));
});
window.addEventListener('scroll', function () {
  console.log(jpxApi.getPercentageVideoVisibility('bottom'));
});

This function is compatible with the products below:

Code	Product
hi	HalfPage Interscroller
fi	FullPage Interscroller
is	Mobile Interscroller
mt	Mobile Skin

jpxApi.getPercentageVisibility();

This function returns the actual percentage of the visibility of the ad.

setTimeout(function(){ if(jpxApi.getPercentageVisibility() > 40) { console.log( jpxApi.getPercentageVisibility() ); } }, 5000);
setInterval( function(){ console.log( jpxApi.getPercentageVisibility() ); }, 1000);
window.addEventListener('scroll', function(){ console.log(jpxApi.getPercentageVisibility()) });
Example of use ( Ladder Ad ):

window.addEventListener('scroll', function(){ console.log(jpxApi.getPercentageVisibility()['top']) });
window.addEventListener('scroll', function(){ console.log(jpxApi.getPercentageVisibility()['main']) });
window.addEventListener('scroll', function(){ console.log(jpxApi.getPercentageVisibility()['bottom']) });

This function is compatible with the products below:

Code	Product
hi	HalfPage Interscroller
fi	FullPage Interscroller
is	Mobile Interscroller
mt	Mobile Skin

jpxApi.getVideoControlsVersion();

Get the current version of the video controls.

jpxApi.getVideoControlsVersion();

This function is compatible with the products below:

Code	Product
all	all

jpxApi.hideCloseButton(elm);

This function is responsible for hiding the close button. For working the function properly it is necessary to transfer the element by which it would be possible to close the ad after pushing it.

var elm = document.querySelector('#elm');
jpxApi.hideCloseButton(elm);

This function is compatible with the products below:

Code	Product
as	Pushup Leaderboard
pd	PushDown
sa	Side Ad

jpxApi.hideCounter();

This function allows you to hide the counter.

jpxApi.hideCounter();

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.isMobile();

Detect whether or not a user is using a mobile device.

jpxApi.isMobile();

This function is compatible with the products below:

Code	Product
all	all

jpxApi.makeFixedHeight();

Set a fixed frame height. The frame element will not resize if the window height changes.

jpxApi.makeFixedHeight();

This function is compatible with the products below:

Code	Product
is	Mobile Scroller

jpxApi.makeTopLayerFixed();

This function allows you to simulate top layer as it would be fixed.

jpxApi.makeTopLayerFixed();

This function is compatible with the products below:

Code	Product
fp	Wallpaper FirePlace

jpxApi.mute();

Function responsible for muting the video.

jpxApi.mute();

This function is compatible with the products below:

Code	Product
wv	Video

jpxApi.onNativeEvent(state, fn);

This function adds an event ( e.g. "orientationchange" ) to the top scope. Passed function will be fired when the event is fired ( e.g. orientation of the device has changed ).

function fn() {
  console.log(screen.orientation.angle);
}
jpxApi.onNativeEvent('orientationchange', fn);

This function is compatible with the products below:

Code	Product
all	all

jpxApi.on('bottomDefault', fn);

This function informs when the bottom part of the ad has a default position. At this very moment, it is possible to fire our own function.

jpxApi.on('bottomDefault', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
ca	Cascade Ad
pd	PushDown Regular
pd	PushDown Advanced

jpxApi.on('bottomExpand', fn);

This function informs when the bottom part of the ad is expanding. At this very moment, it is possible to fire our own function.

jpxApi.on('bottomExpand', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
ca	Cascade Ad
pd	PushDown Regular
pd	PushDown Advanced

jpxApi.on('bottomShow', fn);

This function informs when the bottom part of the ad is displaying. At this very moment, it is possible to fire our own function.

jpxApi.on('bottomShow', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
ca	Cascade Ad

jpxApi.on('close', fn);

This function informs when the ad is closed. At this very moment, it is possible to fire our own function.

jpxApi.on('close', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
pu	Pushup Billboard
sa	Side Ad

jpxApi.on('default', fn);

This function informs when the ad is half-visible. At this very moment, it is possible to fire our own function.

jpxApi.on('default', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
pu	Pushup Billboard
sa	Side Ad

jpxApi.on('expand', fn);

This function informs when the ad is expanded. At this very moment, it is possible to fire our own function.

jpxApi.on('expand', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
pu	Pushup Billboard
sa	Side Ad

jpxApi.on('pushDown', fn);

Function responsible for pushing down the content of the website.

jpxApi.on('pushDown', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.on('pushUp', fn);

Function responsible for pushing the content of the website up.

jpxApi.on('pushUp', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.on('rightDefault', fn);

This function informs when the right part of the ad has a default position. At this very moment, it is possible to fire our own function.

jpxApi.on('rightDefault', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
pd	PushDown Regular
pd	PushDown Advanced

jpxApi.on('rightExpand', fn);

This function informs when the right part of the ad is expanding. At this very moment, it is possible to fire our own function.

jpxApi.on('rightExpand', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
pd	PushDown Regular
pd	PushDown Advanced

jpxApi.on('topDefault', fn);

This function informs when the top part of the ad has a default position. At this very moment, it is possible to fire our own function.

jpxApi.on('topDefault', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
ca	Cascade Ad

jpxApi.on('topExpand', fn);

This function informs when the top part of the ad is expanding. At this very moment, it is possible to fire our own function.

jpxApi.on('topExpand', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
ca	Cascade Ad

jpxApi.on('topShow', fn);

This function informs when the top part of the ad is displaying. At this very moment, it is possible to fire our own function.

jpxApi.on('topShow', function () {
  // Your function
});

This function is compatible with the products below:

Code	Product
ca	Cascade Ad

jpxApi.pause();

The function is responsible for pausing the video.

jpxApi.pause();

This function is compatible with the products below:

Code	Product
wv	Video

jpxApi.play();

The function is responsible for playing the video.

jpxApi.play();

This function is compatible with the products below:

Code	Product
wv	Video Wallpaper

jpxApi.preventExpand();

This function is responsible for preventing product against expanding.

jpxApi.preventExpand();

This function is compatible with the products below:

Code	Product
wp	Wallpaper Fireplace Pushdown
wp	Rich Skin

jpxApi.pushDown();

The function is responsible for pushing down the content of the website.

jpxApi.pushDown();

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.pushUp();

The function is responsible for pushing the content of the website up.

jpxApi.pushUp();

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.removeBoxShadow();

Function responsible for removing the box shadow.

jpxApi.removeBoxShadow();

This function is compatible with the products below:

Code	Product
is	Mobile Scroller
pu	Pushup Billboard

jpxApi.setCollapsedHeight(size, unit);

This function allows for changing the collapsed height.

jpxApi.setCollapsedHeight(10, 'percent');
jpxApi.setCollapsedHeight(50, 'pixels');

This function is compatible with the products below:

Code	Product
cf	Classic Floorad

jpxApi.setExpandedHeight(size, unit);

This function allows for changing the expanded height.

jpxApi.setExpandedHeight(40, 'percent');
jpxApi.setExpandedHeight(200, 'pixels');

This function is compatible with the products below:

Code	Product
cf	Classic Floorad

jpxApi.setHeight(size, unit);

This function allows for changing the product height.

jpxApi.setHeight(50, 'pixels');
jpxApi.setHeight(20, 'percent');

This function is compatible with the products below:

Code	Product
ms	Mobile Sticky

jpxApi.setSiteWidth(width);

This funtion allows changing the width of the website.

jpxApi.setSiteWidth(1920);

This function is compatible with the products below:

Code	Product
all	all

jpxApi.setTopPosition(marginTop, boolean);

This function allows for changing the 'margin-top' of the website body element.

jpxApi.setTopPosition(250, false);

This function is compatible with the products below:

Code	Product
wp	Wallpaper

jpxApi.switchLayersToAbsolute();

This function allows you to switch all layers positioning from fixed to absolute.

jpxApi.switchLayersToAbsolute();

This function is compatible with the products below:

Code	Product
wp	Wallpaper
wv	Video Wallpaper

jpxApi.track(event, action);

This function allows you to send a custom tracking from a creative.

function scrollEvent(event) {
  jpxApi.track(event, 'Scroll Event');
}

function clickEvent(event) {
  jpxApi.track(event, 'Click Event');
}

This function is compatible with the products below:

Code	Product
all	all

jpxApi.trackVideo(elm);

This function allows you to send a custom video tracking from a creative.

Description of the tracking objects:

ped ( ended )
per ( error )
ppu ( pause )
ppl ( play )
pfq ( firstQuartile )
pmp ( midpoint )
ptq ( thirdQuartile )
pmt ( muted )
pum ( unmuted )

var videoElm = window.document.getElementById('#video');
jpxApi.trackVideo(videoElm);

This function is compatible with the products below:

Code	Product
all	all

jpxApi.unmute();

Function responsible for unmuting the video.

jpxApi.unmute();

This function is compatible with the products below:

Code	Product
wv	Video

AdProduct API (jpxApi)

jpxApi.addSheet(styles);​

jpxApi.allowToExpand();​

jpxApi.changeCounterColor(spinnerColor, numberColor);​

jpxApi.close();​

jpxApi.clearInit(fn);​

jpxApi.createVideo(name, element, source, jpControls);​

jpxApi.expandTop(value);​

jpxApi.geo();​

jpxApi.getPercentageVideoVisibility();​

jpxApi.getPercentageVisibility();​

jpxApi.getVideoControlsVersion();​

jpxApi.hideCloseButton(elm);​

jpxApi.hideCounter();​

jpxApi.isMobile();​

jpxApi.makeFixedHeight();​

jpxApi.makeTopLayerFixed();​

jpxApi.mute();​

jpxApi.onNativeEvent(state, fn);​

jpxApi.on('bottomDefault', fn);​

jpxApi.on('bottomExpand', fn);​

jpxApi.on('bottomShow', fn);​

jpxApi.on('close', fn);​

jpxApi.on('default', fn);​

jpxApi.on('expand', fn);​

jpxApi.on('pushDown', fn);​

jpxApi.on('pushUp', fn);​

jpxApi.on('rightDefault', fn);​

jpxApi.on('rightExpand', fn);​

jpxApi.on('topDefault', fn);​

jpxApi.on('topExpand', fn);​

jpxApi.on('topShow', fn);​

jpxApi.pause();​

jpxApi.play();​

jpxApi.preventExpand();​

jpxApi.pushDown();​

jpxApi.pushUp();​

jpxApi.removeBoxShadow();​

jpxApi.setCollapsedHeight(size, unit);​

jpxApi.setExpandedHeight(size, unit);​

jpxApi.setHeight(size, unit);​

jpxApi.setSiteWidth(width);​

jpxApi.setTopPosition(marginTop, boolean);​

jpxApi.switchLayersToAbsolute();​

jpxApi.track(event, action);​

jpxApi.trackVideo(elm);​

jpxApi.unmute();​

jpxApi.addSheet(styles);

jpxApi.allowToExpand();

jpxApi.changeCounterColor(spinnerColor, numberColor);

jpxApi.close();

jpxApi.clearInit(fn);

jpxApi.createVideo(name, element, source, jpControls);

jpxApi.expandTop(value);

jpxApi.geo();

jpxApi.getPercentageVideoVisibility();

jpxApi.getPercentageVisibility();

jpxApi.getVideoControlsVersion();

jpxApi.hideCloseButton(elm);

jpxApi.hideCounter();

jpxApi.isMobile();

jpxApi.makeFixedHeight();

jpxApi.makeTopLayerFixed();

jpxApi.mute();

jpxApi.onNativeEvent(state, fn);

jpxApi.on('bottomDefault', fn);

jpxApi.on('bottomExpand', fn);

jpxApi.on('bottomShow', fn);

jpxApi.on('close', fn);

jpxApi.on('default', fn);

jpxApi.on('expand', fn);

jpxApi.on('pushDown', fn);

jpxApi.on('pushUp', fn);

jpxApi.on('rightDefault', fn);

jpxApi.on('rightExpand', fn);

jpxApi.on('topDefault', fn);

jpxApi.on('topExpand', fn);

jpxApi.on('topShow', fn);

jpxApi.pause();

jpxApi.play();

jpxApi.preventExpand();

jpxApi.pushDown();

jpxApi.pushUp();

jpxApi.removeBoxShadow();

jpxApi.setCollapsedHeight(size, unit);

jpxApi.setExpandedHeight(size, unit);

jpxApi.setHeight(size, unit);

jpxApi.setSiteWidth(width);

jpxApi.setTopPosition(marginTop, boolean);

jpxApi.switchLayersToAbsolute();

jpxApi.track(event, action);

jpxApi.trackVideo(elm);

jpxApi.unmute();