Integration‎ > ‎

ipad video player

We have just rolled out a vdopia js plugin for video-js player. This plugin can be used to monetize (currently preroll) your video content by using video-js player. The API, that player exposes, is similar to video-js player which can be found at here. Here are the instructions for integrating vdopia plugin.

Including Javascript:

Video-js javascript/css is hosted on public CDN. You can include it in the head in the following manner.
<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script type='text/javascript' src="http://vjs.zencdn.net/3.2/video.js"></script>
Vdopia's javascript can be included in the following manner:
<script type='text/javascript' src="http://serve.vdopia.com/adserver/html5/getjs?file=video"></script> 

Setting up Video-JS player:

Video js player can be setup in the following way. First you need to have a video element in the html which will have content video URL in the src.
<video id=content_video class="video-js vjs-default-skin" controls  width=640 height=264 poster="http://video-js.zencoder.com/oceans-clip.jpg">
  <source src="CONTENT_VIDEO_URL" type='video/mp4'/>
</video>
OR
<video id=video class="video-js vjs-default-skin" controls  width=640 height=264 poster="http://video-js.zencoder.com/oceans-clip.jpg" src="CONTENT_VIDEO_URL">
</video>
Now after that you can put following piece of code in a script tag to initialize the video-js player.
_V_("contet_video", {}, function(){  //this is onReady function
  player = this;
  player.play(); // this will start playing the video content thought there are no preroll ads.
});
There are other ways to initialize it. Which can be found here.

Integrating Vdopia Ads:

For enabling vdopia ads you add an extra call in onReady function.
_V_("contet_video", {}, function(){  //this is onReady function
  player = this;
  player.enableVdopiaAd({ak:"VDOPIA_API_KEY"}); //this is just what it takes to enable vdopia ad.
  player.play(); // this will start playing the vdopia ad followed by content video if an ad is available. 
});

Events dispatched by player:

THe list of all the events that video-js player dispatches are listed here. Apart from these you can also listen to vdopia specific events.
 type description
 vdoerror Server Error, Api key provided as incorrect.
 vdonoadsavailable Currently there are no vdo ads available on your API Key.
 vdonoapikey API key was not provided
 vdoadstart Ad starts plating
 vdoadend Ad finishes playing
 vdoadclicked Ad is clicked / touched.

While registering listeners to video player, one can check for vdoState parameter's value to make sure that intended listeners are for content video or ad video. It can be set to either of 4 following values.
0: Internal Usage.
1: Internal Usage.
2: Ad is playing.
3: Content is playing.
Comments