move pre-roll ad logic into it's designated video.js plugin
This commit is contained in:
parent
6e5e2b7578
commit
d32af5606b
2 changed files with 61 additions and 58 deletions
|
@ -1,10 +1,52 @@
|
|||
// Created by xander on 6/21/2021
|
||||
import videojs from 'video.js';
|
||||
import 'videojs-contrib-ads';
|
||||
import 'videojs-ima';
|
||||
const VERSION = '0.0.1';
|
||||
|
||||
/* Macro provided by aniview
|
||||
* const macroUrl =
|
||||
`https://vast.aniview.com/api/adserver61/vast/` +
|
||||
`?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
|
||||
`&AV_CHANNELID=60b354389c7adb506d0bd9a4` +
|
||||
`&AV_URL=[URL_MACRO]` +
|
||||
`&cb=[TIMESTAMP_MACRO]` +
|
||||
`&AV_WIDTH=[WIDTH_MACRO]` +
|
||||
`&AV_HEIGHT=[HEIGHT_MACRO]` +
|
||||
`&AV_SCHAIN=[SCHAIN_MACRO]` +
|
||||
`&AV_CCPA=[CCPA_MACRO]` +
|
||||
`&AV_GDPR=[GDPR_MACRO]` +
|
||||
`&AV_CONSENT=[CONSENT_MACRO]` +
|
||||
`&skip=true` +
|
||||
`&skiptimer=5` +
|
||||
`&logo=false` +
|
||||
`&usevslot=true` +
|
||||
`&vastretry=3` +
|
||||
`&hidecontrols=false`;
|
||||
* */
|
||||
|
||||
// TEST PRE-ROLL WITH THIS TAG:
|
||||
// https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpreonly&cmsid=496&vid=short_onecue&correlator=
|
||||
|
||||
// Modified to work with IMA
|
||||
const macroUrl =
|
||||
'https://vast.aniview.com/api/adserver61/vast/?AV_PUBLISHERID=60afcbc58cfdb065440d2426&AV_CHANNELID=60b354389c7adb506d0bd9a4&AV_URL=[URL_MACRO]&cb=[TIMESTAMP_MACRO]&AV_WIDTH=[WIDTH_MACRO]&AV_HEIGHT=[HEIGHT_MACRO]&AV_SCHAIN=[SCHAIN_MACRO]&AV_CCPA=[CCPA_MACRO]&AV_GDPR=[GDPR_MACRO]&AV_CONSENT=[CONSENT_MACRO]&skip=true&skiptimer=5&usevslot=true&hidecontrols=false';
|
||||
`https://vast.aniview.com/api/adserver61/vast/` +
|
||||
`?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
|
||||
`&AV_CHANNELID=60b354389c7adb506d0bd9a4` +
|
||||
`&AV_URL=[URL]` +
|
||||
`&cb=[CACHEBUSTING]` +
|
||||
`&AV_WIDTH=[WIDTH]` +
|
||||
`&AV_HEIGHT=[HEIGHT]` +
|
||||
// `&AV_SCHAIN=[SCHAIN_MACRO]` +
|
||||
// `&AV_CCPA=[CCPA_MACRO]` +
|
||||
// `&AV_GDPR=[GDPR_MACRO]` +
|
||||
// `&AV_CONSENT=[CONSENT_MACRO]` +
|
||||
`&skip=true` +
|
||||
`&skiptimer=5` +
|
||||
`&logo=true` +
|
||||
`&usevslot=true` +
|
||||
`&vastretry=5` +
|
||||
`&hidecontrols=false`;
|
||||
|
||||
const defaults = {
|
||||
adTagUrl: macroUrl,
|
||||
|
@ -19,46 +61,24 @@ class AniviewPlugin extends Component {
|
|||
super(player, options);
|
||||
|
||||
// Plugin started
|
||||
if (options.debug) {
|
||||
this.log(`Created aniview plugin.`);
|
||||
}
|
||||
if (options.debug) this.log(`Created aniview plugin.`);
|
||||
|
||||
// To help with debugging, we'll add a global vjs object with the video js player
|
||||
window.aniview = player;
|
||||
|
||||
this.player = player;
|
||||
|
||||
const google = window.google;
|
||||
|
||||
player.ima({
|
||||
// adTagUrl: macroUrl,
|
||||
id: 'ad_content_video',
|
||||
vpaidMode: google.ima.ImaSdkSettings.VpaidMode.INSECURE,
|
||||
adTagUrl:
|
||||
'https://vast.aniview.com/api/adserver61/vast/?AV_PUBLISHERID=60afcbc58cfdb065440d2426&AV_CHANNELID=60b354389c7adb506d0bd9a4',
|
||||
});
|
||||
|
||||
// this.player.ads();
|
||||
// const serverUrl = this.player.ads.adMacroReplacement(macroUrl);
|
||||
// this.log(serverUrl);
|
||||
|
||||
// request ads whenever there's new video content
|
||||
player.on('contentchanged', () => {
|
||||
/* player.on('contentchanged', () => {
|
||||
// in a real plugin, you might fetch your ad inventory here
|
||||
player.trigger('adsready');
|
||||
});
|
||||
}); */
|
||||
|
||||
// Plugin event listeners
|
||||
player.on('readyforpreroll', (event) => this.onReadyForPreroll(event));
|
||||
// player.on('readyforpreroll', (event) => this.onReadyForPreroll(event));
|
||||
}
|
||||
|
||||
onReadyForPreroll(event) {
|
||||
this.player.ads.startLinearAdMode();
|
||||
|
||||
// play your linear ad content
|
||||
// in this example, we use a static mp4
|
||||
this.player.src('kitteh.mp4');
|
||||
|
||||
/* onReadyForPreroll(event) {
|
||||
// send event when ad is playing to remove loading spinner
|
||||
this.player.one('adplaying', () => {
|
||||
this.player.trigger('ads-ad-started');
|
||||
|
@ -68,7 +88,7 @@ class AniviewPlugin extends Component {
|
|||
this.player.one('adended', () => {
|
||||
this.player.ads.endLinearAdMode();
|
||||
});
|
||||
}
|
||||
} */
|
||||
|
||||
log(...args) {
|
||||
if (this.options_.debug) {
|
||||
|
@ -90,6 +110,14 @@ const onPlayerReady = (player, options) => {
|
|||
* @param {Object} [options={}]
|
||||
*/
|
||||
const plugin = function (options) {
|
||||
const google = window.google;
|
||||
|
||||
this.ima({
|
||||
// $FlowFixMe
|
||||
vpaidMode: google.ima.ImaSdkSettings.VpaidMode.INSECURE,
|
||||
adTagUrl: macroUrl,
|
||||
});
|
||||
|
||||
this.ready(() => {
|
||||
onPlayerReady(this, videojs.mergeOptions(defaults, options));
|
||||
});
|
||||
|
|
|
@ -13,29 +13,9 @@ import hlsQualitySelector from './plugins/videojs-hls-quality-selector/plugin';
|
|||
import recsys from './plugins/videojs-recsys/plugin';
|
||||
import qualityLevels from 'videojs-contrib-quality-levels';
|
||||
import isUserTyping from 'util/detect-typing';
|
||||
import 'videojs-contrib-ads';
|
||||
import 'videojs-ima';
|
||||
// import aniview from './plugins/videojs-aniview/plugin';
|
||||
import './plugins/videojs-aniview/plugin';
|
||||
|
||||
const isDev = process.env.NODE_ENV !== 'production';
|
||||
const macroUrl =
|
||||
`https://vast.aniview.com/api/adserver61/vast/` +
|
||||
`?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
|
||||
`&AV_CHANNELID=60b354389c7adb506d0bd9a4` +
|
||||
`&AV_URL=[URL_MACRO]` +
|
||||
`&cb=[TIMESTAMP_MACRO]` +
|
||||
`&AV_WIDTH=[WIDTH_MACRO]` +
|
||||
`&AV_HEIGHT=[HEIGHT_MACRO]` +
|
||||
`&AV_SCHAIN=[SCHAIN_MACRO]` +
|
||||
`&AV_CCPA=[CCPA_MACRO]` +
|
||||
`&AV_GDPR=[GDPR_MACRO]` +
|
||||
`&AV_CONSENT=[CONSENT_MACRO]` +
|
||||
`&skip=true` +
|
||||
`&skiptimer=5` +
|
||||
`&logo=false` +
|
||||
`&usevslot=true` +
|
||||
`&vastretry=3` +
|
||||
`&hidecontrols=false`;
|
||||
|
||||
export type Player = {
|
||||
on: (string, (any) => void) => void,
|
||||
|
@ -605,14 +585,9 @@ export default React.memo<Props>(function VideoJs(props: Props) {
|
|||
// pre-roll ads
|
||||
// This must be initialized earlier than everything else
|
||||
// otherwise a race condition occurs if we place this in the onReady call back
|
||||
if (allowPreRoll && SIMPLE_SITE && window.google) {
|
||||
const google = window.google;
|
||||
// player.aniview();
|
||||
vjs.ima({
|
||||
// $FlowFixMe
|
||||
vpaidMode: google.ima.ImaSdkSettings.VpaidMode.INSECURE,
|
||||
adTagUrl: macroUrl,
|
||||
});
|
||||
// allow if isDev because otherwise you'll never see ads when basing to master
|
||||
if ((allowPreRoll && SIMPLE_SITE) || isDev) {
|
||||
vjs.aniview();
|
||||
}
|
||||
|
||||
// fixes #3498 (https://github.com/lbryio/lbry-desktop/issues/3498)
|
||||
|
|
Loading…
Reference in a new issue