bugfix

package.json

@@ -68,6 +68,7 @@
     "tempy": "^0.6.0",
     "videojs-contrib-ads": "^6.9.0",
     "videojs-ima": "^1.11.0",
+    "videojs-ima-player": "^0.5.6",
     "videojs-logo": "^2.1.4"
   },
   "devDependencies": {

ui/analytics.js

@@ -240,7 +240,7 @@ const analytics: Analytics = {
       startWatchmanIntervalIfNotRunning();
     }
   },
-  videoStartEvent: (claimId, duration, poweredBy, passedUserId, canonicalUrl, passedPlayer) => {
+  videoStartEvent: (claimId, timeToStartVideo, poweredBy, passedUserId, canonicalUrl, passedPlayer) => {
     // populate values for watchman when video starts
     userId = passedUserId;
     claimUrl = canonicalUrl;
@@ -249,8 +249,8 @@ const analytics: Analytics = {
     videoType = passedPlayer.currentSource().type;
     videoPlayer = passedPlayer;
 
-    sendPromMetric('time_to_start', duration);
-    sendMatomoEvent('Media', 'TimeToStart', claimId, duration);
+    sendPromMetric('time_to_start', timeToStartVideo);
+    sendMatomoEvent('Media', 'TimeToStart', claimId, timeToStartVideo);
   },
   error: (message) => {
     return new Promise((resolve) => {

ui/component/app/view.jsx

@@ -325,21 +325,19 @@ function App(props: Props) {
     }
   }, [previousRewardApproved, isRewardApproved]);
 
-  // Load IMA3 SDK for aniview: DISABLED FOR NOW
+  // Load IMA3 SDK for aniview
   // @if TARGET='web'
-  // useEffect(() => {
-  //   if (ENABLE_PREROLL_ADS) {
-  //     const script = document.createElement('script');
-  //     script.src = `https://imasdk.googleapis.com/js/sdkloader/ima3.js`;
-  //     script.async = true;
-  //     // $FlowFixMe
-  //     document.body.appendChild(script);
-  //     return () => {
-  //       // $FlowFixMe
-  //       document.body.removeChild(script);
-  //     };
-  //   }
-  // });
+  useEffect(() => {
+      const script = document.createElement('script');
+      script.src = `https://imasdk.googleapis.com/js/sdkloader/ima3.js`;
+      script.async = true;
+      // $FlowFixMe
+      document.body.appendChild(script);
+      return () => {
+        // $FlowFixMe
+        document.body.removeChild(script);
+      };
+  });
   // @endif
 
   // @if TARGET='app'

ui/component/viewers/videoViewer/index.js

@@ -30,9 +30,11 @@ const select = (state, props) => {
   const urlParams = new URLSearchParams(search);
   const autoplay = urlParams.get('autoplay');
   const uri = props.uri;
+
   // TODO: eventually this should be received from DB and not local state (https://github.com/lbryio/lbry-desktop/issues/6796)
   const position = urlParams.get('t') !== null ? urlParams.get('t') : makeSelectContentPositionForUri(uri)(state);
   const userId = selectUser(state) && selectUser(state).id;
+  const internalFeature = selectUser(state) && selectUser(state).internal_feature;
   const playingUri = selectPlayingUri(state);
   const collectionId = urlParams.get(COLLECTIONS_CONSTS.COLLECTION_ID) || (playingUri && playingUri.collectionId);
   const isMarkdownOrComment = playingUri && (playingUri.source === 'markdown' || playingUri.source === 'comment');
@@ -50,6 +52,7 @@ const select = (state, props) => {
   return {
     position,
     userId,
+    internalFeature,
     collectionId,
     nextRecommendedUri,
     previousListUri,

ui/component/viewers/videoViewer/internal/plugins/videojs-aniview/plugin.js

@@ -26,13 +26,19 @@ const VERSION = '0.0.1';
 * */
 
 // 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=
+// const macroUrl = '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=';
+
+// live channel
+// b354389c7adb506d0bd9a4
+
+// ford ad
+// 612fb75a42715a07645a614c
 
 // Modified to work with IMA
 const macroUrl =
   `https://vast.aniview.com/api/adserver61/vast/` +
   `?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
-  `&AV_CHANNELID=60b354389c7adb506d0bd9a4` +
+  `&AV_CHANNELID=612fb75a42715a07645a614c` +
   `&AV_URL=[URL]` +
   `&cb=[CACHEBUSTING]` +
   `&AV_WIDTH=[WIDTH]` +
@@ -45,7 +51,7 @@ const macroUrl =
   `&skiptimer=5` +
   `&logo=true` +
   `&usevslot=true` +
-  `&vastretry=5` +
+  `&vastretry=2` +
   `&hidecontrols=false`;
 
 const defaults = {
@@ -63,37 +69,90 @@ class AniviewPlugin extends Component {
     // Plugin started
     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;
+    if (!this.ads) {
+      console.error("ima-player error: contrib-ads must be registered on player.")
+      return;
+    }
 
-    this.player = player;
+    console.log('this ads');
+
+    console.log(this.ads);
+
+    this.ads(); // initialize videojs-contrib-ads
 
     // request ads whenever there's new video content
-    /* player.on('contentchanged', () => {
-      // in a real plugin, you might fetch your ad inventory here
+    player.on('contentchanged', function() {
+      // in a real plugin, you might fetch new ad inventory here
       player.trigger('adsready');
-    }); */
-
-    // Plugin event listeners
-    // player.on('readyforpreroll', (event) => this.onReadyForPreroll(event));
-  }
-
-  /* onReadyForPreroll(event) {
-    // send event when ad is playing to remove loading spinner
-    this.player.one('adplaying', () => {
-      this.player.trigger('ads-ad-started');
     });
 
-    // resume content when all your linear ads have finished
-    this.player.one('adended', () => {
-      this.player.ads.endLinearAdMode();
-    });
-  } */
+    player.on('readyforpreroll', function() {
+      player.ads.startLinearAdMode();
+      // play your linear ad content
+      // in this example, we use a static mp4
+      player.src('kitteh.mp4');
 
-  log(...args) {
-    if (this.options_.debug) {
-      console.log(`Aniview Debug:`, JSON.stringify(args));
-    }
+      // send event when ad is playing to remove loading spinner
+      player.one('adplaying', function() {
+        player.trigger('ads-ad-started');
+      });
+
+      // resume content when all your linear ads have finished
+      player.one('adended', function() {
+
+        player.ads.endLinearAdMode();
+      });
+    });
+
+    // in a real plugin, you might fetch ad inventory here
+    player.trigger('adsready');
+
+    //   window.player.ads();
+    //
+    //   // To help with debugging, we'll add a global vjs object with the video js player
+    //   window.aniview = player;
+    //
+    //   this.player = player;
+    //
+    //   setTimeout(function(){
+    //
+    //   })
+    //
+    //   // request ads whenever there's new video content
+    //   window.player.on('contentchanged', () => {
+    //     console.log('CONTENT CHANGED');
+    //     // in a real plugin, you might fetch your ad inventory here
+    //     player.trigger('adsready');
+    //   });
+    //
+    //   // Plugin event listeners
+    //   window.player.on('readyforpreroll', (event) => this.onReadyForPreroll(event));
+    //
+    //   window.player.on('readyforpreroll', function(event){
+    //     console.log('ready for preroll');
+    //   })
+    // }
+    //
+    // onReadyForPreroll(event) {
+    //   // send event when ad is playing to remove loading spinner
+    //   window.player.on('adstart', () => {
+    //     console.log('ad playing');
+    //     this.player.trigger('ads-ad-started');
+    //   });
+    //
+    //   // resume content when all your linear ads have finished
+    //   window.player.on('adend', () => {
+    //     console.log('ad ended');
+    //     window.player.play()
+    //     this.player.ads.endLinearAdMode();
+    //   });
+    // }
+    //
+    // log(...args) {
+    //   if (this.options_.debug) {
+    //     console.log(`Aniview Debug:`, JSON.stringify(args));
+    //   }
+    // }
   }
 }
 

ui/component/viewers/videoViewer/internal/videojs.jsx

@@ -6,6 +6,8 @@ import * as ICONS from 'constants/icons';
 import * as KEYCODES from 'constants/keycodes';
 import classnames from 'classnames';
 import videojs from 'video.js';
+import 'videojs-contrib-ads';
+import 'videojs-ima';
 import 'video.js/dist/alt/video-js-cdn.min.css';
 import eventTracking from 'videojs-event-tracking';
 import * as OVERLAY from './overlays';
@@ -16,7 +18,7 @@ import qualityLevels from 'videojs-contrib-quality-levels';
 import isUserTyping from 'util/detect-typing';
 // @if TARGET='web'
 // Disabled for now.
-// import './plugins/videojs-aniview/plugin';
+import './plugins/videojs-aniview/plugin';
 // @endif
 const isDev = process.env.NODE_ENV !== 'production';
 
@@ -60,7 +62,8 @@ type Props = {
   adUrl: ?string,
   claimId: ?string,
   userId: ?number,
-  // allowPreRoll: ?boolean,
+  allowPreRoll: ?boolean,
+  internalFeatureEnabled: ?boolean,
   shareTelemetry: boolean,
   replay: boolean,
   videoTheaterMode: boolean,
@@ -77,6 +80,30 @@ type Props = {
 //   muted?: boolean,
 // };
 
+function hitsTwentyPercent() {
+  // from 0 - 999
+  var rand = Math.floor(Math.random() * (1000 + 1));
+
+  console.log(rand);
+  console.log('rand');
+
+  // setTimeout(function(){
+  //   console.log('play here');
+  //   player.play()
+  // }, 1000)
+
+  return true
+
+
+  if (rand > 799) {
+    return true;
+  } else {
+    return false;
+  }
+
+
+}
+
 const videoPlaybackRates = [0.25, 0.5, 0.75, 1, 1.1, 1.25, 1.5, 1.75, 2];
 
 const IS_IOS =
@@ -178,7 +205,8 @@ export default React.memo<Props>(function VideoJs(props: Props) {
     adUrl,
     claimId,
     userId,
-    // allowPreRoll,
+    allowPreRoll,
+    internalFeatureEnabled,
     shareTelemetry,
     replay,
     videoTheaterMode,
@@ -539,6 +567,46 @@ export default React.memo<Props>(function VideoJs(props: Props) {
       // this seems like a weird thing to have to check for here
       if (!player) return;
 
+      // Modified to work with IMA
+      const macroUrl =
+        `https://vast.aniview.com/api/adserver61/vast/` +
+        `?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
+        `&AV_CHANNELID=612fb75a42715a07645a614c` +
+        `&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=2` +
+        `&hidecontrols=false`;
+
+      // always have ads on if internal feature is on,
+      // otherwise if not authed, roll for 20% to see an ad
+      const shouldShowAnAd = internalFeatureEnabled || (allowPreRoll && hitsTwentyPercent());
+
+      console.log('BROWSER');
+      console.log(videojs.browser);
+
+      const browserIsChrome = videojs.browser.IS_CHROME;
+      console.log(browserIsChrome)
+
+      if (shouldShowAnAd && browserIsChrome) {
+        player.ima({adTagUrl: macroUrl});
+      }
+
+      player.on('loadstart', function(event){
+        console.log('RUNNING HERE!');
+        player.play();
+      })
+
+
       // Add various event listeners to player
       player.one('play', onInitialPlay);
       player.on('play', resolveCtrlText);
@@ -579,6 +647,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
 
       // I think this is a callback function
       const videoNode = containerRef.current && containerRef.current.querySelector('video, audio');
+
       onPlayerReady(player, videoNode);
     });
 

ui/component/viewers/videoViewer/view.jsx

@@ -55,6 +55,7 @@ type Props = {
   setVideoPlaybackRate: (number) => void,
   authenticated: boolean,
   userId: number,
+  internalFeature: boolean,
   homepageData?: { [string]: HomepageCat },
   shareTelemetry: boolean,
   isFloating: boolean,
@@ -98,6 +99,7 @@ function VideoViewer(props: Props) {
     homepageData,
     authenticated,
     userId,
+    internalFeature,
     shareTelemetry,
     isFloating,
     doPlayUri,
@@ -152,6 +154,7 @@ function VideoViewer(props: Props) {
     };
   }, [embedded, videoPlaybackRate]);
 
+  // TODO: analytics functionality
   function doTrackingBuffered(e: Event, data: any) {
     fetch(source, { method: 'HEAD', cache: 'no-store' }).then((response) => {
       data.playerPoweredBy = response.headers.get('x-powered-by');
@@ -159,21 +162,37 @@ function VideoViewer(props: Props) {
     });
   }
 
+  /**
+   * Analytics functionality that is run on first video start
+   * @param e - event from videojs (from the plugin?)
+   * @param data - only has secondsToLoad property
+   */
   function doTrackingFirstPlay(e: Event, data: any) {
-    let timeToStart = data.secondsToLoad;
+    // how long until the video starts
+    let timeToStartVideo = data.secondsToLoad;
 
-    if (desktopPlayStartTime !== undefined) {
-      const differenceToAdd = Date.now() - desktopPlayStartTime;
-      timeToStart += differenceToAdd;
+    // TODO: what's happening here briefly?
+    if (!IS_WEB) {
+      if (desktopPlayStartTime !== undefined) {
+        const differenceToAdd = Date.now() - desktopPlayStartTime;
+        timeToStartVideo += differenceToAdd;
+      }
     }
+
+    // send matomo event (embedded is boolean)
     analytics.playerStartedEvent(embedded);
 
+    // figure out what server the video is served from and then run start analytic event
     fetch(source, { method: 'HEAD', cache: 'no-store' }).then((response) => {
+      // server string such as 'eu-p6'
       let playerPoweredBy = response.headers.get('x-powered-by') || '';
-      analytics.videoStartEvent(claimId, timeToStart, playerPoweredBy, userId, claim.canonical_url, this);
+
+      // populates data for watchman, sends prom and matomo event
+      analytics.videoStartEvent(claimId, timeToStartVideo, playerPoweredBy, userId, claim.canonical_url, this);
     });
 
-    doAnalyticsView(uri, timeToStart).then(() => {
+    // hit backend to mark a view
+    doAnalyticsView(uri, timeToStartVideo).then(() => {
       claimRewards();
     });
   }
@@ -256,6 +275,7 @@ function VideoViewer(props: Props) {
     clearPosition(uri);
   }, [adUrl, autoplayNext, clearPosition, collectionId, embedded, ended, setAdUrl, uri]);
 
+  // MORE ON PLAY STUFF
   function onPlay(player) {
     setEnded(false);
     setIsLoading(false);
@@ -436,29 +456,28 @@ function VideoViewer(props: Props) {
         </>
       )}
 
-      {!isFetchingAd && (
-        <VideoJs
-          adUrl={adUrl}
-          source={adUrl || source}
-          sourceType={forcePlayer || adUrl ? 'video/mp4' : contentType}
-          isAudio={isAudio}
-          poster={isAudio || (embedded && !autoplayIfEmbedded) ? thumbnail : ''}
-          onPlayerReady={onPlayerReady}
-          startMuted={autoplayIfEmbedded}
-          toggleVideoTheaterMode={toggleVideoTheaterMode}
-          autoplay={!embedded || autoplayIfEmbedded}
-          autoplaySetting={autoplayNext}
-          claimId={claimId}
-          userId={userId}
-          allowPreRoll={!embedded && !authenticated}
-          shareTelemetry={shareTelemetry}
-          replay={replay}
-          videoTheaterMode={videoTheaterMode}
-          playNext={doPlayNext}
-          playPrevious={doPlayPrevious}
-          embedded={embedded}
-        />
-      )}
+      <VideoJs
+        adUrl={adUrl}
+        source={adUrl || source}
+        sourceType={forcePlayer || adUrl ? 'video/mp4' : contentType}
+        isAudio={isAudio}
+        poster={isAudio || (embedded && !autoplayIfEmbedded) ? thumbnail : ''}
+        onPlayerReady={onPlayerReady}
+        startMuted={autoplayIfEmbedded}
+        toggleVideoTheaterMode={toggleVideoTheaterMode}
+        autoplay={!embedded || autoplayIfEmbedded}
+        autoplaySetting={autoplayNext}
+        claimId={claimId}
+        userId={userId}
+        allowPreRoll={!authenticated} // used to not include embeds, removed for now
+        internalFeatureEnabled={internalFeature}
+        shareTelemetry={shareTelemetry}
+        replay={replay}
+        videoTheaterMode={videoTheaterMode}
+        playNext={doPlayNext}
+        playPrevious={doPlayPrevious}
+        embedded={embedded}
+      />
     </div>
   );
 }

yarn.lock

@@ -1820,6 +1820,20 @@
   resolved "https://registry.yarnpkg.com/@ungap/from-entries/-/from-entries-0.2.1.tgz#7e86196b8b2e99d73106a8f25c2a068326346354"
   integrity sha512-CAqefTFAfnUPwYqsWHXpOxHaq1Zo5UQ3m9Zm2p09LggGe57rqHoBn3c++xcoomzXKynAUuiBMDUCQvKMnXjUpA==
 
+"@videojs/http-streaming@2.10.2":
+  version "2.10.2"
+  resolved "https://registry.yarnpkg.com/@videojs/http-streaming/-/http-streaming-2.10.2.tgz#02e6fcfa74f7850b5f9eb40a8e5c85c9d7d33eaf"
+  integrity sha512-JTAlAUHzj0sTsge2WBh4DWKM2I5BDFEZYOvzxmsK/ySILmI0GRyjAHx9uid68ZECQ2qbEAIRmZW5lWp0R5PeNA==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    "@videojs/vhs-utils" "3.0.3"
+    aes-decrypter "3.1.2"
+    global "^4.4.0"
+    m3u8-parser "4.7.0"
+    mpd-parser "0.19.0"
+    mux.js "5.13.0"
+    video.js "^6 || ^7"
+
 "@videojs/http-streaming@2.2.4":
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/@videojs/http-streaming/-/http-streaming-2.2.4.tgz#c71bb63dbc4749e35193c4c334430bd8ce728ec0"
@@ -1848,6 +1862,15 @@
     mux.js "5.11.1"
     video.js "^6 || ^7"
 
+"@videojs/vhs-utils@3.0.3":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@videojs/vhs-utils/-/vhs-utils-3.0.3.tgz#708bc50742e9481712039695299b32da6582ef92"
+  integrity sha512-bU7daxDHhzcTDbmty1cXjzsTYvx2cBGbA8hG5H2Gvpuk4sdfuvkZtMCwtCqL59p6dsleMPspyaNS+7tWXx2Y0A==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    global "^4.4.0"
+    url-toolkit "^2.2.1"
+
 "@videojs/vhs-utils@^2.2.1":
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/@videojs/vhs-utils/-/vhs-utils-2.3.0.tgz#490a3a00dfc1b51d85d5dcf8f8361e2d4c4d1440"
@@ -1866,6 +1889,15 @@
     global "^4.4.0"
     url-toolkit "^2.2.1"
 
+"@videojs/vhs-utils@^3.0.3":
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/@videojs/vhs-utils/-/vhs-utils-3.0.4.tgz#e253eecd8e9318f767e752010d213587f94bb03a"
+  integrity sha512-hui4zOj2I1kLzDgf8QDVxD3IzrwjS/43KiS8IHQO0OeeSsb4pB/lgNt1NG7Dv0wMQfCccUpMVLGcK618s890Yg==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    global "^4.4.0"
+    url-toolkit "^2.2.1"
+
 "@videojs/xhr@2.5.1":
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/@videojs/xhr/-/xhr-2.5.1.tgz#26bc5a79dbb3b03bfb13742c6ce559f89e90719e"
@@ -1875,6 +1907,15 @@
     global "~4.4.0"
     is-function "^1.0.1"
 
+"@videojs/xhr@2.6.0":
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/@videojs/xhr/-/xhr-2.6.0.tgz#cd897e0ad54faf497961bcce3fa16dc15a26bb80"
+  integrity sha512-7J361GiN1tXpm+gd0xz2QWr3xNWBE+rytvo8J3KuggFaLg+U37gZQ2BuPLcnkfGffy2e+ozY70RHC8jt7zjA6Q==
+  dependencies:
+    "@babel/runtime" "^7.5.5"
+    global "~4.4.0"
+    is-function "^1.0.1"
+
 "@webassemblyjs/ast@1.8.5":
   version "1.8.5"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.5.tgz#51b1c5fe6576a34953bf4b253df9f0d490d9e359"
@@ -2008,6 +2049,11 @@
   resolved "https://registry.yarnpkg.com/@wojtekmaj/date-utils/-/date-utils-1.0.3.tgz#2dcfd92881425c5923e429c2aec86fb3609032a1"
   integrity sha512-1VPkkTBk07gMR1fjpBtse4G+oJqpmE+0gUFB0dg3VIL7qJmUVaBoD/vlzMm/jNeOPfvlmerl1lpnsZyBUFIRuw==
 
+"@xmldom/xmldom@^0.7.2":
+  version "0.7.5"
+  resolved "https://registry.yarnpkg.com/@xmldom/xmldom/-/xmldom-0.7.5.tgz#09fa51e356d07d0be200642b0e4f91d8e6dd408d"
+  integrity sha512-V3BIhmY36fXZ1OtVcI9W+FxQqxVLsPKcNjWigIaa81dLC9IolJl5Mt4Cvhmr0flUnjSpTdrbMTSbXqYqV5dT6A==
+
 "@xtuc/ieee754@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@xtuc/ieee754/-/ieee754-1.2.0.tgz#eef014a3145ae477a1cbc00cd1e552336dceb790"
@@ -11154,6 +11200,16 @@ mpd-parser@0.17.0:
     global "^4.4.0"
     xmldom "^0.5.0"
 
+mpd-parser@0.19.0:
+  version "0.19.0"
+  resolved "https://registry.yarnpkg.com/mpd-parser/-/mpd-parser-0.19.0.tgz#8937044040ca85e20398ecf5d94552655e2c6728"
+  integrity sha512-FDLIXtZMZs99fv5iXNFg94quNFT26tobo0NUgHu7L3XgZvEq1NBarf5yxDFFJ1zzfbcmtj+NRaml6nYIxoPWvw==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    "@videojs/vhs-utils" "^3.0.2"
+    "@xmldom/xmldom" "^0.7.2"
+    global "^4.4.0"
+
 ms@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
@@ -11194,6 +11250,13 @@ mux.js@5.11.1:
   dependencies:
     "@babel/runtime" "^7.11.2"
 
+mux.js@5.13.0:
+  version "5.13.0"
+  resolved "https://registry.yarnpkg.com/mux.js/-/mux.js-5.13.0.tgz#99c3da21f6c0362a1529729d1c5e5b51f34f606d"
+  integrity sha512-PkmnzHcTQjUBEHp3KRPQAFoNkJtKlpCEvsYtXDfDrC+/WqbMuxHvoYfmAbHVAH7Sa/KliPVU0dT1ureO8wilog==
+  dependencies:
+    "@babel/runtime" "^7.11.2"
+
 mux.js@5.6.7:
   version "5.6.7"
   resolved "https://registry.yarnpkg.com/mux.js/-/mux.js-5.6.7.tgz#d39fc85cded5a1257de9f6eeb5cf1578c4a63eb8"
@@ -16566,6 +16629,25 @@ vfile@^2.0.0:
     videojs-font "3.2.0"
     videojs-vtt.js "^0.15.3"
 
+"video.js@^6.0.1 || ^7":
+  version "7.15.4"
+  resolved "https://registry.yarnpkg.com/video.js/-/video.js-7.15.4.tgz#0f96ef138035138cb30bf00a989b6174f0d16bac"
+  integrity sha512-hghxkgptLUvfkpktB4wxcIVF3VpY/hVsMkrjHSv0jpj1bW9Jplzdt8IgpTm9YhlB1KYAp07syVQeZcBFUBwhkw==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    "@videojs/http-streaming" "2.10.2"
+    "@videojs/vhs-utils" "^3.0.3"
+    "@videojs/xhr" "2.6.0"
+    aes-decrypter "3.1.2"
+    global "^4.4.0"
+    keycode "^2.2.0"
+    m3u8-parser "4.7.0"
+    mpd-parser "0.19.0"
+    mux.js "5.13.0"
+    safe-json-parse "4.0.0"
+    videojs-font "3.2.0"
+    videojs-vtt.js "^0.15.3"
+
 video.js@^7.0.0:
   version "7.10.2"
   resolved "https://registry.yarnpkg.com/video.js/-/video.js-7.10.2.tgz#5156aabad7820e726d72ea6c32324059c68885a4"
@@ -16580,7 +16662,7 @@ video.js@^7.0.0:
     videojs-font "3.2.0"
     videojs-vtt.js "^0.15.2"
 
-videojs-contrib-ads@^6.6.5, videojs-contrib-ads@^6.9.0:
+videojs-contrib-ads@^6.6.5, videojs-contrib-ads@^6.7.0, videojs-contrib-ads@^6.9.0:
   version "6.9.0"
   resolved "https://registry.yarnpkg.com/videojs-contrib-ads/-/videojs-contrib-ads-6.9.0.tgz#c792d6fda77254b277545cc3222352fc653b5833"
   integrity sha512-nzKz+jhCGMTYffSNVYrmp9p70s05v6jUMOY3Z7DpVk3iFrWK4Zi/BIkokDWrMoHpKjdmCdKzfJVBT+CrUj6Spw==
@@ -16608,6 +16690,14 @@ videojs-font@3.2.0:
   resolved "https://registry.yarnpkg.com/videojs-font/-/videojs-font-3.2.0.tgz#212c9d3f4e4ec3fa7345167d64316add35e92232"
   integrity sha512-g8vHMKK2/JGorSfqAZQUmYYNnXmfec4MLhwtEFS+mMs2IDY398GLysy6BH6K+aS1KMNu/xWZ8Sue/X/mdQPliA==
 
+videojs-ima-player@^0.5.6:
+  version "0.5.6"
+  resolved "https://registry.yarnpkg.com/videojs-ima-player/-/videojs-ima-player-0.5.6.tgz#73f5aaaa7111ebffa7cb4eef84b2c6e62421368f"
+  integrity sha512-3QlzKqExLc30MMB4cRVbYluZGDPbxJ32HQ8nD+cGLM+e/oMwrb/rDyfMm1+fXKMhWKvV+pjiYtwx28hdciLTng==
+  dependencies:
+    video.js "^6.0.1 || ^7"
+    videojs-contrib-ads "^6.7.0"
+
 videojs-ima@^1.11.0:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/videojs-ima/-/videojs-ima-1.11.0.tgz#26ad385e388c3da72372298d7d755b001d05a91d"