Widgets for Ad Servers

These content widgets are sized to fit your existing web site templates.  They can be placed in any available advertisement space (400×300 or larger) and published using your existing advertisement server for easiest and broadest distribution.

Available Dynamic Lists

  • Movies of the Week [InTheatersThisWeek]
  • Top TV Shows [NewTV]
  • Top Game Trailers [PopularGames]
  • New on DVD [NewOnDVD]
  • In Theaters [InTheaters]
  • *** Featured [FeaturedPlacement]

Requirements

  1. Clients may not link to “auto start” video unless IVA player is “above the fold”.
  2. You may not include “auto start” video on a page that includes other “auto start” video.
  3. Widgets must be targeted to desktops only. Mobile is not supported at this time.

To get started or discuss setting up a test with IVA, please contact sales.

Implementation

<!-- Begin IVA Widget For Ad Servers  -->

Play

This method tells the player to start playing the content starting with a pre-roll. This is particularly useful in starting the player when the player comes into view (inview) of the user when the user scrolls down the page.

To send the play event to the player, use code below to post a message to the player iframe with the message 'Play'.

function sendmessage(msg) {
	var ifrm = document.getElementById("iva_iframe");
	ifrm.contentWindow.postMessage(msg, "http://syndication.videodetective.com");
}

// when you detect the player is in view, send the Play message to the player.
var msg = 'Play';
sendmessage(msg);



Pause

This method tells the player to pause playback.

To send the pause event to the player, use code below to post a message to the player iframe with the message 'Pause'.

function sendmessage(msg) {
	var ifrm = document.getElementById("iva_iframe");
	ifrm.contentWindow.postMessage(msg, "http://syndication.videodetective.com");
}



Paused

This method returns whether the player is paused on not (Boolean).



Muted

This method returns whether the player is muted on not (Boolean).



Mute

This method tells the player to Mute.



UnMute

This method tells the player to UnMute.



Height

This method returns the Height of the player.



Width

This method returns the Width of the player.



CurrentTime

This method returns the CurrentTime of the player.



RemainingTime

This method returns the RemainingTime of the player.

GetCurrentPlayerInfo

This method gets the starting video in the player's playlist as a JSON object to display appropriate heading, description, and image.

The return object looks like the following.
{'Response' : { 
  'id': 1234,
  'title': 'Title Of the Video',
  'description': "A full description about the video.",
  'image': "http://content.internetvideoarchive.com/photo/to/image.jpg"
}}

To access the meta data about the first title in the playlist from the player, you need to send a message containing 'GetCurrentPlayerInfo' to the player and set up an event listener 'message' to our page. When the player receives the request to 'GetCurrentPlayerInfo', it will send a message back containing the meta data.

Below is an example that opens an alert window displaying the meta data.

function sendmessage(msg) {
	var ifrm = document.getElementById("iva_iframe");
	ifrm.contentWindow.postMessage(msg, "http://syndication.videodetective.com");
}

// Handle for postMessage events sent from parent
window.addEventListener('message', receiveMessage, false);
function receiveMessage(event) {
	if (event.data.Response != undefined){
		alert('title: ' + event.data.Response.title + '\n' + '\n' 
		+ 'image: ' + event.data.Response.image + '\n' + '\n' 
		+ 'description: ' + event.data.Response.description + '\n' + '\n' 
		+ 'id: ' + event.data.Response.id);    
	}
}

// when you detect the player is in view, send the Play message to the player.
var msg = 'GetCurrentPlayerInfo';
sendmessage(msg);

To optimize impressions, we suggest that the player is autostarted (autostart:true) or autostart the player when the video player is in view.

To detect when the video is in view, you can use this script below which takes an element and determines if the element is in the Viewport and returns true or false.

// Check to see if player is in view.
function isElementInViewport (el) {
	var rect = el.getBoundingClientRect();
	return (
		rect.top >= 0 &&
		rect.left >= 0 &&
		rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
		rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */
	);
}

To put it all together, you need to set an interval to check if the player is in view and if it is, send the 'Play' event to the player.
Below is sample code to do just that.

// Check to see if player is in view.
function isElementInViewport (el) {
	var rect = el.getBoundingClientRect();
	return (
		rect.top >= 0 &&
		rect.left >= 0 &&
		rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
		rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */
	);
}

// handles sending the 'Play' event to the player when it is in view
function sendmessage(msg) {
	var ifrm = document.getElementById("iva_iframe");
	ifrm.contentWindow.postMessage(msg, "http://syndication.videodetective.com");
}


// check every 100 milliseconds to see if the player is in view
var IVA_CheckViewabilityInterval = setInterval(function () {
_checkIVAViewability();
console.log("IVA:: Interval of 1 second. Sending checkViewability.");
}, 100);
	
var visibleOnce = false;   //only send Play event once.
function _checkIVAViewability() {
	console.log("IVA:: checkIVAViewability called. visibleOnce = " + visibleOnce);
	if (visibleOnce == true) { return;}
	var my_element = document.getElementById('iva_iframe');
	if (isElementInViewport(my_element)) {
		console.log("IVA:: isInViewport = true");
		if (visibleOnce == false) {
			sendmessage('Play'); 
			visibleOnce = true;
			clearInterval(IVA_CheckViewabilityInterval);
		} else { console.log("IVA:: isInViewport = false"); }
	}
}