Class OmapDashjsUIOverlayBinder

Dash.js binder for an OMAP client. Use this binder if you want a UI overlay to display the ads' information.

const player = dashjs.MediaPlayer().create();
const adDisplayContainer = document.getElementById('ad-display-container') as HTMLDivElement;
const adVideoElement = document.getElementById('ad-video') as HTMLVideoElement;
const adRemainingTime = document.createElement('');
const adSequence = document.createElement('');
const adTotal = document.createElement('');
const skipButton = document.createElement('button');
skipButton.innerText = 'Skip';
skipButton.addEventListener('click', () => {
  // do something to skip the ad
});
adDisplayContainer.appendChild(skipButton);
const adTagUrl = 'https://example.com/vmap.xml';
const omapClient = new OmapIABClient(adTagUrl);
const omapBinder = new OmapDashjsUIOverlayBinder(player, adDisplayContainer, adRemainingTime, adSequence, adTotal, skipButton, adVideoElement);
omapBinder.bind(omapClient);
omapBinder.play()
    .then(() => {
        player.initialize(videoElement, 'https://example.com/manifest.mpd', true);
    })
    .catch(() => {
        console.error('adBinder failed to get ready');
    });

Hierarchy

  • default
    • OmapDashjsUIOverlayBinder

Constructors

constructor

Properties

adBreaks adDisplayContainer adVideoElement? config dashjs omapClient?

Accessors

state

Methods

_onAllAdsCompleted bind destroy emit off on onAdEnded onAdPodEnded onAdPodStarted onAdProgress onAdSkippable onAdStarted onContentCanPlay onContentPauseRequested onContentResumeRequested onTimeUpdate play skip updateConfig

Constructors

constructor

  • new OmapDashjsUIOverlayBinder(player, adDisplayContainer, adRemainingTime, adSequence, adTotal, skipButton, adVideoElement?): OmapDashjsUIOverlayBinder

  • Parameters

    • player: MediaPlayerClass

      The dash.js player.

    • adDisplayContainer: HTMLElement

      The container element for the ad UI overlay.

    • adRemainingTime: Text

      The text node to display the remaining time of the current ad.

    • adSequence: Text

      The text node to display the index of the current ad.

    • adTotal: Text

      The text node to display the total number of ads in the current ad pod.

    • skipButton: HTMLElement

      The skip button element.

    • Optional adVideoElement: HTMLVideoElement

      The ad video element.

    Returns OmapDashjsUIOverlayBinder

Properties

Protected adBreaks

adBreaks: default[]

Protected adDisplayContainer

adDisplayContainer: HTMLElement

Protected Optional adVideoElement

adVideoElement?: HTMLVideoElement

Protected config

config: Partial<default>

Protected dashjs

dashjs: MediaPlayerClass

Protected Optional omapClient

omapClient?: default

Accessors

state

  • get state(): TBinderState

  • Returns TBinderState

Methods

Protected _onAllAdsCompleted

  • _onAllAdsCompleted(): void

  • Returns void

bind

  • bind(omapClient): void

  • Parameters

    • omapClient: default

    Returns void

destroy

  • destroy(): void

  • Returns void

Protected emit

  • emit(type): void

  • Parameters

    • type: "adPodStarted"

    Returns void

  • emit(type): void

  • Parameters

    • type: "adPodEnded"

    Returns void

  • emit(type, ad): void

  • Parameters

    • type: "adStarted"
    • ad: default

    Returns void

  • emit(type, ad): void

  • Parameters

    • type: "adEnded"
    • ad: default

    Returns void

  • emit(type, sequence, numOfAds, remainingTime, duration): void

  • Parameters

    • type: "adInfoUpdated"
    • sequence: number
    • numOfAds: number
    • remainingTime: number
    • duration: number

    Returns void

  • emit(type): void

  • Parameters

    • type: "adSkippableStateChanged"

    Returns void

