videojs-ima integration notes

Auto-play

videojs-ima and its dependencies do not support the auto-play feature of the CONNECT HTML5 Player. We recommend that you do not use the auto-play attribute for the player.

Depending on the policies of the browser, it may be possible to achieve auto-play programmatically. The following mechanism is recommended to start playing automatically after setting the source.

JS

    const playEvents = ["canplay", "contentcanplay"];
    let playStart = () => {
        // Start playing
        playerInstance.play();
        playerInstance.off(playEvents, playStart);
    };
    // Wait for "canplay" event before starting
    playerInstance.on(playEvents, playStart);
    playerInstance.src {
        src: "https://d3bqrzf9w11pn3.cloudfront.net/basic_dash_bbb_clear/bbb_public.mpd",
        type: "application/dash+xml"
    });

Stopping an advert

Sometimes it is desirable to cancel a playing advert (for example, to select a different source to be played). Although videojs-ima and its dependencies were not designed to support this, the following mechanism can be used.

JS

    // Check if an ad is playing
    if (playerInstance.ads.inAdBreak()) {
 
        // This is to make sure we don't resume playing the
        // previous content when the ad finishes
        playerInstance.ads.disableNextSnapshotRestore = true;
 
        let adController = playerInstance.ima.controller;
        let adsManager = adController ? adController.getAdsManager() : null;
        if (adsManager) {
            // Force the current ad to stop
            adsManager.discardAdBreak();
            adsManager.stop();
        }
 
        // When the ad has finished give contrib-ads an "adend" event to put it in
        // an appropriate state to change to a new source
        playerInstance.one("adend", () => {
            playerInstance.trigger("contentresumed");
        });
    }

Changing source with an ad tag

When changing from a playing source to a new source with adverts, it is important to specify the ad tag for the new source at an appropriate time; otherwise, the ad tag may be applied to the old source instead of the new one. This is especially important with some DRM which take time to close an old session before they can set up a new one. Use the following mechanism to delay setting the new ad tag until the new source is ready.

JS

    // Delay setting the ad tag until we see "loadstart" on the new source
    playerInstance.one("loadstart", () => {
        playerInstance.ima.changeAdTag(adTagUrl);
        playerInstance.ima.requestAds();
    });