Skip to content

Instantly share code, notes, and snippets.

@afuggini
Created January 22, 2018 17:38
Show Gist options
  • Save afuggini/3afe51168ab0c416c97876e2e15909b0 to your computer and use it in GitHub Desktop.
Save afuggini/3afe51168ab0c416c97876e2e15909b0 to your computer and use it in GitHub Desktop.
Sample VPAID Video player Interface Code
// This class is meant to be part of the video player that interacts with the Ad.
// It takes the VPAID creative as a parameter in its contructor.
var VPAIDWrapper = function (VPAIDCreative) {
this._creative = VPAIDCreative
if (!this.checkVPAIDInterface(VPAIDCreative)) {
//The VPAIDCreative doesn't conform to the VPAID spec
console.error('VPAIDCreative doesn\'t conform to the VPAID spec')
return
}
this.setCallbacksForCreative()
}
VPAIDWrapper.prototype.checkVPAIDInterface = function (VPAIDCreative) {
if (VPAIDCreative.handshakeVersion && typeof VPAIDCreative.handshakeVersion == 'function' &&
VPAIDCreative.initAd && typeof VPAIDCreative.initAd == 'function' &&
VPAIDCreative.startAd && typeof VPAIDCreative.startAd == 'function' &&
VPAIDCreative.stopAd && typeof VPAIDCreative.stopAd == 'function' &&
VPAIDCreative.skipAd && typeof VPAIDCreative.skipAd == 'function' &&
VPAIDCreative.resizeAd && typeof VPAIDCreative.resizeAd == 'function' &&
VPAIDCreative.pauseAd && typeof VPAIDCreative.pauseAd == 'function' &&
VPAIDCreative.resumeAd && typeof VPAIDCreative.resumeAd == 'function' &&
VPAIDCreative.expandAd && typeof VPAIDCreative.expandAd == 'function' &&
VPAIDCreative.collapseAd && typeof VPAIDCreative.collapseAd == 'function' &&
VPAIDCreative.subscribe && typeof VPAIDCreative.subscribe == 'function' &&
VPAIDCreative.unsubscribe && typeof VPAIDCreative.unsubscribe == 'function') {
return true
}
return false
}
// This function registers the callbacks of each of the events
VPAIDWrapper.prototype.setCallbacksForCreative = function () {
//The key of the object is the event name and the value is a reference to the callback function that is registered with the creative
var callbacks = {
AdStarted: this.onStartAd,
AdStopped: this.onStopAd,
AdSkipped: this.onSkipAd,
AdLoaded: this.onAdLoaded,
AdLinearChange: this.onAdLinearChange,
AdSizeChange: this.onAdSizeChange,
AdExpandedChange: this.onAdExpandedChange,
AdSkippableStateChange: this.onAdSkippableStateChange,
AdDurationChange: this.onAdDurationChange,
AdRemainingTimeChange: this.onAdRemainingTimeChange,
AdVolumeChange: this.onAdVolumeChange,
AdImpression: this.onAdImpression,
AdClickThru: this.onAdClickThru,
AdInteraction: this.onAdInteraction,
AdVideoStart: this.onAdVideoStart,
AdVideoFirstQuartile: this.onAdVideoFirstQuartile,
AdVideoMidpoint: this.onAdVideoMidpoint,
AdVideoThirdQuartile: this.onAdVideoThirdQuartile,
AdVideoComplete: this.onAdVideoComplete,
AdUserAcceptInvitation: this.onAdUserAcceptInvitation,
AdUserMinimize: this.onAdUserMinimize,
AdUserClose: this.onAdUserClose,
AdPaused: this.onAdPaused,
AdPlaying: this.onAdPlaying,
AdError: this.onAdError,
AdLog: this.onAdLog
}
// Looping through the object and registering each of the callbacks with the creative
for (var eventName in callbacks) {
this._creative.subscribe(callbacks[eventName], eventName, this)
}
}
// Pass through for initAd - when the video player wants to call the ad
VPAIDWrapper.prototype.initAd = function (width, height, viewMode, desiredBitrate, creativeData, environmentVars) {
this._creative.initAd(width, height, viewMode, desiredBitrate, creativeData, environmentVars)
}
// Callback for AdPaused
VPAIDWrapper.prototype.onAdPaused = function () {
console.log('onAdPaused')
}
// Callback for AdPlaying
VPAIDWrapper.prototype.onAdPlaying = function () {
console.log('onAdPlaying')
}
// Callback for AdError
VPAIDWrapper.prototype.onAdError = function (message) {
console.log('onAdError: ' + message)
}
// Callback for AdLog
VPAIDWrapper.prototype.onAdLog = function (message) {
console.log('onAdLog: ' + message)
}
// Callback for AdUserAcceptInvitation
VPAIDWrapper.prototype.onAdUserAcceptInvitation = function () {
console.log('onAdUserAcceptInvitation')
}
// Callback for AdUserMinimize
VPAIDWrapper.prototype.onAdUserMinimize = function () {
console.log('onAdUserMinimize')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdUserClose = function () {
console.log('onAdUserClose')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdSkippableStateChange = function () {
console.log('Ad Skippable State Changed to: ' + this._creative.getAdSkippableState())
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdExpandedChange = function () {
console.log('Ad Expanded Changed to: ' + this._creative.getAdExpanded())
}
// Pass through for getAdExpanded
VPAIDWrapper.prototype.getAdExpanded = function () {
console.log('getAdExpanded')
return this._creative.getAdExpanded()
}
// Pass through for getAdSkippableState
VPAIDWrapper.prototype.getAdSkippableState = function () {
console.log('getAdSkippableState')
return this._creative.getAdSkippableState()
}
// Callback for AdSizeChange
VPAIDWrapper.prototype.onAdSizeChange = function () {
console.log('Ad size changed to: w=' + this._creative.getAdWidth() + ' h =' + this._creative.getAdHeight())
}
// Callback for AdDurationChange
VPAIDWrapper.prototype.onAdDurationChange = function () {
// console.log('Ad Duration Changed to: ' + this._creative.getAdDuration())
}
// Callback for AdRemainingTimeChange
VPAIDWrapper.prototype.onAdRemainingTimeChange = function () {
// console.log('Ad Remaining Time Changed to: ' +
this._creative.getAdRemainingTime()
}
// Pass through for getAdRemainingTime
VPAIDWrapper.prototype.getAdRemainingTime = function () {
console.log('getAdRemainingTime')
return this._creative.getAdRemainingTime()
}
// Callback for AdImpression
VPAIDWrapper.prototype.onAdImpression = function () {
console.log('Ad Impression')
}
// Callback for AdClickThru
VPAIDWrapper.prototype.onAdClickThru = function (url, id, playerHandles) {
console.log('Clickthrough portion of the ad was clicked')
}
// Callback for AdInteraction
VPAIDWrapper.prototype.onAdInteraction = function (id) {
console.log('A non-clickthrough event has occured')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdVideoStart = function () {
console.log('Video 0% completed')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdVideoFirstQuartile = function () {
console.log('Video 25% completed')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdVideoMidpoint = function () {
console.log('Video 50% completed')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onAdVideoThirdQuartile = function () {
console.log('Video 75% completed')
}
// Callback for AdVideoComplete
VPAIDWrapper.prototype.onAdVideoComplete = function () {
console.log('Video 100% completed')
}
// Callback for AdLinearChange
VPAIDWrapper.prototype.onAdLinearChange = function () {
console.log('Ad linear has changed: ' + this._creative.getAdLinear())
}
// Pass through for getAdLinear
VPAIDWrapper.prototype.getAdLinear = function () {
console.log('getAdLinear')
return this._creative.getAdLinear()
}
// Pass through for startAd()
VPAIDWrapper.prototype.startAd = function () {
console.log('startAd')
this._creative.startAd()
}
// Callback for AdLoaded
VPAIDWrapper.prototype.onAdLoaded = function () {
console.log('ad has been loaded')
}
// Callback for StartAd()
VPAIDWrapper.prototype.onStartAd = function () {
console.log('Ad has started')
}
//Pass through for stopAd()
VPAIDWrapper.prototype.stopAd = function () {
this._creative.stopAd()
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onStopAd = function () {
console.log('Ad has stopped')
}
// Callback for AdUserClose
VPAIDWrapper.prototype.onSkipAd = function () {
console.log('Ad was skipped')
}
//Passthrough for setAdVolume
VPAIDWrapper.prototype.setAdVolume = function (val) {
this._creative.setAdVolume(val)
}
//Passthrough for getAdVolume
VPAIDWrapper.prototype.getAdVolume = function () {
return this._creative.getAdVolume()
}
// Callback for AdVolumeChange
VPAIDWrapper.prototype.onAdVolumeChange = function () {
console.log('Ad Volume has changed to - ' + this._creative.getAdVolume())
}
//Passthrough for resizeAd
VPAIDWrapper.prototype.resizeAd = function (width, height, viewMode) {
this._creative.resizeAd()
}
//Passthrough for pauseAd()
VPAIDWrapper.prototype.pauseAd = function () {
this._creative.pauseAd()
}
//Passthrough for resumeAd()
VPAIDWrapper.prototype.resumeAd = function () {
this._creative.resumeAd()
}
//Passthrough for expandAd()
VPAIDWrapper.prototype.expandAd = function () {
this._creative.expandAd()
}
//Passthrough for collapseAd()
VPAIDWrapper.prototype.collapseAd = function () {
this._creative.collapseAd()
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment