Using the IMA SDK with Video JS

830 views
Skip to first unread message

Ken Guie

unread,
Mar 23, 2018, 4:51:57 PM3/23/18
to Interactive Media Ads SDK
Good afternoon all, 

I'm working on the videoJS player and we're using the IMA SDK. 

I'm trying to figure out how to stop the situation where the video plays a fraction of the video to a few seconds of the video before the ad starts playing. 

It seems to be longer or shorter depending on whatever site is using the player but there is always some video playing before the ad. 

Is there anyway to fix this? 

I looked at the demo on codepen as well and built my own demo serving from a python server - google makes mention of it in the documentation.

On the codepen demo, it seems to run with out any part of the video playing before the ad. 

But on my sample, I do see a slight frame or 2 that plays before the ad. 

index.html
<html>
<head>
<!-- Load dependent stylesheets. -->
<link rel="stylesheet" href="//googleads.github.io/videojs-ima/node_modules/video.js/dist/video-js.min.css" />
<link rel="stylesheet" href="//googleads.github.io/videojs-ima/node_modules/videojs-contrib-ads/dist/videojs.ads.css" />
<link rel="stylesheet" href="//googleads.github.io/videojs-ima/dist/videojs.ima.css" />
<link rel="stylesheet" href="videojs.ima.css" />
</head>
<body>
<h4>VJS player - Don't forget to run with Python Server python -m SimpleHTTPServer</h4>
<video id="content_video" class="video-js vjs-default-skin"
controls preload="auto" width="640" height="360">
<source src="source.mp4" type="video/mp4" />
<!-- <source src="http://rmcdn.2mdn.net/Demo/vast_inspector/android.mp4"
type="video/mp4" /> -->
</video>
<!-- Load dependent scripts -->
<script src="//googleads.github.io/videojs-ima/node_modules/video.js/dist/video.min.js"></script>
<script src="//imasdk.googleapis.com/js/sdkloader/ima3_debug.js"></script>
<script src="//googleads.github.io/videojs-ima/node_modules/videojs-contrib-ads/dist/videojs.ads.min.js"></script>
<script src="//googleads.github.io/videojs-ima/dist/videojs.ima.js"></script>
<script src="ads.js"></script>
</body>
</html>

ads.js

setTimeout(function() {
var target = document.getElementById('content_video_ima-ad-container');
target.style.display = 'none';
}, 2000);
var canvas = videojs('content_video');

var options2 = {
id: 'content_video',
adTagUrl: 'vast tag'
};
canvas.ima(options2);


This isn't normal behavior is it? 

As a solution in our project, I've realized that if I turn off our autostart code, that will stop the video from playing before the ad but it also stops the ad from initiating. 
Is there an ima.command that will allow me to just start the ad first and then run our canvas.play() after the ad is done? 

Thanks!

ima-sdk-adv...@google.com

unread,
Mar 26, 2018, 5:09:50 AM3/26/18
to ima...@googlegroups.com
Hi Ken,

Our team currently does not provide support for third-party integrations such as this one with the VideoJs player. This being said, you may reach out to their team via this link for further assistance.

However, as for adjusting the ad to play before the video in the IMA SDK perspective, the sample implementation from this guide should already allow you to play the ad before the video.

Additionally, based on the code you included, I could see that you don't have any play buttons for your video. We cannot comment on how you can implement this via the VideoJs but you can refer to our desktop autoplay guide on how you can achieve this via the IMA SDK.

Best regards,
Peter Laurence N. Oliquino
IMA SDK Team


=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~
Also find us on our blog and Google+ page:
    http://googleadsdeveloper.blogspot.com
    https://plus.google.com/115658573333388777174/
=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~=~
Reply all
Reply to author
Forward
0 new messages