diff --git a/LICENSE b/LICENSE index e5d595f..fb014ab 100644 --- a/LICENSE +++ b/LICENSE @@ -4,7 +4,7 @@ rmp-prebid is released under MIT License. Terms are outlined below (from opensource.org) Radiant Media Player | https://www.radiantmediaplayer.com -Copyright (c) 2020 Radiant Media Player +Copyright (c) 2023 Radiant Media Player Radiant Media Player is a commercial HTML5 media player, not covered by this MIT license. Radiant Media Player license can be found here: https://www.radiantmediaplayer.com/terms-of-service.html. You may request a free trial for Radiant Media Player at: https://www.radiantmediaplayer.com/free-trial.html. diff --git a/README.md b/README.md index 6d7c1d8..150c7b7 100644 --- a/README.md +++ b/README.md @@ -1,34 +1,31 @@ # rmp-prebid -Implements header bidding for [Radiant Media Player](https://www.radiantmediaplayer.com) through [Prebid.js](https://github.com/prebid/Prebid.js/). +Implements header bidding for [Radiant Media Player](https://www.radiantmediaplayer.com) through [Prebid.js](https://prebid.org/). ## Header Bidding -Header Bidding (also known as header auctions, parallel bidding, or header bidding) is a technique that involves running SSP & Ad Exchange code directly on page so publishers can receive bids on their inventory that may be unavailable through their primary ad server and exchange. +Header Bidding (also known as header auctions, parallel bidding, or header bidding) is a technique that involves running SSP and Ad Exchange code directly on page so publishers can receive bids on their inventory that may be unavailable through their primary ad server and exchange. The returned bids are then passed into the ad server so they can compete with direct demand and the primary ad server's exchange on a level playing field. More information on the subject can be found [here](https://prebid.org/overview/intro.html) and [here](https://www.adopsinsider.com/header-bidding/header-bidding-step-by-step/). -A list of bidders with video ads support [can be found here](https://prebid.org/dev-docs/bidders.html#bidders-with-video-and-native-demand). +Before using a specific Prebid bidder, make sure that it supports video ad format. ## Prebid video -In this repository, we will show how to set up Prebid with Radiant Media Player to show instream video ads with our client side adapter, using Prebid Server, outstream video ads and our ad-scheduler. Prebid.js for video overview [can be found here](https://prebid.org/prebid-video/video-overview.html). +In this repository, we will show how to set up Prebid.js with Radiant Media Player to show instream video ads, outstream video ads and ad-scheduling (pre/mid/post roll) with Prebid.js. Code in this repository has been written with Radiant Media Player 9.2.0 and Prebid.js 7.45.0. -### client-side adapter -See `instream-client-side.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/instream-client-side.html). +### Instream video ads +See `instream.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/instream.html). -### Prebid Server -See `instream-prebid-server.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/instream-prebid-server.html). - -### Outstream video ads -See `outstream.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/outstream.html). +### Outstream video ads (Google IMA SDK) +See `outstream-ima.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/outstream-ima.html). ### Ad-scheduling -See `ad-scheduling-client-side.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/ad-scheduling-client-side.html). +See `instream-schedule.html`. [A working example can be found here](https://www.radiantmediaplayer.com/docs/latest/gist/rmp-pb/instream-schedule.html). ### Production notes The above examples are start points to best implement header bidding for Radiant Media Player through Prebid.js. For production usage you will need to: - configure Radiant Media Player with your settings -- configure prebid according to your requirements and ad-server -- use a prebid.js custom build that only encompasses your target bidders +- configure Prebid according to your requirements +- use a Prebid.js custom build that only encompasses your target bidders ## License for rmp-prebid rmp-prebid is released under MIT License diff --git a/ad-scheduling-client-side.html b/ad-scheduling-client-side.html deleted file mode 100644 index fa99189..0000000 --- a/ad-scheduling-client-side.html +++ /dev/null @@ -1,41 +0,0 @@ - - - - - - - - Using Prebid.js with Radiant Media Player (client-side adapter) - Ad-scheduling - - - - - - - - - -
-
-
-

Using Prebid.js with Radiant Media Player (Ad-scheduling)

-

Instream Video (muted autoplay)

-

Go back to GitHub

-

