JSFiddle - React, Tailwind, and code Playground
videojs-all code pasted in html only
by dledle2
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Prebid.js video adUnit example</title>
<!-- videojs -->
<link rel="stylesheet" href="http://vjs.zencdn.net/5.9.2/video-js.css">
<script type="text/javascript" src="http://vjs.zencdn.net/5.9.2/video.js"></script>
<!-- videojs-vast-vpaid -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/videojs-vast-vpaid/2.0.2/videojs.vast.vpaid.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-vast-vpaid/2.0.2/videojs_5.vast.vpaid.min.js"></script>
<!-- prebid.js -->
<script type="text/javascript" src="//acdn.adnxs.com/prebid/not-for-prod/prebid.js" async></script>
<script>
var pbjs = pbjs || {};
pbjs.que = pbjs.que || [];
var tempTag = false;
var invokeVideoPlayer = function(url) {
tempTag = url;
}
/*
Prebid Video adUnit
*/
var videoAdUnit = {
code: 'video1',
sizes: [640, 480],
mediaType: 'video',
bids: [{
bidder: 'appnexusAst',
params: {
placementId: '9333431',
video: {
skipppable: true,
playback_method: ['auto_play_sound_off']
}
}
}]
};
var logBids = function(bids) {
console.log('MESSAGE: got bids back: ');
console.log(bids);
if (!bids.video1) {
console.log('MESSAGE: no video demand');
} else {
console.log('MESSAGE: we got video demand!');
}
try {
url = bids.video1.bids[0].vastUrl;
console.log('MESSAGE: VAST URL: ');
console.log('MESSAGE: ' + url);
} catch (e) {
console.log("MESSAGE: There was an error logging the vast url: " + e);
}
}
pbjs.que.push(function() {
pbjs.addAdUnits(videoAdUnit);
pbjs.requestBids({
timeout: 700,
...