off

  • off(type, listener): void

  • Parameters

    • type: "adPodStarted"
    • listener: (() => void)
        • (): void

        • Returns void

    Returns void

  • off(type, listener): void

  • Parameters

    • type: "adPodEnded"
    • listener: (() => void)
        • (): void

        • Returns void

    Returns void

  • off(type, listener): void

  • Parameters

    • type: "adStarted"
    • listener: ((ad) => void)
        • (ad): void

        • Parameters

          • ad: default

          Returns void

    Returns void

  • off(type, listener): void

  • Parameters

    • type: "adEnded"
    • listener: ((ad) => void)
        • (ad): void

        • Parameters

          • ad: default

          Returns void

    Returns void

  • off(type, listener): void

  • Parameters

    • type: "adInfoUpdated"
    • listener: ((sequence, numOfAds, remainingTime, duration) => void)
        • (sequence, numOfAds, remainingTime, duration): void

        • Parameters

          • sequence: number
          • numOfAds: number
          • remainingTime: number
          • duration: number

          Returns void

    Returns void

  • off(type, listener): void

  • Parameters

    • type: "adSkippableStateChanged"
    • listener: (() => void)
        • (): void

        • Returns void

    Returns void

on

  • on(type, listener): void

  • Parameters

    • type: "adPodStarted"
    • listener: (() => void)
        • (): void

        • Returns void

    Returns void

  • on(type, listener): void

  • Parameters

    • type: "adPodEnded"
    • listener: (() => void)
        • (): void

        • Returns void

    Returns void

  • on(type, listener): void

  • Parameters

    • type: "adStarted"
    • listener: ((ad) => void)
        • (ad): void

        • Parameters

          • ad: default

          Returns void

    Returns void

  • on(type, listener): void

  • Parameters

    • type: "adEnded"
    • listener: ((ad) => void)
        • (ad): void

        • Parameters

          • ad: default

          Returns void

    Returns void

  • on(type, listener): void

  • Parameters

    • type: "adInfoUpdated"
    • listener: ((sequence, numOfAds, remainingTime, duration) => void)
        • (sequence, numOfAds, remainingTime, duration): void

        • Parameters

          • sequence: number
          • numOfAds: number
          • remainingTime: number
          • duration: number

          Returns void

    Returns void

  • on(type, listener): void

  • Parameters

    • type: "adSkippableStateChanged"
    • listener: ((skippable) => void)
        • (skippable): void

        • Parameters

          • skippable: boolean

          Returns void

    Returns void

Protected onAdEnded

  • onAdEnded(ad, adDisplayContainer): void

  • Parameters

    • ad: default
    • adDisplayContainer: HTMLElement

    Returns void

Protected onAdPodEnded

  • onAdPodEnded(adPod, adDisplayContainer): void

  • Parameters

    • adPod: default
    • adDisplayContainer: HTMLElement

    Returns void

Protected onAdPodStarted

  • onAdPodStarted(adPod, adDisplayContainer): void

  • Parameters

    • adPod: default
    • adDisplayContainer: HTMLElement

    Returns void

Protected onAdProgress

  • onAdProgress(ad, adDisplayContainer, adCurrentTime, numOfAds): void

  • Parameters

    • ad: default
    • adDisplayContainer: HTMLElement
    • adCurrentTime: number
    • numOfAds: number

    Returns void

Protected onAdSkippable

  • onAdSkippable(ad, adDisplayContainer, adCurrentTime, numOfAds): void

  • Parameters

    • ad: default
    • adDisplayContainer: HTMLElement
    • adCurrentTime: number
    • numOfAds: number

    Returns void

Protected onAdStarted

  • onAdStarted(ad, adDisplayContainer): void

  • Parameters

    • ad: default
    • adDisplayContainer: HTMLElement

    Returns void

Protected onContentCanPlay

  • onContentCanPlay(): void

  • Returns void

Protected onContentPauseRequested

  • onContentPauseRequested(): void

  • Returns void

Protected onContentResumeRequested

  • onContentResumeRequested(): void

  • Returns void

Protected onTimeUpdate

  • onTimeUpdate(e): void

  • Parameters

    • e: PlaybackTimeUpdatedEvent

    Returns void

play

  • play(startTime?): Promise<void>

  • Parameters

    • Optional startTime: number

    Returns Promise<void>

skip

  • skip(): void

  • Returns void

updateConfig

  • updateConfig(config): void

  • Parameters

    • config: Partial<default>

    Returns void

Settings

Member Visibility

Theme

On This Page

Generated using TypeDoc