Go back to Radiant - Media Player docs

-

You may need to reload this demo page to get a fill on the adTag request -

- -
-
-
-
- - - - - \ No newline at end of file diff --git a/instream-client-side.html b/instream-client-side.html deleted file mode 100644 index 332687d..0000000 --- a/instream-client-side.html +++ /dev/null @@ -1,42 +0,0 @@ - - - - - - - - Using Prebid.js with Radiant Media Player (client-side adapter) - - Instream Video - - - - - - - - - -
-
-
-

Using Prebid.js with Radiant Media Player (client-side adapter)

-

Instream Video (muted autoplay)

-

Go back to GitHub

-

Go back to Radiant - Media Player docs

-

You may need to reload this demo page to get a fill on the adTag request -

- -
-
-
-
- - - - - \ No newline at end of file diff --git a/instream-prebid-server.html b/instream-prebid-server.html deleted file mode 100644 index 916c06e..0000000 --- a/instream-prebid-server.html +++ /dev/null @@ -1,43 +0,0 @@ - - - - - - - - Using Prebid.js with Radiant Media Player (Prebid Server) - - Instream Video - - - - - - - - - -
-
-
-

Using Prebid.js with Radiant Media Player (Prebid Server)

-

Instream Video (muted autoplay)

-

Go back to GitHub

-

Go back to Radiant - Media Player docs

-

You may need to reload this demo page to get a fill on the adTag request -

- -
-
-
-
- - - - - - \ No newline at end of file diff --git a/instream-schedule.html b/instream-schedule.html new file mode 100644 index 0000000..9f98e7c --- /dev/null +++ b/instream-schedule.html @@ -0,0 +1,38 @@ + + + + + + + + + Using Prebid.js with Radiant Media Player - Pre/mid/post-roll instream video + + + + + + + + + +
+
+
+

Using Prebid.js with Radiant Media Player: Ad-scheduling

+

Pre/mid/post-roll instream video (muted autoplay)

+

Go back to GitHub

+

Go back to Radiant + Media Player docs

+

You may need to reload this demo page to get a fill on the adTag request

+ +
+
+
+
+ + + + + \ No newline at end of file diff --git a/instream.html b/instream.html new file mode 100644 index 0000000..ebbb24b --- /dev/null +++ b/instream.html @@ -0,0 +1,39 @@ + + + + + + + + + Using Prebid.js with Radiant Media Player - Instream + + + + + + + + + +
+
+
+

Using Prebid.js with Radiant Media Player

+

Instream Video (muted autoplay)

+

Go back to GitHub

+

Go back to Radiant + Media Player docs

+

You may need to reload this demo page to get a fill on the adTag request +

