Source: lib/ads/interstitial_ad_manager.js

  1. /*! @license
  2.  * Shaka Player
  3.  * Copyright 2016 Google LLC
  4.  * SPDX-License-Identifier: Apache-2.0
  5.  */
  8. goog.provide('shaka.ads.InterstitialAdManager');
  10. goog.require('goog.asserts');
  11. goog.require('shaka.Player');
  12. goog.require('shaka.ads.InterstitialAd');
  13. goog.require('shaka.ads.InterstitialStaticAd');
  14. goog.require('shaka.ads.Utils');
  15. goog.require('shaka.log');
  16. goog.require('shaka.media.PreloadManager');
  17. goog.require('shaka.net.NetworkingEngine');
  18. goog.require('shaka.net.NetworkingUtils');
  19. goog.require('shaka.util.Dom');
  20. goog.require('shaka.util.Error');
  21. goog.require('shaka.util.EventManager');
  22. goog.require('shaka.util.FakeEvent');
  23. goog.require('shaka.util.IReleasable');
  24. goog.require('shaka.util.Platform');
  25. goog.require('shaka.util.PublicPromise');
  26. goog.require('shaka.util.StringUtils');
  27. goog.require('shaka.util.Timer');
  28. goog.require('shaka.util.TXml');
  31. /**
  32.  * A class responsible for Interstitial ad interactions.
  33.  *
  34.  * @implements {shaka.util.IReleasable}
  35.  */
  36. shaka.ads.InterstitialAdManager = class {
  37.   /**
  38.    * @param {HTMLElement} adContainer
  39.    * @param {shaka.Player} basePlayer
  40.    * @param {HTMLMediaElement} baseVideo
  41.    * @param {function(!shaka.util.FakeEvent)} onEvent
  42.    */
  43.   constructor(adContainer, basePlayer, baseVideo, onEvent) {
  44.     /** @private {?shaka.extern.AdsConfiguration} */
  45.     this.config_ = null;
  47.     /** @private {HTMLElement} */
  48.     this.adContainer_ = adContainer;
  50.     /** @private {shaka.Player} */
  51.     this.basePlayer_ = basePlayer;
  53.     /** @private {HTMLMediaElement} */
  54.     this.baseVideo_ = baseVideo;
  56.     /** @private {?HTMLMediaElement} */
  57.     this.adVideo_ = null;
  59.     /** @private {boolean} */
  60.     this.usingBaseVideo_ = true;
  62.     /** @private {HTMLMediaElement} */
  63.     this.video_ = this.baseVideo_;
  65.     /** @private {function(!shaka.util.FakeEvent)} */
  66.     this.onEvent_ = onEvent;
  68.     /** @private {!Set<string>} */
  69.     this.interstitialIds_ = new Set();
  71.     /** @private {!Set<shaka.extern.AdInterstitial>} */
  72.     this.interstitials_ = new Set();
  74.     /**
  75.      * @private {!Map<shaka.extern.AdInterstitial,
  76.      *                 Promise<?shaka.media.PreloadManager>>}
  77.      */
  78.     this.preloadManagerInterstitials_ = new Map();
  80.     /**
  81.      * @private {!Map<shaka.extern.AdInterstitial, !Array<!HTMLLinkElement>>}
  82.      */
  83.     this.preloadOnDomElements_ = new Map();
  85.     /** @private {shaka.Player} */
  86.     this.player_ = new shaka.Player();
  88.     this.updatePlayerConfig_();
  90.     /** @private {shaka.util.EventManager} */
  91.     this.eventManager_ = new shaka.util.EventManager();
  93.     /** @private {shaka.util.EventManager} */
  94.     this.adEventManager_ = new shaka.util.EventManager();
  96.     /** @private {boolean} */
  97.     this.playingAd_ = false;
  99.     /** @private {?number} */
  100.     this.lastTime_ = null;
  102.     /** @private {?shaka.extern.AdInterstitial} */
  103.     this.lastPlayedAd_ = null;
  105.     /** @private {?shaka.util.Timer} */
  106.     this.playoutLimitTimer_ = null;
  108.     /** @private {?function()} */
  109.     this.lastOnSkip_ = null;
  111.     /** @private {boolean} */
  112.     this.usingListeners_ = false;
  114.     /** @private {number} */
  115.     this.videoCallbackId_ = -1;
  117.     // Note: checkForInterstitials_ and onTimeUpdate_ are defined here because
  118.     // we use it on listener callback, and for unlisten is necessary use the
  119.     // same callback.
  121.     /** @private {function()} */
  122.     this.checkForInterstitials_ = () => {
  123.       if (this.playingAd_ || !this.lastTime_ ||
  124.           this.basePlayer_.isRemotePlayback()) {
  125.         return;
  126.       }
  127.       this.lastTime_ = this.baseVideo_.currentTime;
  128.       // Remove last played add when the new time is before to the ad time.
  129.       if (this.lastPlayedAd_ &&
  130.           !this.lastPlayedAd_.pre && !this.lastPlayedAd_.post &&
  131.           this.lastTime_ < this.lastPlayedAd_.startTime) {
  132.         this.lastPlayedAd_ = null;
  133.       }
  134.       const currentInterstitial = this.getCurrentInterstitial_();
  135.       if (currentInterstitial) {
  136.         this.setupAd_(currentInterstitial, /* sequenceLength= */ 1,
  137.             /* adPosition= */ 1, /* initialTime= */ Date.now());
  138.       }
  139.     };
  141.     /** @private {function()} */
  142.     this.onTimeUpdate_ = () => {
  143.       if (this.playingAd_ || this.lastTime_ ||
  144.           this.basePlayer_.isRemotePlayback()) {
  145.         return;
  146.       }
  147.       this.lastTime_ = this.baseVideo_.currentTime;
  148.       const currentInterstitial = this.getCurrentInterstitial_(
  149.           /* needPreRoll= */ true);
  150.       if (currentInterstitial) {
  151.         this.setupAd_(currentInterstitial, /* sequenceLength= */ 1,
  152.             /* adPosition= */ 1, /* initialTime= */ Date.now());
  153.       }
  154.     };
  156.     /** @private {shaka.util.Timer} */
  157.     this.timeUpdateTimer_ = new shaka.util.Timer(this.checkForInterstitials_);
  160.     /** @private {shaka.util.Timer} */
  161.     this.pollTimer_ = new shaka.util.Timer(async () => {
  162.       if (this.interstitials_.size && this.lastTime_ != null) {
  163.         const currentLoadMode = this.basePlayer_.getLoadMode();
  164.         if (currentLoadMode == shaka.Player.LoadMode.DESTROYED ||
  165.             currentLoadMode == shaka.Player.LoadMode.NOT_LOADED) {
  166.           return;
  167.         }
  168.         let cuepointsChanged = false;
  169.         const interstitials = Array.from(this.interstitials_);
  170.         const seekRange = this.basePlayer_.seekRange();
  171.         for (const interstitial of interstitials) {
  172.           if (interstitial == this.lastPlayedAd_) {
  173.             continue;
  174.           }
  175.           const comparisonTime = interstitial.endTime || interstitial.startTime;
  176.           if ((seekRange.start - comparisonTime) >= 1) {
  177.             if (this.preloadManagerInterstitials_.has(interstitial)) {
  178.               const preloadManager =
  179.                   // eslint-disable-next-line no-await-in-loop
  180.                   await this.preloadManagerInterstitials_.get(interstitial);
  181.               if (preloadManager) {
  182.                 preloadManager.destroy();
  183.               }
  184.               this.preloadManagerInterstitials_.delete(interstitial);
  185.             }
  186.             this.removePreloadOnDomElements_(interstitial);
  187.             const interstitialId = JSON.stringify(interstitial);
  188.             if (this.interstitialIds_.has(interstitialId)) {
  189.               this.interstitialIds_.delete(interstitialId);
  190.             }
  191.             this.interstitials_.delete(interstitial);
  192.             this.removeEventListeners_();
  193.             if (!interstitial.overlay) {
  194.               cuepointsChanged = true;
  195.             }
  196.           } else {
  197.             const difference = interstitial.startTime - this.lastTime_;
  198.             if (difference > 0 && difference <= 10) {
  199.               if (!this.preloadManagerInterstitials_.has(interstitial) &&
  200.                   this.isPreloadAllowed_(interstitial)) {
  201.                 this.preloadManagerInterstitials_.set(
  202.                     interstitial, this.player_.preload(
  203.                         interstitial.uri,
  204.                         /* startTime= */ null,
  205.                         interstitial.mimeType || undefined));
  206.               }
  207.               this.checkPreloadOnDomElements_(interstitial);
  208.             }
  209.           }
  210.         }
  211.         if (cuepointsChanged) {
  212.           this.cuepointsChanged_();
  213.         }
  214.       }
  215.     });
  216.   }
  218.   /**
  219.    * Called by the AdManager to provide an updated configuration any time it
  220.    * changes.
  221.    *
  222.    * @param {shaka.extern.AdsConfiguration} config
  223.    */
  224.   configure(config) {
  225.     this.config_ = config;
  226.     this.determineIfUsingBaseVideo_();
  227.   }
  229.   /**
  230.    * @private
  231.    */
  232.   addEventListeners_() {
  233.     if (this.usingListeners_ || !this.interstitials_.size) {
  234.       return;
  235.     }
  236.     this.eventManager_.listen(
  237.         this.baseVideo_, 'playing', this.onTimeUpdate_);
  238.     this.eventManager_.listen(
  239.         this.baseVideo_, 'timeupdate', this.onTimeUpdate_);
  240.     this.eventManager_.listen(
  241.         this.baseVideo_, 'ended', this.checkForInterstitials_);
  242.     if ('requestVideoFrameCallback' in this.baseVideo_ &&
  243.         !shaka.util.Platform.isSmartTV()) {
  244.       const baseVideo = /** @type {!HTMLVideoElement} */ (this.baseVideo_);
  245.       const videoFrameCallback = (now, metadata) => {
  246.         if (this.videoCallbackId_ == -1) {
  247.           return;
  248.         }
  249.         this.checkForInterstitials_();
  250.         // It is necessary to check this again because this callback can be
  251.         // executed in another thread by the browser and we have to be sure
  252.         // again here that we have not cancelled it in the middle of an
  253.         // execution.
  254.         if (this.videoCallbackId_ == -1) {
  255.           return;
  256.         }
  257.         this.videoCallbackId_ =
  258.             baseVideo.requestVideoFrameCallback(videoFrameCallback);
  259.       };
  260.       this.videoCallbackId_ =
  261.           baseVideo.requestVideoFrameCallback(videoFrameCallback);
  262.     } else {
  263.       this.timeUpdateTimer_.tickEvery(/* seconds= */ 0.025);
  264.     }
  266.     if (this.pollTimer_) {
  267.       this.pollTimer_.tickEvery(/* seconds= */ 1); ;
  268.     }
  269.     this.usingListeners_ = true;
  270.   }
  272.   /**
  273.    * @private
  274.    */
  275.   removeEventListeners_() {
  276.     if (!this.usingListeners_ || this.interstitials_.size) {
  277.       return;
  278.     }
  279.     this.eventManager_.unlisten(
  280.         this.baseVideo_, 'playing', this.onTimeUpdate_);
  281.     this.eventManager_.unlisten(
  282.         this.baseVideo_, 'timeupdate', this.onTimeUpdate_);
  283.     this.eventManager_.unlisten(
  284.         this.baseVideo_, 'ended', this.checkForInterstitials_);
  285.     if (this.videoCallbackId_ != -1) {
  286.       const baseVideo = /** @type {!HTMLVideoElement} */ (this.baseVideo_);
  287.       baseVideo.cancelVideoFrameCallback(this.videoCallbackId_);
  288.       this.videoCallbackId_ = -1;
  289.     }
  290.     if (this.timeUpdateTimer_) {
  291.       this.timeUpdateTimer_.stop();
  292.     }
  293.     if (this.pollTimer_) {
  294.       this.pollTimer_.stop();
  295.     }
  296.     this.usingListeners_ = false;
  297.   }
  299.   /**
  300.    * @private
  301.    */
  302.   determineIfUsingBaseVideo_() {
  303.     if (!this.adContainer_ || !this.config_ || this.playingAd_) {
  304.       return;
  305.     }
  306.     let supportsMultipleMediaElements =
  307.         this.config_.supportsMultipleMediaElements;
  308.     const video = /** @type {HTMLVideoElement} */(this.baseVideo_);
  309.     if (video.webkitSupportsFullscreen && video.webkitDisplayingFullscreen) {
  310.       supportsMultipleMediaElements = false;
  311.     }
  312.     if (this.usingBaseVideo_ != supportsMultipleMediaElements) {
  313.       return;
  314.     }
  315.     this.usingBaseVideo_ = !supportsMultipleMediaElements;
  316.     if (this.usingBaseVideo_) {
  317.       this.video_ = this.baseVideo_;
  318.       if (this.adVideo_) {
  319.         if (this.adVideo_.parentElement) {
  320.           this.adContainer_.removeChild(this.adVideo_);
  321.         }
  322.         this.adVideo_ = null;
  323.       }
  324.     } else {
  325.       if (!this.adVideo_) {
  326.         this.adVideo_ = this.createMediaElement_();
  327.       }
  328.       this.video_ = this.adVideo_;
  329.     }
  330.   }
  333.   /**
  334.    * Resets the Interstitial manager and removes any continuous polling.
  335.    */
  336.   stop() {
  337.     if (this.adEventManager_) {
  338.       this.adEventManager_.removeAll();
  339.     }
  340.     this.interstitialIds_.clear();
  341.     this.interstitials_.clear();
  342.     this.player_.destroyAllPreloads();
  343.     if (this.preloadManagerInterstitials_.size) {
  344.       const values = Array.from(this.preloadManagerInterstitials_.values());
  345.       for (const value of values) {
  346.         if (value) {
  347.           value.then((preloadManager) => {
  348.             if (preloadManager) {
  349.               preloadManager.destroy();
  350.             }
  351.           });
  352.         }
  353.       };
  354.     }
  355.     this.preloadManagerInterstitials_.clear();
  356.     if (this.preloadOnDomElements_.size) {
  357.       const interstitials = Array.from(this.preloadOnDomElements_.keys());
  358.       for (const interstitial of interstitials) {
  359.         this.removePreloadOnDomElements_(interstitial);
  360.       }
  361.     }
  362.     this.preloadOnDomElements_.clear();
  363.     this.player_.detach();
  364.     this.playingAd_ = false;
  365.     this.lastTime_ = null;
  366.     this.lastPlayedAd_ = null;
  367.     this.usingBaseVideo_ = true;
  368.     this.video_ = this.baseVideo_;
  369.     this.adVideo_ = null;
  370.     this.removeBaseStyles_();
  371.     this.removeEventListeners_();
  372.     if (this.adContainer_) {
  373.       shaka.util.Dom.removeAllChildren(this.adContainer_);
  374.     }
  375.     if (this.playoutLimitTimer_) {
  376.       this.playoutLimitTimer_.stop();
  377.       this.playoutLimitTimer_ = null;
  378.     }
  379.   }
  381.   /** @override */
  382.   release() {
  383.     this.stop();
  384.     if (this.eventManager_) {
  385.       this.eventManager_.release();
  386.     }
  387.     if (this.adEventManager_) {
  388.       this.adEventManager_.release();
  389.     }
  390.     if (this.timeUpdateTimer_) {
  391.       this.timeUpdateTimer_.stop();
  392.       this.timeUpdateTimer_ = null;
  393.     }
  394.     if (this.pollTimer_) {
  395.       this.pollTimer_.stop();
  396.       this.pollTimer_ = null;
  397.     }
  398.     this.player_.destroy();
  399.   }
  401.   /**
  402.    * @return {shaka.Player}
  403.    */
  404.   getPlayer() {
  405.     return this.player_;
  406.   }
  408.   /**
  409.    * @param {shaka.extern.HLSInterstitial} hlsInterstitial
  410.    */
  411.   async addMetadata(hlsInterstitial) {
  412.     this.updatePlayerConfig_();
  413.     const adInterstitials = await this.getInterstitialsInfo_(hlsInterstitial);
  414.     if (adInterstitials.length) {
  415.       this.addInterstitials(adInterstitials);
  416.     } else {
  417.       shaka.log.alwaysWarn('Unsupported HLS interstitial', hlsInterstitial);
  418.     }
  419.   }
  421.   /**
  422.    * @param {shaka.extern.TimelineRegionInfo} region
  423.    */
  424.   addRegion(region) {
  425.     const TXml = shaka.util.TXml;
  426.     const isReplace =
  427.         region.schemeIdUri == 'urn:mpeg:dash:event:alternativeMPD:replace:2025';
  428.     const isInsert =
  429.         region.schemeIdUri == 'urn:mpeg:dash:event:alternativeMPD:insert:2025';
  430.     if (!isReplace && !isInsert) {
  431.       shaka.log.warning('Unsupported alternative media presentation', region);
  432.       return;
  433.     }
  435.     const startTime = region.startTime;
  436.     let endTime = region.endTime;
  437.     let playoutLimit = null;
  438.     let resumeOffset = 0;
  439.     let interstitialUri;
  440.     for (const node of region.eventNode.children) {
  441.       if (node.tagName == 'AlternativeMPD') {
  442.         const uri = node.attributes['uri'];
  443.         if (uri) {
  444.           interstitialUri = uri;
  445.           break;
  446.         }
  447.       } else if (node.tagName == 'InsertPresentation' ||
  448.           node.tagName == 'ReplacePresentation') {
  449.         const url = node.attributes['url'];
  450.         if (url) {
  451.           interstitialUri = url;
  452.           const unscaledMaxDuration =
  453.               TXml.parseAttr(node, 'maxDuration', TXml.parseInt);
  454.           if (unscaledMaxDuration) {
  455.             playoutLimit = unscaledMaxDuration / region.timescale;
  456.           }
  457.           const unscaledReturnOffset =
  458.               TXml.parseAttr(node, 'returnOffset', TXml.parseInt);
  459.           if (unscaledReturnOffset) {
  460.             resumeOffset = unscaledReturnOffset / region.timescale;
  461.           }
  462.           if (isReplace && resumeOffset) {
  463.             endTime = startTime + resumeOffset;
  464.           }
  465.           break;
  466.         }
  467.       }
  468.     }
  469.     if (!interstitialUri) {
  470.       shaka.log.warning('Unsupported alternative media presentation', region);
  471.       return;
  472.     }
  474.     /** @type {!shaka.extern.AdInterstitial} */
  475.     const interstitial = {
  476.       id: region.id,
  477.       groupId: null,
  478.       startTime,
  479.       endTime,
  480.       uri: interstitialUri,
  481.       mimeType: null,
  482.       isSkippable: false,
  483.       skipOffset: null,
  484.       skipFor: null,
  485.       canJump: true,
  486.       resumeOffset: isInsert ? resumeOffset : null,
  487.       playoutLimit,
  488.       once: false,
  489.       pre: false,
  490.       post: false,
  491.       timelineRange: isReplace && !isInsert,
  492.       loop: false,
  493.       overlay: null,
  494.       displayOnBackground: false,
  495.       currentVideo: null,
  496.       background: null,
  497.     };
  498.     this.addInterstitials([interstitial]);
  499.   }
  501.   /**
  502.    * @param {shaka.extern.TimelineRegionInfo} region
  503.    */
  504.   addOverlayRegion(region) {
  505.     const TXml = shaka.util.TXml;
  507.     goog.asserts.assert(region.eventNode, 'Need a region eventNode');
  508.     const overlayEvent = TXml.findChild(region.eventNode, 'OverlayEvent');
  509.     const uri = overlayEvent.attributes['uri'];
  510.     const mimeType = overlayEvent.attributes['mimeType'];
  511.     const loop = overlayEvent.attributes['loop'] == 'true';
  512.     const z = TXml.parseAttr(overlayEvent, 'z', TXml.parseInt);
  513.     if (!uri || z == 0) {
  514.       shaka.log.warning('Unsupported OverlayEvent', region);
  515.       return;
  516.     }
  518.     /** @type {!shaka.extern.AdPositionInfo} */
  519.     let overlay = {
  520.       viewport: {
  521.         x: 1920,
  522.         y: 1080,
  523.       },
  524.       topLeft: {
  525.         x: 0,
  526.         y: 0,
  527.       },
  528.       size: {
  529.         x: 1920,
  530.         y: 1080,
  531.       },
  532.     };
  534.     const viewport = TXml.findChild(overlayEvent, 'Viewport');
  535.     const topLeft = TXml.findChild(overlayEvent, 'TopLeft');
  536.     const size = TXml.findChild(overlayEvent, 'Size');
  537.     if (viewport && topLeft && size) {
  538.       const viewportX = TXml.parseAttr(viewport, 'x', TXml.parseInt);
  539.       if (viewportX == null) {
  540.         shaka.log.warning('Unsupported OverlayEvent', region);
  541.         return;
  542.       }
  543.       const viewportY = TXml.parseAttr(viewport, 'y', TXml.parseInt);
  544.       if (viewportY == null) {
  545.         shaka.log.warning('Unsupported OverlayEvent', region);
  546.         return;
  547.       }
  548.       const topLeftX = TXml.parseAttr(topLeft, 'x', TXml.parseInt);
  549.       if (topLeftX == null) {
  550.         shaka.log.warning('Unsupported OverlayEvent', region);
  551.         return;
  552.       }
  553.       const topLeftY = TXml.parseAttr(topLeft, 'y', TXml.parseInt);
  554.       if (topLeftY == null) {
  555.         shaka.log.warning('Unsupported OverlayEvent', region);
  556.         return;
  557.       }
  558.       const sizeX = TXml.parseAttr(size, 'x', TXml.parseInt);
  559.       if (sizeX == null) {
  560.         shaka.log.warning('Unsupported OverlayEvent', region);
  561.         return;
  562.       }
  563.       const sizeY = TXml.parseAttr(size, 'y', TXml.parseInt);
  564.       if (sizeY == null) {
  565.         shaka.log.warning('Unsupported OverlayEvent', region);
  566.         return;
  567.       }
  568.       overlay = {
  569.         viewport: {
  570.           x: viewportX,
  571.           y: viewportY,
  572.         },
  573.         topLeft: {
  574.           x: topLeftX,
  575.           y: topLeftY,
  576.         },
  577.         size: {
  578.           x: sizeX,
  579.           y: sizeY,
  580.         },
  581.       };
  582.     }
  583.     const squeezeCurrent = TXml.findChild(overlayEvent, 'SqueezeCurrent');
  584.     let currentVideo = null;
  585.     if (squeezeCurrent) {
  586.       const percentage =
  587.           TXml.parseAttr(squeezeCurrent, 'percentage', TXml.parseFloat);
  588.       if (percentage) {
  589.         currentVideo = {
  590.           viewport: {
  591.             x: 1920,
  592.             y: 1080,
  593.           },
  594.           topLeft: {
  595.             x: 0,
  596.             y: 0,
  597.           },
  598.           size: {
  599.             x: 1920 * percentage,
  600.             y: 1080 * percentage,
  601.           },
  602.         };
  603.       }
  604.     }
  606.     /** @type {!shaka.extern.AdInterstitial} */
  607.     const interstitial = {
  608.       id: region.id,
  609.       groupId: null,
  610.       startTime: region.startTime,
  611.       endTime: region.endTime,
  612.       uri,
  613.       mimeType,
  614.       isSkippable: false,
  615.       skipOffset: null,
  616.       skipFor: null,
  617.       canJump: true,
  618.       resumeOffset: null,
  619.       playoutLimit: null,
  620.       once: false,
  621.       pre: false,
  622.       post: false,
  623.       timelineRange: true,
  624.       loop,
  625.       overlay,
  626.       displayOnBackground: z == -1,
  627.       currentVideo,
  628.       background: null,
  629.     };
  630.     this.addInterstitials([interstitial]);
  631.   }
  633.   /**
  634.    * @param {string} url
  635.    * @return {!Promise}
  636.    */
  637.   async addAdUrlInterstitial(url) {
  638.     const NetworkingEngine = shaka.net.NetworkingEngine;
  639.     const context = {
  640.       type: NetworkingEngine.AdvancedRequestType.INTERSTITIAL_AD_URL,
  641.     };
  642.     const responseData = await this.makeAdRequest_(url, context);
  643.     const data = shaka.util.TXml.parseXml(responseData, 'VAST,vmap:VMAP');
  644.     if (!data) {
  645.       throw new shaka.util.Error(
  646.           shaka.util.Error.Severity.CRITICAL,
  647.           shaka.util.Error.Category.ADS,
  648.           shaka.util.Error.Code.VAST_INVALID_XML);
  649.     }
  650.     let interstitials = [];
  651.     if (data.tagName == 'VAST') {
  652.       interstitials = shaka.ads.Utils.parseVastToInterstitials(
  653.           data, this.lastTime_);
  654.     } else if (data.tagName == 'vmap:VMAP') {
  655.       for (const ad of shaka.ads.Utils.parseVMAP(data)) {
  656.         // eslint-disable-next-line no-await-in-loop
  657.         const vastResponseData = await this.makeAdRequest_(ad.uri, context);
  658.         const vast = shaka.util.TXml.parseXml(vastResponseData, 'VAST');
  659.         if (!vast) {
  660.           throw new shaka.util.Error(
  661.               shaka.util.Error.Severity.CRITICAL,
  662.               shaka.util.Error.Category.ADS,
  663.               shaka.util.Error.Code.VAST_INVALID_XML);
  664.         }
  665.         interstitials.push(...shaka.ads.Utils.parseVastToInterstitials(
  666.             vast, ad.time));
  667.       }
  668.     }
  669.     this.addInterstitials(interstitials);
  670.   }
  673.   /**
  674.    * @param {!Array<shaka.extern.AdInterstitial>} interstitials
  675.    */
  676.   async addInterstitials(interstitials) {
  677.     let cuepointsChanged = false;
  678.     for (const interstitial of interstitials) {
  679.       if (!interstitial.uri) {
  680.         shaka.log.alwaysWarn('Missing URL in interstitial', interstitial);
  681.         continue;
  682.       }
  683.       if (!interstitial.mimeType) {
  684.         try {
  685.           const netEngine = this.player_.getNetworkingEngine();
  686.           goog.asserts.assert(netEngine, 'Need networking engine');
  687.           // eslint-disable-next-line no-await-in-loop
  688.           interstitial.mimeType = await shaka.net.NetworkingUtils.getMimeType(
  689.               interstitial.uri, netEngine,
  690.               this.basePlayer_.getConfiguration().streaming.retryParameters);
  691.         } catch (error) {}
  692.       }
  693.       const interstitialId = interstitial.id || JSON.stringify(interstitial);
  694.       if (this.interstitialIds_.has(interstitialId)) {
  695.         continue;
  696.       }
  697.       if (interstitial.loop && !interstitial.overlay) {
  698.         shaka.log.alwaysWarn('Loop is only supported in overlay interstitials',
  699.             interstitial);
  700.       }
  701.       if (!interstitial.overlay) {
  702.         cuepointsChanged = true;
  703.       }
  704.       this.interstitialIds_.add(interstitialId);
  705.       this.interstitials_.add(interstitial);
  706.       let shouldPreload = false;
  707.       if (interstitial.pre && this.lastTime_ == null) {
  708.         shouldPreload = true;
  709.       } else if (interstitial.startTime == 0 && !interstitial.canJump) {
  710.         shouldPreload = true;
  711.       } else if (this.lastTime_ != null) {
  712.         const difference = interstitial.startTime - this.lastTime_;
  713.         if (difference > 0 && difference <= 10) {
  714.           shouldPreload = true;
  715.         }
  716.       }
  717.       if (shouldPreload) {
  718.         if (!this.preloadManagerInterstitials_.has(interstitial) &&
  719.             this.isPreloadAllowed_(interstitial)) {
  720.           this.preloadManagerInterstitials_.set(
  721.               interstitial, this.player_.preload(
  722.                   interstitial.uri,
  723.                   /* startTime= */ null,
  724.                   interstitial.mimeType || undefined));
  725.         }
  726.         this.checkPreloadOnDomElements_(interstitial);
  727.       }
  728.     }
  729.     if (cuepointsChanged) {
  730.       this.cuepointsChanged_();
  731.     }
  732.     this.addEventListeners_();
  733.   }
  735.   /**
  736.    * @return {!HTMLMediaElement}
  737.    * @private
  738.    */
  739.   createMediaElement_() {
  740.     const video = /** @type {!HTMLMediaElement} */(
  741.       document.createElement(this.baseVideo_.tagName));
  742.     video.autoplay = true;
  743.     video.style.position = 'absolute';
  744.     video.style.top = '0';
  745.     video.style.left = '0';
  746.     video.style.width = '100%';
  747.     video.style.height = '100%';
  748.     video.style.display = 'none';
  749.     video.setAttribute('playsinline', '');
  750.     return video;
  751.   }
  754.   /**
  755.    * @param {boolean=} needPreRoll
  756.    * @param {?number=} numberToSkip
  757.    * @return {?shaka.extern.AdInterstitial}
  758.    * @private
  759.    */
  760.   getCurrentInterstitial_(needPreRoll = false, numberToSkip = null) {
  761.     let skipped = 0;
  762.     let currentInterstitial = null;
  763.     if (this.interstitials_.size && this.lastTime_ != null) {
  764.       const isEnded = this.baseVideo_.ended;
  765.       const interstitials = Array.from(this.interstitials_).sort((a, b) => {
  766.         return b.startTime - a.startTime;
  767.       });
  768.       const roundDecimals = (number) => {
  769.         return Math.round(number * 1000) / 1000;
  770.       };
  771.       let interstitialsToCheck = interstitials;
  772.       if (needPreRoll) {
  773.         interstitialsToCheck = interstitials.filter((i) => i.pre);
  774.       } else if (isEnded) {
  775.         interstitialsToCheck = interstitials.filter((i) => i.post);
  776.       } else {
  777.         interstitialsToCheck = interstitials.filter((i) => !i.pre && !i.post);
  778.       }
  779.       for (const interstitial of interstitialsToCheck) {
  780.         let isValid = false;
  781.         if (needPreRoll) {
  782.           isValid = interstitial.pre;
  783.         } else if (isEnded) {
  784.           isValid = interstitial.post;
  785.         } else if (!interstitial.pre && !interstitial.post) {
  786.           const difference =
  787.               this.lastTime_ - roundDecimals(interstitial.startTime);
  788.           if (difference > 0 &&
  789.               (difference <= 1 || !interstitial.canJump)) {
  790.             if (numberToSkip == null && this.lastPlayedAd_ &&
  791.                 !this.lastPlayedAd_.pre && !this.lastPlayedAd_.post &&
  792.                 this.lastPlayedAd_.startTime >= interstitial.startTime) {
  793.               isValid = false;
  794.             } else {
  795.               isValid = true;
  796.             }
  797.           }
  798.         }
  799.         if (isValid && (!this.lastPlayedAd_ ||
  800.             interstitial.startTime >= this.lastPlayedAd_.startTime)) {
  801.           if (skipped == (numberToSkip || 0)) {
  802.             currentInterstitial = interstitial;
  803.           } else if (currentInterstitial && !interstitial.canJump) {
  804.             const currentStartTime =
  805.                 roundDecimals(currentInterstitial.startTime);
  806.             const newStartTime =
  807.                 roundDecimals(interstitial.startTime);
  808.             if (newStartTime - currentStartTime > 0.001) {
  809.               currentInterstitial = interstitial;
  810.               skipped = 0;
  811.             }
  812.           }
  813.           skipped++;
  814.         }
  815.       }
  816.     }
  817.     return currentInterstitial;
  818.   }
  821.   /**
  822.    * @param {shaka.extern.AdInterstitial} interstitial
  823.    * @param {number} sequenceLength
  824.    * @param {number} adPosition
  825.    * @param {number} initialTime the clock time the ad started at
  826.    * @param {number=} oncePlayed
  827.    * @private
  828.    */
  829.   setupAd_(interstitial, sequenceLength, adPosition, initialTime,
  830.       oncePlayed = 0) {
  831.     shaka.log.info('Starting interstitial',
  832.         interstitial.startTime, 'at', this.lastTime_);
  834.     this.lastPlayedAd_ = interstitial;
  836.     this.determineIfUsingBaseVideo_();
  837.     goog.asserts.assert(this.video_, 'Must have video');
  839.     if (!this.video_.parentElement && this.adContainer_) {
  840.       this.adContainer_.appendChild(this.video_);
  841.     }
  843.     if (adPosition == 1 && sequenceLength == 1) {
  844.       sequenceLength = Array.from(this.interstitials_).filter((i) => {
  845.         if (interstitial.pre) {
  846.           return i.pre == interstitial.pre;
  847.         } else if (interstitial.post) {
  848.           return i.post == interstitial.post;
  849.         }
  850.         return Math.abs(i.startTime - interstitial.startTime) < 0.001;
  851.       }).length;
  852.     }
  854.     if (interstitial.once) {
  855.       oncePlayed++;
  856.       this.interstitials_.delete(interstitial);
  857.       this.removeEventListeners_();
  858.       if (!interstitial.overlay) {
  859.         this.cuepointsChanged_();
  860.       }
  861.     }
  863.     if (interstitial.mimeType) {
  864.       if (interstitial.mimeType.startsWith('image/') ||
  865.           interstitial.mimeType === 'text/html') {
  866.         if (!interstitial.overlay) {
  867.           shaka.log.alwaysWarn('Unsupported interstitial', interstitial);
  868.           return;
  869.         }
  870.         this.setupStaticAd_(interstitial, sequenceLength, adPosition,
  871.             oncePlayed);
  872.         return;
  873.       }
  874.     }
  875.     if (this.usingBaseVideo_ && interstitial.overlay) {
  876.       shaka.log.alwaysWarn('Unsupported interstitial', interstitial);
  877.       return;
  878.     }
  879.     this.setupVideoAd_(interstitial, sequenceLength, adPosition, initialTime,
  880.         oncePlayed);
  881.   }
  884.   /**
  885.    * @param {shaka.extern.AdInterstitial} interstitial
  886.    * @param {number} sequenceLength
  887.    * @param {number} adPosition
  888.    * @param {number} oncePlayed
  889.    * @private
  890.    */
  891.   setupStaticAd_(interstitial, sequenceLength, adPosition, oncePlayed) {
  892.     const overlay = interstitial.overlay;
  893.     goog.asserts.assert(overlay, 'Must have overlay');
  895.     const tagName = interstitial.mimeType == 'text/html' ? 'iframe' : 'img';
  897.     const htmlElement = /** @type {!(HTMLImageElement|HTMLIFrameElement)} */ (
  898.       document.createElement(tagName));
  899.     htmlElement.style.objectFit = 'contain';
  900.     htmlElement.style.position = 'absolute';
  901.     htmlElement.style.border = 'none';
  903.     this.setBaseStyles_(interstitial);
  905.     const basicTask = () => {
  906.       if (this.playoutLimitTimer_) {
  907.         this.playoutLimitTimer_.stop();
  908.         this.playoutLimitTimer_ = null;
  909.       }
  910.       this.adContainer_.removeChild(htmlElement);
  911.       this.removeBaseStyles_(interstitial);
  912.       this.onEvent_(
  913.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_STOPPED));
  914.       const nextCurrentInterstitial = this.getCurrentInterstitial_(
  915.           interstitial.pre, adPosition - oncePlayed);
  916.       if (nextCurrentInterstitial) {
  917.         this.adEventManager_.removeAll();
  918.         this.setupAd_(nextCurrentInterstitial, sequenceLength,
  919.             ++adPosition, /* initialTime= */ Date.now(), oncePlayed);
  920.       } else {
  921.         this.playingAd_ = false;
  922.       }
  923.     };
  925.     const ad = new shaka.ads.InterstitialStaticAd(
  926.         interstitial, sequenceLength, adPosition);
  928.     this.onEvent_(
  929.         new shaka.util.FakeEvent(shaka.ads.Utils.AD_STARTED,
  930.             (new Map()).set('ad', ad)));
  932.     if (tagName == 'iframe') {
  933.       htmlElement.src = interstitial.uri;
  934.     } else {
  935.       htmlElement.src = interstitial.uri;
  936.       htmlElement.onerror = (e) => {
  937.         this.onEvent_(new shaka.util.FakeEvent(shaka.ads.Utils.AD_ERROR,
  938.             (new Map()).set('originalEvent', e)));
  939.         basicTask();
  940.       };
  941.     }
  943.     const viewport = overlay.viewport;
  944.     const topLeft = overlay.topLeft;
  945.     const size = overlay.size;
  946.     // Special case for VAST non-linear ads
  947.     if (viewport.x == 0 && viewport.y == 0) {
  948.       htmlElement.width = interstitial.overlay.size.x;
  949.       htmlElement.height = interstitial.overlay.size.y;
  950.       htmlElement.style.bottom = '10%';
  951.       htmlElement.style.left = '0';
  952.       htmlElement.style.right = '0';
  953.       htmlElement.style.width = '100%';
  954.       if (!interstitial.overlay.size.y && tagName == 'iframe') {
  955.         htmlElement.style.height = 'auto';
  956.       }
  957.     } else {
  958.       htmlElement.style.height = (size.y / viewport.y * 100) + '%';
  959.       htmlElement.style.left = (topLeft.x / viewport.x * 100) + '%';
  960.       htmlElement.style.top = (topLeft.y / viewport.y * 100) + '%';
  961.       htmlElement.style.width = (size.x / viewport.x * 100) + '%';
  962.     }
  963.     this.adContainer_.appendChild(htmlElement);
  965.     const startTime = Date.now();
  966.     if (this.playoutLimitTimer_) {
  967.       this.playoutLimitTimer_.stop();
  968.     }
  969.     this.playoutLimitTimer_ = new shaka.util.Timer(() => {
  970.       if (interstitial.playoutLimit &&
  971.           (Date.now() - startTime) / 1000 > interstitial.playoutLimit) {
  972.         this.onEvent_(
  973.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_COMPLETE));
  974.         basicTask();
  975.       } else if (interstitial.endTime &&
  976.           this.baseVideo_.currentTime > interstitial.endTime) {
  977.         this.onEvent_(
  978.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_COMPLETE));
  979.         basicTask();
  980.       } else if (this.baseVideo_.currentTime < interstitial.startTime) {
  981.         this.onEvent_(
  982.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_SKIPPED));
  983.         basicTask();
  984.       }
  985.     });
  986.     if (interstitial.playoutLimit && !interstitial.endTime) {
  987.       this.playoutLimitTimer_.tickAfter(interstitial.playoutLimit);
  988.     } else if (interstitial.endTime) {
  989.       this.playoutLimitTimer_.tickEvery(/* seconds= */ 0.025);
  990.     }
  991.     this.adEventManager_.listen(this.baseVideo_, 'seeked', () => {
  992.       const currentTime = this.baseVideo_.currentTime;
  993.       if (currentTime < interstitial.startTime ||
  994.           (interstitial.endTime && currentTime > interstitial.endTime)) {
  995.         if (this.playoutLimitTimer_) {
  996.           this.playoutLimitTimer_.stop();
  997.         }
  998.         this.onEvent_(
  999.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_SKIPPED));
  1000.         basicTask();
  1001.       }
  1002.     });
  1003.   }
  1006.   /**
  1007.    * @param {shaka.extern.AdInterstitial} interstitial
  1008.    * @param {number} sequenceLength
  1009.    * @param {number} adPosition
  1010.    * @param {number} initialTime the clock time the ad started at
  1011.    * @param {number} oncePlayed
  1012.    * @private
  1013.    */
  1014.   async setupVideoAd_(interstitial, sequenceLength, adPosition, initialTime,
  1015.       oncePlayed) {
  1016.     goog.asserts.assert(this.video_, 'Must have video');
  1017.     const startTime = Date.now();
  1019.     this.playingAd_ = true;
  1021.     if (this.usingBaseVideo_ && adPosition == 1) {
  1022.       this.onEvent_(new shaka.util.FakeEvent(
  1023.           shaka.ads.Utils.AD_CONTENT_PAUSE_REQUESTED,
  1024.           (new Map()).set('saveLivePosition', true)));
  1025.       const detachBasePlayerPromise = new shaka.util.PublicPromise();
  1026.       const checkState = async (e) => {
  1027.         if (e['state'] == 'detach') {
  1028.           if (shaka.util.Platform.isSmartTV()) {
  1029.             await new Promise(
  1030.                 (resolve) => new shaka.util.Timer(resolve).tickAfter(0.1));
  1031.           }
  1032.           detachBasePlayerPromise.resolve();
  1033.           this.adEventManager_.unlisten(
  1034.               this.basePlayer_, 'onstatechange', checkState);
  1035.         }
  1036.       };
  1037.       this.adEventManager_.listen(
  1038.           this.basePlayer_, 'onstatechange', checkState);
  1039.       await detachBasePlayerPromise;
  1040.     }
  1041.     this.setBaseStyles_(interstitial);
  1042.     if (!this.usingBaseVideo_) {
  1043.       this.video_.style.display = '';
  1044.       if (interstitial.overlay) {
  1045.         this.video_.loop = interstitial.loop;
  1046.         const viewport = interstitial.overlay.viewport;
  1047.         const topLeft = interstitial.overlay.topLeft;
  1048.         const size = interstitial.overlay.size;
  1049.         this.video_.style.height = (size.y / viewport.y * 100) + '%';
  1050.         this.video_.style.left = (topLeft.x / viewport.x * 100) + '%';
  1051.         this.video_.style.top = (topLeft.y / viewport.y * 100) + '%';
  1052.         this.video_.style.width = (size.x / viewport.x * 100) + '%';
  1053.       } else {
  1054.         this.baseVideo_.pause();
  1055.         if (interstitial.resumeOffset != null &&
  1056.             interstitial.resumeOffset != 0) {
  1057.           this.baseVideo_.currentTime += interstitial.resumeOffset;
  1058.         }
  1059.         this.video_.loop = false;
  1060.         this.video_.style.height = '100%';
  1061.         this.video_.style.left = '0';
  1062.         this.video_.style.top = '0';
  1063.         this.video_.style.width = '100%';
  1064.       }
  1065.     }
  1067.     let unloadingInterstitial = false;
  1069.     const updateBaseVideoTime = () => {
  1070.       if (!this.usingBaseVideo_ && !interstitial.overlay) {
  1071.         if (interstitial.resumeOffset == null) {
  1072.           if (interstitial.timelineRange && interstitial.endTime &&
  1073.               interstitial.endTime != Infinity) {
  1074.             if (this.baseVideo_.currentTime != interstitial.endTime) {
  1075.               this.baseVideo_.currentTime = interstitial.endTime;
  1076.             }
  1077.           } else {
  1078.             const now = Date.now();
  1079.             this.baseVideo_.currentTime += (now - initialTime) / 1000;
  1080.             initialTime = now;
  1081.           }
  1082.         }
  1083.       }
  1084.     };
  1086.     const basicTask = async (isSkip) => {
  1087.       updateBaseVideoTime();
  1088.       // Optimization to avoid returning to main content when there is another
  1089.       // interstitial below.
  1090.       let nextCurrentInterstitial = this.getCurrentInterstitial_(
  1091.           interstitial.pre, adPosition - oncePlayed);
  1092.       if (isSkip && interstitial.groupId) {
  1093.         while (nextCurrentInterstitial &&
  1094.             nextCurrentInterstitial.groupId == interstitial.groupId) {
  1095.           adPosition++;
  1096.           nextCurrentInterstitial = this.getCurrentInterstitial_(
  1097.               interstitial.pre, adPosition - oncePlayed);
  1098.         }
  1099.       }
  1100.       if (this.playoutLimitTimer_ && (!interstitial.groupId ||
  1101.           (nextCurrentInterstitial &&
  1102.             nextCurrentInterstitial.groupId != interstitial.groupId))) {
  1103.         this.playoutLimitTimer_.stop();
  1104.         this.playoutLimitTimer_ = null;
  1105.       }
  1106.       this.removeBaseStyles_(interstitial);
  1107.       if (!nextCurrentInterstitial || nextCurrentInterstitial.overlay) {
  1108.         if (interstitial.post) {
  1109.           this.lastTime_ = null;
  1110.           this.lastPlayedAd_ = null;
  1111.         }
  1112.         if (this.usingBaseVideo_) {
  1113.           await this.player_.detach();
  1114.         } else {
  1115.           await this.player_.unload();
  1116.         }
  1117.         if (this.usingBaseVideo_) {
  1118.           let offset = interstitial.resumeOffset;
  1119.           if (offset == null) {
  1120.             if (interstitial.timelineRange && interstitial.endTime &&
  1121.                 interstitial.endTime != Infinity) {
  1122.               offset = interstitial.endTime - (this.lastTime_ || 0);
  1123.             } else {
  1124.               offset = (Date.now() - initialTime) / 1000;
  1125.             }
  1126.           }
  1127.           this.onEvent_(new shaka.util.FakeEvent(
  1128.               shaka.ads.Utils.AD_CONTENT_RESUME_REQUESTED,
  1129.               (new Map()).set('offset', offset)));
  1130.         }
  1131.         this.onEvent_(
  1132.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_STOPPED));
  1133.         this.adEventManager_.removeAll();
  1134.         this.playingAd_ = false;
  1135.         if (!this.usingBaseVideo_) {
  1136.           this.video_.style.display = 'none';
  1137.           updateBaseVideoTime();
  1138.           if (!this.baseVideo_.ended) {
  1139.             this.baseVideo_.play();
  1140.           }
  1141.         } else {
  1142.           this.cuepointsChanged_();
  1143.         }
  1144.       }
  1145.       this.determineIfUsingBaseVideo_();
  1146.       if (nextCurrentInterstitial) {
  1147.         this.onEvent_(
  1148.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_STOPPED));
  1149.         this.adEventManager_.removeAll();
  1150.         this.setupAd_(nextCurrentInterstitial, sequenceLength,
  1151.             ++adPosition, initialTime, oncePlayed);
  1152.       }
  1153.     };
  1154.     const error = async (e) => {
  1155.       if (unloadingInterstitial) {
  1156.         return;
  1157.       }
  1158.       unloadingInterstitial = true;
  1159.       this.onEvent_(new shaka.util.FakeEvent(shaka.ads.Utils.AD_ERROR,
  1160.           (new Map()).set('originalEvent', e)));
  1161.       await basicTask(/* isSkip= */ false);
  1162.     };
  1163.     const complete = async () => {
  1164.       if (unloadingInterstitial) {
  1165.         return;
  1166.       }
  1167.       unloadingInterstitial = true;
  1168.       await basicTask(/* isSkip= */ false);
  1169.       this.onEvent_(
  1170.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_COMPLETE));
  1171.     };
  1172.     this.lastOnSkip_ = async () => {
  1173.       if (unloadingInterstitial) {
  1174.         return;
  1175.       }
  1176.       unloadingInterstitial = true;
  1177.       this.onEvent_(new shaka.util.FakeEvent(shaka.ads.Utils.AD_SKIPPED));
  1178.       await basicTask(/* isSkip= */ true);
  1179.     };
  1181.     const ad = new shaka.ads.InterstitialAd(this.video_,
  1182.         interstitial, this.lastOnSkip_, sequenceLength, adPosition,
  1183.         !this.usingBaseVideo_);
  1184.     if (!this.usingBaseVideo_) {
  1185.       ad.setMuted(this.baseVideo_.muted);
  1186.       ad.setVolume(this.baseVideo_.volume);
  1187.     }
  1189.     this.onEvent_(
  1190.         new shaka.util.FakeEvent(shaka.ads.Utils.AD_STARTED,
  1191.             (new Map()).set('ad', ad)));
  1193.     let prevCanSkipNow = ad.canSkipNow();
  1194.     if (prevCanSkipNow) {
  1195.       this.onEvent_(new shaka.util.FakeEvent(
  1196.           shaka.ads.Utils.AD_SKIP_STATE_CHANGED));
  1197.     }
  1198.     this.adEventManager_.listenOnce(this.player_, 'error', error);
  1199.     this.adEventManager_.listen(this.video_, 'timeupdate', () => {
  1200.       const duration = this.video_.duration;
  1201.       if (!duration) {
  1202.         return;
  1203.       }
  1204.       const currentCanSkipNow = ad.canSkipNow();
  1205.       if (prevCanSkipNow != currentCanSkipNow &&
  1206.           ad.getRemainingTime() > 0 && ad.getDuration() > 0) {
  1207.         this.onEvent_(
  1208.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_SKIP_STATE_CHANGED));
  1209.       }
  1210.       prevCanSkipNow = currentCanSkipNow;
  1211.     });
  1212.     this.adEventManager_.listenOnce(this.player_, 'firstquartile', () => {
  1213.       updateBaseVideoTime();
  1214.       this.onEvent_(
  1215.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_FIRST_QUARTILE));
  1216.     });
  1217.     this.adEventManager_.listenOnce(this.player_, 'midpoint', () => {
  1218.       updateBaseVideoTime();
  1219.       this.onEvent_(
  1220.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_MIDPOINT));
  1221.     });
  1222.     this.adEventManager_.listenOnce(this.player_, 'thirdquartile', () => {
  1223.       updateBaseVideoTime();
  1224.       this.onEvent_(
  1225.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_THIRD_QUARTILE));
  1226.     });
  1227.     this.adEventManager_.listenOnce(this.player_, 'complete', complete);
  1228.     this.adEventManager_.listen(this.video_, 'play', () => {
  1229.       this.onEvent_(
  1230.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_RESUMED));
  1231.     });
  1232.     this.adEventManager_.listen(this.video_, 'pause', () => {
  1233.       // playRangeEnd in src= causes the ended event not to be fired when that
  1234.       // position is reached, instead pause event is fired.
  1235.       const currentConfig = this.player_.getConfiguration();
  1236.       if (this.video_.currentTime >= currentConfig.playRangeEnd) {
  1237.         complete();
  1238.         return;
  1239.       }
  1240.       this.onEvent_(
  1241.           new shaka.util.FakeEvent(shaka.ads.Utils.AD_PAUSED));
  1242.     });
  1243.     this.adEventManager_.listen(this.video_, 'volumechange', () => {
  1244.       if (this.video_.muted) {
  1245.         this.onEvent_(
  1246.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_MUTED));
  1247.       } else {
  1248.         this.onEvent_(
  1249.             new shaka.util.FakeEvent(shaka.ads.Utils.AD_VOLUME_CHANGED));
  1250.       }
  1251.     });
  1252.     try {
  1253.       this.updatePlayerConfig_();
  1254.       if (interstitial.startTime && interstitial.endTime &&
  1255.           interstitial.endTime != Infinity &&
  1256.           interstitial.startTime != interstitial.endTime) {
  1257.         const duration = interstitial.endTime - interstitial.startTime;
  1258.         if (duration > 0) {
  1259.           this.player_.configure('playRangeEnd', duration);
  1260.         }
  1261.       }
  1262.       if (interstitial.playoutLimit && !this.playoutLimitTimer_) {
  1263.         this.playoutLimitTimer_ = new shaka.util.Timer(() => {
  1264.           this.lastOnSkip_();
  1265.         }).tickAfter(interstitial.playoutLimit);
  1266.         this.player_.configure('playRangeEnd', interstitial.playoutLimit);
  1267.       }
  1268.       await this.player_.attach(this.video_);
  1269.       if (this.preloadManagerInterstitials_.has(interstitial)) {
  1270.         const preloadManager =
  1271.             await this.preloadManagerInterstitials_.get(interstitial);
  1272.         this.preloadManagerInterstitials_.delete(interstitial);
  1273.         if (preloadManager) {
  1274.           await this.player_.load(preloadManager);
  1275.         } else {
  1276.           await this.player_.load(
  1277.               interstitial.uri,
  1278.               /* startTime= */ null,
  1279.               interstitial.mimeType || undefined);
  1280.         }
  1281.       } else {
  1282.         await this.player_.load(
  1283.             interstitial.uri,
  1284.             /* startTime= */ null,
  1285.             interstitial.mimeType || undefined);
  1286.       }
  1287.       this.video_.play();
  1288.       const loadTime = (Date.now() - startTime) / 1000;
  1289.       this.onEvent_(new shaka.util.FakeEvent(shaka.ads.Utils.ADS_LOADED,
  1290.           (new Map()).set('loadTime', loadTime)));
  1291.       if (this.usingBaseVideo_) {
  1292.         this.baseVideo_.play();
  1293.       }
  1294.       if (interstitial.overlay) {
  1295.         this.adEventManager_.listen(this.baseVideo_, 'seeking', () => {
  1296.           const newPosition =
  1297.               this.baseVideo_.currentTime - interstitial.startTime;
  1298.           if (Math.abs(newPosition - this.video_.currentTime) > 0.1) {
  1299.             this.video_.currentTime = newPosition;
  1300.           }
  1301.         });
  1302.         this.adEventManager_.listen(this.baseVideo_, 'seeked', () => {
  1303.           const currentTime = this.baseVideo_.currentTime;
  1304.           if (currentTime < interstitial.startTime ||
  1305.               (interstitial.endTime && currentTime > interstitial.endTime)) {
  1306.             this.lastOnSkip_();
  1307.           }
  1308.         });
  1309.       }
  1310.     } catch (e) {
  1311.       if (!this.playingAd_) {
  1312.         return;
  1313.       }
  1314.       error(e);
  1315.     }
  1316.   }
  1318.   /**
  1319.    * @param {shaka.extern.AdInterstitial} interstitial
  1320.    * @private
  1321.    */
  1322.   setBaseStyles_(interstitial) {
  1323.     if (interstitial.displayOnBackground) {
  1324.       this.baseVideo_.style.zIndex = '1';
  1325.     }
  1326.     if (interstitial.currentVideo != null) {
  1327.       const currentVideo = interstitial.currentVideo;
  1328.       this.baseVideo_.style.transformOrigin = 'top left';
  1329.       let addTransition = true;
  1330.       const transforms = [];
  1331.       const translateX = currentVideo.topLeft.x / currentVideo.viewport.x * 100;
  1332.       if (translateX > 0 && translateX <= 100) {
  1333.         transforms.push(`translateX(${translateX}%)`);
  1334.         // In the case of double box ads we do not want transitions.
  1335.         addTransition = false;
  1336.       }
  1337.       const translateY = currentVideo.topLeft.y / currentVideo.viewport.y * 100;
  1338.       if (translateY > 0 && translateY <= 100) {
  1339.         transforms.push(`translateY(${translateY}%)`);
  1340.         // In the case of double box ads we do not want transitions.
  1341.         addTransition = false;
  1342.       }
  1343.       const scaleX = currentVideo.size.x / currentVideo.viewport.x;
  1344.       if (scaleX < 1) {
  1345.         transforms.push(`scaleX(${scaleX})`);
  1346.       }
  1347.       const scaleY = currentVideo.size.y / currentVideo.viewport.y;
  1348.       if (scaleX < 1) {
  1349.         transforms.push(`scaleY(${scaleY})`);
  1350.       }
  1351.       if (transforms.length) {
  1352.         this.baseVideo_.style.transform = transforms.join(' ');
  1353.       }
  1354.       if (addTransition) {
  1355.         this.baseVideo_.style.transition = 'transform 250ms';
  1356.       }
  1357.     }
  1358.     if (this.adContainer_) {
  1359.       this.adContainer_.style.pointerEvents = 'none';
  1360.       if (interstitial.background) {
  1361.         this.adContainer_.style.background = interstitial.background;
  1362.       }
  1363.     }
  1364.     if (this.adVideo_) {
  1365.       if (interstitial.overlay) {
  1366.         this.adVideo_.style.background = '';
  1367.       } else {
  1368.         this.adVideo_.style.background = 'rgb(0, 0, 0)';
  1369.       }
  1370.     }
  1371.   }
  1373.   /**
  1374.    * @param {?shaka.extern.AdInterstitial=} interstitial
  1375.    * @private
  1376.    */
  1377.   removeBaseStyles_(interstitial) {
  1378.     if (!interstitial || interstitial.displayOnBackground) {
  1379.       this.baseVideo_.style.zIndex = '';
  1380.     }
  1381.     if (!interstitial || interstitial.currentVideo != null) {
  1382.       this.baseVideo_.style.transformOrigin = '';
  1383.       this.baseVideo_.style.transition = '';
  1384.       this.baseVideo_.style.transform = '';
  1385.     }
  1386.     if (this.adContainer_) {
  1387.       this.adContainer_.style.pointerEvents = '';
  1388.       if (!interstitial || interstitial.background) {
  1389.         this.adContainer_.style.background = '';
  1390.       }
  1391.     }
  1392.     if (this.adVideo_) {
  1393.       this.adVideo_.style.background = '';
  1394.     }
  1395.   }
  1397.   /**
  1398.    * @param {shaka.extern.HLSInterstitial} hlsInterstitial
  1399.    * @return {!Promise<!Array<shaka.extern.AdInterstitial>>}
  1400.    * @private
  1401.    */
  1402.   async getInterstitialsInfo_(hlsInterstitial) {
  1403.     const interstitialsAd = [];
  1404.     if (!hlsInterstitial) {
  1405.       return interstitialsAd;
  1406.     }
  1407.     const assetUri = hlsInterstitial.values.find((v) => v.key == 'X-ASSET-URI');
  1408.     const assetList =
  1409.         hlsInterstitial.values.find((v) => v.key == 'X-ASSET-LIST');
  1410.     if (!assetUri && !assetList) {
  1411.       return interstitialsAd;
  1412.     }
  1413.     let id = null;
  1414.     const hlsInterstitialId = hlsInterstitial.values.find((v) => v.key == 'ID');
  1415.     if (hlsInterstitialId) {
  1416.       id = /** @type {string} */(hlsInterstitialId.data);
  1417.     }
  1418.     const startTime = id == null ?
  1419.         Math.floor(hlsInterstitial.startTime * 10) / 10:
  1420.         hlsInterstitial.startTime;
  1421.     let endTime = hlsInterstitial.endTime;
  1422.     if (hlsInterstitial.endTime && hlsInterstitial.endTime != Infinity &&
  1423.         typeof(hlsInterstitial.endTime) == 'number') {
  1424.       endTime = id == null ?
  1425.           Math.floor(hlsInterstitial.endTime * 10) / 10:
  1426.           hlsInterstitial.endTime;
  1427.     }
  1428.     const restrict = hlsInterstitial.values.find((v) => v.key == 'X-RESTRICT');
  1429.     let isSkippable = true;
  1430.     let canJump = true;
  1431.     if (restrict && restrict.data) {
  1432.       const data = /** @type {string} */(restrict.data);
  1433.       isSkippable = !data.includes('SKIP');
  1434.       canJump = !data.includes('JUMP');
  1435.     }
  1436.     let skipOffset = isSkippable ? 0 : null;
  1437.     const enableSkipAfter =
  1438.         hlsInterstitial.values.find((v) => v.key == 'X-ENABLE-SKIP-AFTER');
  1439.     if (enableSkipAfter) {
  1440.       const enableSkipAfterString = /** @type {string} */(enableSkipAfter.data);
  1441.       skipOffset = parseFloat(enableSkipAfterString);
  1442.       if (isNaN(skipOffset)) {
  1443.         skipOffset = isSkippable ? 0 : null;
  1444.       }
  1445.     }
  1446.     let skipFor = null;
  1447.     const enableSkipFor =
  1448.         hlsInterstitial.values.find((v) => v.key == 'X-ENABLE-SKIP-FOR');
  1449.     if (enableSkipFor) {
  1450.       const enableSkipForString = /** @type {string} */(enableSkipFor.data);
  1451.       skipFor = parseFloat(enableSkipForString);
  1452.       if (isNaN(skipOffset)) {
  1453.         skipFor = null;
  1454.       }
  1455.     }
  1456.     let resumeOffset = null;
  1457.     const resume =
  1458.         hlsInterstitial.values.find((v) => v.key == 'X-RESUME-OFFSET');
  1459.     if (resume) {
  1460.       const resumeOffsetString = /** @type {string} */(resume.data);
  1461.       resumeOffset = parseFloat(resumeOffsetString);
  1462.       if (isNaN(resumeOffset)) {
  1463.         resumeOffset = null;
  1464.       }
  1465.     }
  1466.     let playoutLimit = null;
  1467.     const playout =
  1468.         hlsInterstitial.values.find((v) => v.key == 'X-PLAYOUT-LIMIT');
  1469.     if (playout) {
  1470.       const playoutLimitString = /** @type {string} */(playout.data);
  1471.       playoutLimit = parseFloat(playoutLimitString);
  1472.       if (isNaN(playoutLimit)) {
  1473.         playoutLimit = null;
  1474.       }
  1475.     }
  1476.     let once = false;
  1477.     let pre = false;
  1478.     let post = false;
  1479.     const cue = hlsInterstitial.values.find((v) => v.key == 'CUE');
  1480.     if (cue) {
  1481.       const data = /** @type {string} */(cue.data);
  1482.       once = data.includes('ONCE');
  1483.       pre = data.includes('PRE');
  1484.       post = data.includes('POST');
  1485.     }
  1486.     let timelineRange = false;
  1487.     const timelineOccupies =
  1488.         hlsInterstitial.values.find((v) => v.key == 'X-TIMELINE-OCCUPIES');
  1489.     if (timelineOccupies) {
  1490.       const data = /** @type {string} */(timelineOccupies.data);
  1491.       timelineRange = data.includes('RANGE');
  1492.     } else if (!resume && this.basePlayer_.isLive()) {
  1493.       timelineRange = !pre && !post;
  1494.     }
  1495.     if (assetUri) {
  1496.       const uri = /** @type {string} */(assetUri.data);
  1497.       if (!uri) {
  1498.         return interstitialsAd;
  1499.       }
  1500.       interstitialsAd.push({
  1501.         id,
  1502.         groupId: null,
  1503.         startTime,
  1504.         endTime,
  1505.         uri,
  1506.         mimeType: null,
  1507.         isSkippable,
  1508.         skipOffset,
  1509.         skipFor,
  1510.         canJump,
  1511.         resumeOffset,
  1512.         playoutLimit,
  1513.         once,
  1514.         pre,
  1515.         post,
  1516.         timelineRange,
  1517.         loop: false,
  1518.         overlay: null,
  1519.         displayOnBackground: false,
  1520.         currentVideo: null,
  1521.         background: null,
  1522.       });
  1523.     } else if (assetList) {
  1524.       const uri = /** @type {string} */(assetList.data);
  1525.       if (!uri) {
  1526.         return interstitialsAd;
  1527.       }
  1528.       try {
  1529.         const NetworkingEngine = shaka.net.NetworkingEngine;
  1530.         const context = {
  1531.           type: NetworkingEngine.AdvancedRequestType.INTERSTITIAL_ASSET_LIST,
  1532.         };
  1533.         const responseData = await this.makeAdRequest_(uri, context);
  1534.         const data = shaka.util.StringUtils.fromUTF8(responseData);
  1535.         const dataAsJson =
  1536.         /** @type {!shaka.ads.InterstitialAdManager.AssetsList} */ (
  1537.             JSON.parse(data));
  1538.         const skipControl = dataAsJson['SKIP-CONTROL'];
  1539.         if (skipControl) {
  1540.           const enableSkipAfterValue = skipControl['ENABLE-SKIP-AFTER'];
  1541.           if ((typeof enableSkipAfterValue) == 'number') {
  1542.             skipOffset = parseFloat(enableSkipAfterValue);
  1543.             if (isNaN(enableSkipAfterValue)) {
  1544.               skipOffset = isSkippable ? 0 : null;
  1545.             }
  1546.           }
  1547.           const enableSkipForValue = skipControl['ENABLE-SKIP-FOR'];
  1548.           if ((typeof enableSkipForValue) == 'number') {
  1549.             skipFor = parseFloat(enableSkipForValue);
  1550.             if (isNaN(enableSkipForValue)) {
  1551.               skipFor = null;
  1552.             }
  1553.           }
  1554.         }
  1555.         for (let i = 0; i < dataAsJson['ASSETS'].length; i++) {
  1556.           const asset = dataAsJson['ASSETS'][i];
  1557.           if (asset['URI']) {
  1558.             interstitialsAd.push({
  1559.               id: id + '_shaka_asset_' + i,
  1560.               groupId: id,
  1561.               startTime,
  1562.               endTime,
  1563.               uri: asset['URI'],
  1564.               mimeType: null,
  1565.               isSkippable,
  1566.               skipOffset,
  1567.               skipFor,
  1568.               canJump,
  1569.               resumeOffset,
  1570.               playoutLimit,
  1571.               once,
  1572.               pre,
  1573.               post,
  1574.               timelineRange,
  1575.               loop: false,
  1576.               overlay: null,
  1577.               displayOnBackground: false,
  1578.               currentVideo: null,
  1579.               background: null,
  1580.             });
  1581.           }
  1582.         }
  1583.       } catch (e) {
  1584.         // Ignore errors
  1585.       }
  1586.     }
  1587.     return interstitialsAd;
  1588.   }
  1591.   /**
  1592.    * @private
  1593.    */
  1594.   cuepointsChanged_() {
  1595.     /** @type {!Array<!shaka.extern.AdCuePoint>} */
  1596.     const cuePoints = [];
  1597.     for (const interstitial of this.interstitials_) {
  1598.       if (interstitial.overlay) {
  1599.         continue;
  1600.       }
  1601.       /** @type {shaka.extern.AdCuePoint} */
  1602.       const shakaCuePoint = {
  1603.         start: interstitial.startTime,
  1604.         end: null,
  1605.       };
  1606.       if (interstitial.pre) {
  1607.         shakaCuePoint.start = 0;
  1608.         shakaCuePoint.end = null;
  1609.       } else if (interstitial.post) {
  1610.         shakaCuePoint.start = -1;
  1611.         shakaCuePoint.end = null;
  1612.       } else if (interstitial.timelineRange) {
  1613.         shakaCuePoint.end = interstitial.endTime;
  1614.       }
  1615.       const isValid = !cuePoints.find((c) => {
  1616.         return shakaCuePoint.start == c.start && shakaCuePoint.end == c.end;
  1617.       });
  1618.       if (isValid) {
  1619.         cuePoints.push(shakaCuePoint);
  1620.       }
  1621.     }
  1623.     this.onEvent_(new shaka.util.FakeEvent(
  1624.         shaka.ads.Utils.CUEPOINTS_CHANGED,
  1625.         (new Map()).set('cuepoints', cuePoints)));
  1626.   }
  1629.   /**
  1630.    * @private
  1631.    */
  1632.   updatePlayerConfig_() {
  1633.     goog.asserts.assert(this.player_, 'Must have player');
  1634.     goog.asserts.assert(this.basePlayer_, 'Must have base player');
  1635.     this.player_.configure(this.basePlayer_.getNonDefaultConfiguration());
  1636.     this.player_.configure('ads.disableHLSInterstitial', true);
  1637.     this.player_.configure('ads.disableDASHInterstitial', true);
  1638.     this.player_.configure('playRangeEnd', Infinity);
  1639.     const netEngine = this.player_.getNetworkingEngine();
  1640.     goog.asserts.assert(netEngine, 'Need networking engine');
  1641.     this.basePlayer_.getNetworkingEngine().copyFiltersInto(netEngine);
  1642.   }
  1644.   /**
  1645.    * @param {string} url
  1646.    * @param {shaka.extern.RequestContext=} context
  1647.    * @return {!Promise<BufferSource>}
  1648.    * @private
  1649.    */
  1650.   async makeAdRequest_(url, context) {
  1651.     const type = shaka.net.NetworkingEngine.RequestType.ADS;
  1652.     const request = shaka.net.NetworkingEngine.makeRequest(
  1653.         [url],
  1654.         shaka.net.NetworkingEngine.defaultRetryParameters());
  1655.     const op = this.basePlayer_.getNetworkingEngine()
  1656.         .request(type, request, context);
  1657.     const response = await op.promise;
  1658.     return response.data;
  1659.   }
  1661.   /**
  1662.    * @param {!shaka.extern.AdInterstitial} interstitial
  1663.    * @return {boolean}
  1664.    * @private
  1665.    */
  1666.   isPreloadAllowed_(interstitial) {
  1667.     const interstitialMimeType = interstitial.mimeType;
  1668.     if (!interstitialMimeType) {
  1669.       return true;
  1670.     }
  1671.     return !interstitialMimeType.startsWith('image/') &&
  1672.         interstitialMimeType !== 'text/html';
  1673.   }
  1676.   /**
  1677.    * Only for testing
  1678.    *
  1679.    * @return {!Array<shaka.extern.AdInterstitial>}
  1680.    */
  1681.   getInterstitials() {
  1682.     return Array.from(this.interstitials_);
  1683.   }
  1686.   /**
  1687.    * @param {!shaka.extern.AdInterstitial} interstitial
  1688.    * @private
  1689.    */
  1690.   checkPreloadOnDomElements_(interstitial) {
  1691.     if (this.preloadOnDomElements_.has(interstitial) ||
  1692.         (this.config_ && !this.config_.allowPreloadOnDomElements)) {
  1693.       return;
  1694.     }
  1695.     const createAndAddLink = (url) => {
  1696.       const link = /** @type {HTMLLinkElement} */(
  1697.         document.createElement('link'));
  1698.       link.rel = 'preload';
  1699.       link.href = url;
  1700.       link.as = 'image';
  1701.       document.head.appendChild(link);
  1702.       return link;
  1703.     };
  1704.     const links = [];
  1705.     if (interstitial.background) {
  1706.       const urlRegExp = /url\(('|")?([^'"()]+)('|")\)?/;
  1707.       const match = interstitial.background.match(urlRegExp);
  1708.       if (match) {
  1709.         links.push(createAndAddLink(match[2]));
  1710.       }
  1711.     }
  1712.     if (interstitial.mimeType.startsWith('image/')) {
  1713.       links.push(createAndAddLink(interstitial.uri));
  1714.     }
  1715.     this.preloadOnDomElements_.set(interstitial, links);
  1716.   }
  1719.   /**
  1720.    * @param {!shaka.extern.AdInterstitial} interstitial
  1721.    * @private
  1722.    */
  1723.   removePreloadOnDomElements_(interstitial) {
  1724.     if (!this.preloadOnDomElements_.has(interstitial)) {
  1725.       return;
  1726.     }
  1727.     const links = this.preloadOnDomElements_.get(interstitial);
  1728.     for (const link of links) {
  1729.       link.parentNode.removeChild(link);
  1730.     }
  1731.     this.preloadOnDomElements_.delete(interstitial);
  1732.   }
  1733. };
  1736. /**
  1737.  * @typedef {{
  1738.  *   ASSETS: !Array<shaka.ads.InterstitialAdManager.Asset>,
  1739.  *   SKIP-CONTROL: ?shaka.ads.InterstitialAdManager.SkipControl
  1740.  * }}
  1741.  *
  1742.  * @property {!Array<shaka.ads.InterstitialAdManager.Asset>} ASSETS
  1743.  * @property {shaka.ads.InterstitialAdManager.SkipControl} SKIP-CONTROL
  1744.  */
  1745. shaka.ads.InterstitialAdManager.AssetsList;
  1748. /**
  1749.  * @typedef {{
  1750.  *   URI: string
  1751.  * }}
  1752.  *
  1753.  * @property {string} URI
  1754.  */
  1755. shaka.ads.InterstitialAdManager.Asset;
  1758. /**
  1759.  * @typedef {{
  1760.  *   ENABLE-SKIP-AFTER: number,
  1761.  *   ENABLE-SKIP-FOR: number
  1762.  * }}
  1763.  *
  1764.  * @property {number} ENABLE-SKIP-AFTER
  1765.  * @property {number} ENABLE-SKIP-FOR
  1766.  */
  1767. shaka.ads.InterstitialAdManager.SkipControl;