+ +
+
+
+
+ + + + + \ No newline at end of file diff --git a/js/ad-scheduling-client-side.js b/js/ad-scheduling-client-side.js deleted file mode 100644 index f32eab0..0000000 --- a/js/ad-scheduling-client-side.js +++ /dev/null @@ -1,167 +0,0 @@ -/* fallback VAST tag in case prebid does not return a winning bid - this is optional */ -const fallbackVastTagUrl = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear-1.xml'; -let playerHasBeenSetup = false; -/* timeout before we consider a bid invalid and resume player set up with fallbackVastTagUrl */ -const timeoutForBidToResolve = 50; -let bidTimeout = null; - -/* Prebid video ad unit - midroll and postroll in our ad-schedule - we use the adScheduleCallback player setting to pass an async function to get - a winning bid */ -const adScheduleCallback = function () { - return new Promise((resolve, reject) => { - const promiseTimeout = setTimeout(() => { - window.console.log('reject adScheduleCallback'); - reject(); - }, 5000); - const videoAdUnit = { - code: 'video', - mediaTypes: { - video: { - context: 'instream', - playerSize: [640, 480] - }, - }, - bids: [{ - bidder: 'appnexus', - params: { - placementId: 13232361, - video: { - skippable: true, - playback_methods: ['auto_play_sound_off'] - } - } - }] - }; - pbjs.que.push(() => { - pbjs.addAdUnits(videoAdUnit); - pbjs.setConfig({ - cache: { - url: 'https://prebid.adnxs.com/pbc/v1/cache' - } - }); - pbjs.requestBids({ - bidsBackHandler: (bids) => { - window.console.log('winning bid follows'); - window.console.log(bids); - const videoUrl = pbjs.adServers.dfp.buildVideoUrl({ - adUnit: videoAdUnit, - params: { - iu: '/19968336/prebid_cache_video_adunit' - } - }); - clearTimeout(promiseTimeout); - resolve(videoUrl); - } - }); - }); - }); -}; - -/* function to be called when player needs to be displayed */ -const invokeVideoPlayer = function (adTagUrl) { - clearTimeout(bidTimeout); - playerHasBeenSetup = true; - window.console.log('invokeVideoPlayer with Prebid VAST url = ' + adTagUrl); - const src = { - mp4: [ - 'https://www.rmp-streaming.com/media/big-buck-bunny-360p.mp4' - ] - }; - const settings = { - licenseKey: 'your-license-key', - src: src, - width: 640, - height: 360, - // we enabled ads for our player - // note that we requested a winning bid for skippable auto_play_sound_off so player starts muted autoplay - ads: true, - autoplay: true, - muted: true, - // we use Google IMA in this demo, but you can use rmp-vast as well depending on your requirements - adParser: 'ima', - // here is our winner VAST adTagUrl - adScheduleCallback: adScheduleCallback, - //adParser: 'rmp-vast', - // Pass ad schedule - adSchedule: { - // Preroll - preroll: adTagUrl, - // Midroll - midroll: [ - [30, 'callback'] - ], - // Postroll - postroll: 'callback' - }, - contentMetadata: { - poster: [ - 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg' - ] - } - }; - const elementID = 'rmpPlayer'; - const rmp = new RadiantMP(elementID); - rmp.init(settings); -}; - -if (window.pbjs) { - /* if we reach timeoutForBidToResolve then we setup player with fallbackVastTagUrl */ - bidTimeout = setTimeout(() => { - invokeVideoPlayer(fallbackVastTagUrl); - }, timeoutForBidToResolve); - pbjs.que = pbjs.que || []; - /* Prebid video ad unit */ - const videoAdUnit = { - code: 'video1', - mediaTypes: { - video: { - playerSize: [640, 480], - context: 'instream' - } - }, - bids: [{ - bidder: 'appnexus', - params: { - placementId: 13232361, - video: { - skippable: true, - playback_method: ['auto_play_sound_off'] - } - } - }] - }; - - pbjs.que.push(() => { - pbjs.addAdUnits(videoAdUnit); - pbjs.setConfig({ - //debug: true, - cache: { - url: 'https://prebid.adnxs.com/pbc/v1/cache' - } - }); - pbjs.requestBids({ - bidsBackHandler: (bids) => { - window.console.log('winning bid follows'); - window.console.log(bids); - const videoUrl = pbjs.adServers.dfp.buildVideoUrl({ - adUnit: videoAdUnit, - params: { - iu: '/19968336/prebid_cache_video_adunit', - cust_params: { - section: 'blog', - anotherKey: 'anotherValue' - }, - output: 'vast' - } - }); - if (!playerHasBeenSetup) { - invokeVideoPlayer(videoUrl); - } - } - }); - }); -} else { - // fallback in case pbjs is not defined - invokeVideoPlayer(fallbackVastTagUrl); -} diff --git a/js/instream-client-side.js b/js/instream-client-side.js deleted file mode 100644 index 81e80c2..0000000 --- a/js/instream-client-side.js +++ /dev/null @@ -1,101 +0,0 @@ -/* fallback VAST tag in case prebid does not return a winning bid - this is optional */ -const fallbackVastTagUrl = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear-1.xml'; -let playerHasBeenSetup = false; -/* timeout before we consider a bid invalid and resume player set up with fallbackVastTagUrl */ -const timeoutForBidToResolve = 5000; -let bidTimeout = null; - -/* function to be called when player needs to be displayed */ -const invokeVideoPlayer = function (adTagUrl) { - clearTimeout(bidTimeout); - playerHasBeenSetup = true; - window.console.log('invokeVideoPlayer with Prebid VAST url = ' + adTagUrl); - const src = { - mp4: [ - 'https://www.rmp-streaming.com/media/big-buck-bunny-360p.mp4' - ] - }; - const settings = { - licenseKey: 'your-license-key', - src: src, - width: 640, - height: 360, - // we enabled ads for our player - // note that we requested a winning bid for skippable auto_play_sound_off so player starts muted autoplay - ads: true, - autoplay: true, - muted: true, - // we use Google IMA in this demo, but you can use rmp-vast as well depending on your requirements - adParser: 'ima', - // here is our winner VAST adTagUrl - adTagUrl: adTagUrl, - contentMetadata: { - poster: [ - 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg' - ] - } - }; - const elementID = 'rmpPlayer'; - const rmp = new RadiantMP(elementID); - rmp.init(settings); -}; - -if (window.pbjs) { - /* if we reach timeoutForBidToResolve then we setup player with fallbackVastTagUrl */ - bidTimeout = setTimeout(() => { - invokeVideoPlayer(fallbackVastTagUrl); - }, timeoutForBidToResolve); - pbjs.que = pbjs.que || []; - /* Prebid video ad unit */ - const videoAdUnit = { - code: 'video1', - mediaTypes: { - video: { - playerSize: [640, 480], - context: 'instream' - } - }, - bids: [{ - bidder: 'appnexus', - params: { - placementId: 13232361, - video: { - skippable: true, - playback_method: ['auto_play_sound_off'] - } - } - }] - }; - pbjs.que.push(() => { - pbjs.addAdUnits(videoAdUnit); - pbjs.setConfig({ - //debug: true, - cache: { - url: 'https://prebid.adnxs.com/pbc/v1/cache' - } - }); - pbjs.requestBids({ - bidsBackHandler: (bids) => { - window.console.log('winning bid follows'); - window.console.log(bids); - const videoUrl = pbjs.adServers.dfp.buildVideoUrl({ - adUnit: videoAdUnit, - params: { - iu: '/19968336/prebid_cache_video_adunit', - cust_params: { - section: 'blog', - anotherKey: 'anotherValue' - }, - output: 'vast' - } - }); - if (!playerHasBeenSetup) { - invokeVideoPlayer(videoUrl); - } - } - }); - }); -} else { - // fallback in case pbjs is not defined - invokeVideoPlayer(fallbackVastTagUrl); -} diff --git a/js/instream-prebid-server.js b/js/instream-prebid-server.js deleted file mode 100644 index 8036e38..0000000 --- a/js/instream-prebid-server.js +++ /dev/null @@ -1,114 +0,0 @@ -/* fallback VAST tag in case prebid does not return a winning bid - this is optional */ -const fallbackVastTagUrl = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear-1.xml'; -let playerHasBeenSetup = false; -/* timeout before we consider a bid invalid and resume player set up with fallbackVastTagUrl */ -const timeoutForBidToResolve = 5000; -let bidTimeout = null; - -/* function to be called when player needs to be displayed */ -const invokeVideoPlayer = function (adTagUrl) { - clearTimeout(bidTimeout); - playerHasBeenSetup = true; - window.console.log('invokeVideoPlayer with Prebid VAST url = ' + adTagUrl); - const src = { - mp4: [ - 'https://www.rmp-streaming.com/media/big-buck-bunny-360p.mp4' - ] - }; - const settings = { - licenseKey: 'your-license-key', - src: src, - width: 640, - height: 360, - // we enabled ads for our player - // note that we requested a winning bid for skippable auto_play_sound_off so player starts muted autoplay - ads: true, - autoplay: true, - muted: true, - // we use Google IMA in this demo, but you can use rmp-vast as well depending on your requirements - adParser: 'ima', - // here is our winner VAST adTagUrl - adTagUrl: adTagUrl, - contentMetadata: { - poster: [ - 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg' - ] - } - }; - const elementID = 'rmpPlayer'; - const rmp = new RadiantMP(elementID); - rmp.init(settings); -}; - -if (window.pbjs) { - /* if we reach timeoutForBidToResolve then we setup player with fallbackVastTagUrl */ - bidTimeout = setTimeout(() => { - invokeVideoPlayer(fallbackVastTagUrl); - }, timeoutForBidToResolve); - pbjs.que = pbjs.que || []; - /* Prebid video ad unit */ - const videoAdUnit = { - code: 'video1', - mediaTypes: { - video: { - playerSize: [640, 480], - context: 'instream', - mimes: ['video/mp4'], - protocols: [1, 2, 3, 4, 5, 6, 7, 8], - playbackmethod: [2] - } - }, - bids: [{ - bidder: 'appnexus', - params: { - placementId: 13232361, // Add your own placement id here. - video: { - skippable: true, - playback_method: ['auto_play_sound_off'] - } - } - }] - }; - - pbjs.que.push(() => { - // configure prebid to use prebid cache and prebid server - // make sure to add your own accountId to your s2sConfig object - pbjs.setConfig({ - cache: { - url: 'https://prebid.adnxs.com/pbc/v1/cache' - }, - //debug: true, - enableSendAllBids: true, - s2sConfig: { - endpoint: 'https://prebid.adnxs.com/pbs/v1/openrtb2/auction', - enabled: true, - accountId: 'c9d412ee-3cc6-4b66-9326-9f49d528f13e', - bidders: ['appnexus'] - } - }); - pbjs.addAdUnits(videoAdUnit); // add your ad units to the bid request - pbjs.requestBids({ - bidsBackHandler: (bids) => { - window.console.log('winning bid follows'); - window.console.log(bids); - const videoUrl = pbjs.adServers.dfp.buildVideoUrl({ - adUnit: videoAdUnit, - params: { - iu: '/19968336/prebid_cache_video_adunit', - cust_params: { - section: 'blog', - anotherKey: 'anotherValue' - }, - output: 'vast' - } - }); - if (!playerHasBeenSetup) { - invokeVideoPlayer(videoUrl); - } - } - }); - }); -} else { - // fallback in case pbjs is not defined - invokeVideoPlayer(fallbackVastTagUrl); -} diff --git a/js/instream-schedule.js b/js/instream-schedule.js new file mode 100644 index 0000000..2843901 --- /dev/null +++ b/js/instream-schedule.js @@ -0,0 +1,93 @@ +let pbjs = window.pbjs || {}; +pbjs.que = pbjs.que || []; + +const adScheduleCallback = function () { + return new Promise(resolve => { + const videoAdUnit = { + code: 'video1', + mediaTypes: { + video: { + context: 'instream', + playerSize: [640, 480], + mimes: ['video/mp4'], + protocols: [1, 2, 3, 4, 5, 6, 7, 8], + playbackmethod: [2], + skip: 1 + } + }, + bids: [{ + bidder: 'appnexus', + params: { + placementId: 13232361 + } + }] + }; + pbjs.que.push(() => { + pbjs.addAdUnits(videoAdUnit); + + pbjs.setConfig({ + debug: true, + cache: { + url: 'https://prebid.adnxs.com/pbc/v1/cache' + } + }); + + pbjs.requestBids({ + bidsBackHandler: (/*bids*/) => { + const videoUrl = pbjs.adServers.dfp.buildVideoUrl({ + adUnit: videoAdUnit, + params: { + iu: '/19968336/prebid_cache_video_adunit', + cust_params: { + section: 'blog', + anotherKey: 'anotherValue' + }, + output: 'vast' + } + }); + console.log(videoUrl); + resolve(videoUrl); + } + }); + }); + }); +}; + +const src = { + hls: 'https://www.radiantmediaplayer.com/media/v1/avc-mp4/hls/playlist.m3u8' +}; +const settings = { + licenseKey: 'your-license-key', + src: src, + width: 640, + height: 360, + // we enabled ads for our player + // note that we requested a winning bid for skippable auto_play_sound_off so player starts muted autoplay + ads: true, + autoplay: true, + muted: true, + // we use Google IMA in this demo, but you can use rmp-vast as well depending on your requirements + adParser: 'ima', + // here is our winner VAST adTagUrl + adScheduleCallback: adScheduleCallback, + //adParser: 'rmp-vast', + // Pass ad schedule + adSchedule: { + // Preroll + preroll: 'callback', + // Midroll + midroll: [ + [30, 'callback'] + ], + // Postroll + postroll: 'callback' + }, + contentMetadata: { + poster: [ + 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg' + ] + } +}; +const elementID = 'rmp'; +const rmp = new RadiantMP(elementID); +rmp.init(settings); diff --git a/js/instream.js b/js/instream.js new file mode 100644 index 0000000..c1fa6a5 --- /dev/null +++ b/js/instream.js @@ -0,0 +1,81 @@ +/* when Prebid gives us a VAST tag we set up our player */ +function invokeVideoPlayer(adTagUrl) { + console.log('prebid VAST tag: ' + adTagUrl); + const src = { + hls: 'https://www.radiantmediaplayer.com/media/v1/avc-mp4/hls/playlist.m3u8' + }; + const settings = { + licenseKey: 'your-license-key', + src: src, + width: 640, + height: 360, + // we enabled ads for our player in muted autoplay mode + ads: true, + autoplay: true, + muted: true, + // we use Google IMA in this demo, but you can use "rmp-vast" as well depending on your requirements + adParser: 'ima', + // here is our winning VAST tag + adTagUrl: adTagUrl, + contentMetadata: { + poster: [ + 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg' + ] + } + }; + const elementID = 'rmp'; + const rmp = new RadiantMP(elementID); + rmp.init(settings); +} + +let pbjs = window.pbjs || {}; +pbjs.que = pbjs.que || []; + +/* Prebid video ad unit */ +const videoAdUnit = { + code: 'video1', + mediaTypes: { + video: { + context: 'instream', + playerSize: [640, 480], + mimes: ['video/mp4'], + protocols: [1, 2, 3, 4, 5, 6, 7, 8], + playbackmethod: [2], + skip: 1 + } + }, + bids: [{ + bidder: 'appnexus', + params: { + placementId: 13232361 + } + }] +}; + +pbjs.que.push(() => { + pbjs.addAdUnits(videoAdUnit); + + pbjs.setConfig({ + debug: true, + cache: { + url: 'https://prebid.adnxs.com/pbc/v1/cache' + } + }); + + pbjs.requestBids({ + bidsBackHandler: (/*bids*/) => { + const videoUrl = pbjs.adServers.dfp.buildVideoUrl({ + adUnit: videoAdUnit, + params: { + iu: '/19968336/prebid_cache_video_adunit', + cust_params: { + section: 'blog', + anotherKey: 'anotherValue' + }, + output: 'vast' + } + }); + invokeVideoPlayer(videoUrl); + } + }); +}); diff --git a/js/outstream-ima.js b/js/outstream-ima.js new file mode 100644 index 0000000..d66121f --- /dev/null +++ b/js/outstream-ima.js @@ -0,0 +1,55 @@ +let pbjs = window.pbjs || {}; +pbjs.que = pbjs.que || []; + +function render(bid) { + console.log(bid); + const settings = { + licenseKey: 'your-license-key', + width: 640, + height: 360, + autoplay: true, + adOutStreamMutedAutoplay: true, + ads: true, + adOutStream: true, + adsResponse: bid.vastXml, + skin: 'outstream' + }; + const elementID = 'rmp'; + const rmp = new RadiantMP(elementID); + rmp.init(settings); +} + +/* Prebid video ad unit */ +const videoAdUnit = { + code: 'rmp', + renderer: { + render, + url: 'https://imasdk.googleapis.com/js/sdkloader/ima3.js' + }, + mediaTypes: { + video: { + context: 'outstream', + playerSize: [640, 480], + mimes: ['video/mp4'], + protocols: [1, 2, 3, 4, 5, 6, 7, 8], + playbackmethod: [2], + skip: 1 + } + }, + bids: [{ + bidder: 'appnexus', + params: { + placementId: 13232385 + } + }] +}; + +pbjs.que.push(() => { + pbjs.addAdUnits(videoAdUnit); + pbjs.requestBids({ + bidsBackHandler: (/*bids*/) => { + const highestCpmBids = pbjs.getHighestCpmBids('rmp'); + pbjs.renderAd(document, highestCpmBids[0].adId); + } + }); +}); diff --git a/js/outstream.js b/js/outstream.js deleted file mode 100644 index 2f2aa1c..0000000 --- a/js/outstream.js +++ /dev/null @@ -1,88 +0,0 @@ -/* fallback VAST tag in case prebid does not return a winning bid - this is optional */ -const fallbackVastTagUrl = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear-1.xml'; -let playerHasBeenSetup = false; -/* timeout before we consider a bid invalid and resume player set up with fallbackVastTagUrl */ -const timeoutForBidToResolve = 5000; -let bidTimeout = null; - -/* function to be called when player needs to be displayed */ -const invokeVideoPlayer = function (adTagUrl, xml) { - clearTimeout(bidTimeout); - playerHasBeenSetup = true; - window.console.log('invokeVideoPlayer with Prebid VAST url'); - window.console.log(adTagUrl); - const settings = { - licenseKey: 'your-license-key', - width: 640, - height: 360, - autoplay: true, - adOutStreamMutedAutoplay: true, - ads: true, - adOutStream: true, - skin: 'outstream' - }; - if (xml) { - settings.adsResponse = adTagUrl; - } else { - settings.adTagUrl = adTagUrl; - } - const elementID = 'rmpPlayer'; - const rmp = new RadiantMP(elementID); - rmp.init(settings); -}; - -if (window.pbjs) { - const videoId = 'video1'; - /* if we reach timeoutForBidToResolve then we setup player with fallbackVastTagUrl */ - bidTimeout = setTimeout(() => { - invokeVideoPlayer(fallbackVastTagUrl, false); - }, timeoutForBidToResolve); - pbjs.que = pbjs.que || []; - /* Prebid video ad unit */ - const adUnits = [{ - code: videoId, - mediaTypes: { - video: { - playerSize: [640, 480], - context: 'outstream' - } - }, - bids: [{ - bidder: 'appnexus', - params: { - placementId: 13232385, - video: { - skippable: true, - playback_method: ['auto_play_sound_off'] - } - } - }] - }]; - pbjs.que.push(() => { - pbjs.addAdUnits(adUnits); - pbjs.requestBids({ - timeout: 1000, - bidsBackHandler: (bids) => { - window.console.log('winning bid follows'); - window.console.log(bids); - // we get the VAST XML from bids adResponse and pass it to our outstream player - if (bids && bids[videoId] && bids[videoId].bids && bids[videoId].bids[0] && bids[videoId].bids[0].adResponse) { - const adResponse = bids[videoId].bids[0].adResponse; - if (adResponse.ad && adResponse.ad.video && typeof adResponse.ad.video.content === 'string') { - const vastXml = bids[videoId].bids[0].adResponse.ad.video.content; - if (vastXml !== '') { - if (!playerHasBeenSetup) { - invokeVideoPlayer(vastXml, true); - } - } else { - invokeVideoPlayer(fallbackVastTagUrl, false); - } - } - } - } - }); - }); -} else { - // fallback in case pbjs is not defined - invokeVideoPlayer(fallbackVastTagUrl, false); -} diff --git a/outstream-ima.html b/outstream-ima.html new file mode 100644 index 0000000..858d57b --- /dev/null +++ b/outstream-ima.html @@ -0,0 +1,39 @@ + + + + + + + + + Using Prebid.js with Radiant Media Player - Outstream Video with Google IMA SDK + + + + + + + + + +
+
+
+

Using Prebid.js with Radiant Media Player

+

Outstream Video with Google IMA SDK (muted autoplay)

+

Go back to GitHub

+

Go back to Radiant + Media Player docs

+

You may need to reload this demo page to get a fill on the adTag request +

+ +
+
+
+
+ + + + + \ No newline at end of file diff --git a/outstream.html b/outstream.html deleted file mode 100644 index 882f9e6..0000000 --- a/outstream.html +++ /dev/null @@ -1,43 +0,0 @@ - - - - - - - - Using Prebid.js with Radiant Media Player - - Outstream Video - - - - - - - - - -
-
-
-

Using Prebid.js with Radiant Media Player

-

Outstream Video (muted autoplay)

-

Go back to GitHub

-

Go back to Radiant - Media Player docs

-

You may need to reload this demo page to get a fill on the adTag request -

- -
-
-
-
- - - - - - \ No newline at end of file diff --git a/package.json b/package.json index 1390582..8f00713 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "rmp-prebid", - "version": "3.0.0", + "version": "4.0.0", "author": "Radiant Media Player ", "description": "Implements header bidding for Radiant Media Player through Prebid.js", "repository": {