cloudinary-video-player 2.3.4-edge.5 → 2.3.4-edge.7

package/dist/cld-video-player.light.js

@@ -1413,7 +1413,7 @@ class CloudinaryAnalytics {
       this.cloudinaryAnalytics.startManualTracking(metadata, {
         ...(lodash_isPlainObject__WEBPACK_IMPORTED_MODULE_1___default()(this.analyticsOptions) ? this.analyticsOptions : {}),
         videoPlayerType: 'cloudinary video player',
-        videoPlayerVersion: "2.3.4-edge.5"
+        videoPlayerVersion: "2.3.4-edge.7"
       });
     } else if (this.currentVideMetadata.cloudName !== metadata.cloudName || this.currentVideMetadata.publicId !== metadata.publicId) {
       this.cloudinaryAnalytics.stopManualTracking();
@@ -1786,7 +1786,7 @@ class CloudinaryContext {
       options.sourceTypes = options.sourceTypes || _this.sourceTypes();
       options.poster = options.poster || posterOptionsForCurrent();
       options.queryParams = Object.assign(options.queryParams || {}, options.usageReport ? {
-        _s: `vp-${"2.3.4-edge.5"}`
+        _s: `vp-${"2.3.4-edge.7"}`
       } : {});
       if (options.sourceTypes.indexOf('audio') > -1) {
         builtSrc = new _models_audio_source_audio_source__WEBPACK_IMPORTED_MODULE_7__["default"](publicId, options);
@@ -3041,7 +3041,7 @@ const contextMenuContent = player => {
   const isFullscreen = player.isFullscreen();
   const aboutMenuItem = {
     class: 'player-version',
-    label: 'Cloudinary Player v' + "2.3.4-edge.5"
+    label: 'Cloudinary Player v' + "2.3.4-edge.7"
   };
   if (!player.controls()) {
     return [aboutMenuItem];
@@ -4959,6 +4959,7 @@ const getAnalyticsFromPlayerOptions = playerOptions => filterDefaultsAndNulls({
   width: playerOptions.width,
   withCredentials: playerOptions.withCredentials,
   debug: playerOptions.debug,
+  type: playerOptions.type,
   colors: playerOptions.colors && JSON.stringify(playerOptions.colors),
   controlBar: JSON.stringify(playerOptions.controlBar) !== JSON.stringify(config_defaults__WEBPACK_IMPORTED_MODULE_0__["default"].controlBar) && JSON.stringify(playerOptions.controlBar),
   ...getCloudinaryOptions(playerOptions.cloudinary),
@@ -5190,6 +5191,41 @@ function sliceAndUnsetProperties(obj) {
 }
 
 
+/***/ }),
+
+/***/ "./utils/video-retry.js":
+/*!******************************!*\
+  !*** ./utils/video-retry.js ***!
+  \******************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   checkIfVideoIsAvailable: () => (/* binding */ checkIfVideoIsAvailable),
+/* harmony export */   isVideoInReadyState: () => (/* binding */ isVideoInReadyState)
+/* harmony export */ });
+const checkIfVideoIsAvailable = function (videoUrl) {
+  let videoType = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'default';
+  return new Promise((resolve, reject) => {
+    const tempVideo = document.createElement('video');
+    tempVideo.setAttribute('crossorigin', 'anonymous');
+    const targetEvent = videoType === 'live' ? 'onprogress' : 'canplay';
+    tempVideo[targetEvent] = () => {
+      tempVideo.onerror = null;
+      tempVideo[targetEvent] = null;
+      resolve();
+    };
+    tempVideo.onerror = () => reject();
+    tempVideo.src = videoUrl;
+    tempVideo.load();
+  });
+};
+const isVideoInReadyState = readyState => {
+  return readyState >= (/iPad|iPhone|iPod/.test(navigator.userAgent) ? 1 : 4);
+};
+
+
 /***/ }),
 
 /***/ "./validators/validators-functions.js":
@@ -5308,7 +5344,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
 
 const CLOUDINARY_PARAMS = ['cloudinaryConfig', 'transformation', 'sourceTypes', 'sourceTransformation', 'posterOptions', 'autoShowRecommendations', 'fontFace', 'secure'];
-const PLAYER_PARAMS = CLOUDINARY_PARAMS.concat(['_internalAnalyticsMetadata', 'debug', 'publicId', 'source', 'autoplayMode', 'playedEventPercents', 'playedEventTimes', 'analytics', 'cloudinaryAnalytics', 'allowUsageReport', 'fluid', 'ima', 'playlistWidget', 'hideContextMenu', 'colors', 'floatingWhenNotVisible', 'ads', 'showJumpControls', 'chaptersButton', 'pictureInPictureToggle', 'textTracks', 'qualitySelector', 'fetchErrorUsingGet', 'withCredentials', 'seekThumbnails', 'aiHighlightsGraph', 'chapters', 'queryParams']);
+const PLAYER_PARAMS = CLOUDINARY_PARAMS.concat(['_internalAnalyticsMetadata', 'debug', 'publicId', 'source', 'autoplayMode', 'playedEventPercents', 'playedEventTimes', 'analytics', 'cloudinaryAnalytics', 'allowUsageReport', 'fluid', 'ima', 'playlistWidget', 'hideContextMenu', 'colors', 'floatingWhenNotVisible', 'ads', 'showJumpControls', 'chaptersButton', 'pictureInPictureToggle', 'textTracks', 'qualitySelector', 'fetchErrorUsingGet', 'withCredentials', 'seekThumbnails', 'aiHighlightsGraph', 'chapters', 'queryParams', 'type']);
 const CLOUDINARY_CONFIG_PARAM = ['cloud_name', 'secure', 'private_cdn', 'secure_distribution', 'cdn_subdomain', 'secure_cdn_subdomain', 'cname', 'shorten', 'sign_url', 'api_secret', 'url_suffix', 'use_root_path', 'auth_token'];
 const DEFAULT_HLS_OPTIONS = {
   html5: {
@@ -5354,7 +5390,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
 /* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! uuid */ "../node_modules/uuid/dist/esm-browser/v4.js");
+/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! uuid */ "../node_modules/uuid/dist/esm-browser/v4.js");
 /* harmony import */ var lodash_isEmpty__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/isEmpty */ "../node_modules/lodash/isEmpty.js");
 /* harmony import */ var lodash_isEmpty__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_isEmpty__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lodash/get */ "../node_modules/lodash/get.js");
@@ -5380,6 +5416,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./utils/consts */ "./utils/consts.js");
 /* harmony import */ var _utils_get_analytics_player_options__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./utils/get-analytics-player-options */ "./utils/get-analytics-player-options.js");
 /* harmony import */ var _plugins_cloudinary_common__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./plugins/cloudinary/common */ "./plugins/cloudinary/common.js");
+/* harmony import */ var _utils_video_retry__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./utils/video-retry */ "./utils/video-retry.js");
+
 
 
 
@@ -5406,6 +5444,7 @@ __webpack_require__.r(__webpack_exports__);
 // #endif
 
 const INTERNAL_ANALYTICS_URL = 'https://analytics-api-s.cloudinary.com';
+const RETRY_DEFAULT_TIMEOUT = 5 * 1000;
 
 // Register all plugins
 Object.keys(_plugins__WEBPACK_IMPORTED_MODULE_8__["default"]).forEach(key => {
@@ -5425,7 +5464,6 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
   }
   constructor(elem, initOptions, ready) {
     super();
-    this.nbCalls = 0;
     this.videoElement = (0,_video_player_utils__WEBPACK_IMPORTED_MODULE_14__.getResolveVideoElement)(elem);
     this.options = (0,_video_player_utils__WEBPACK_IMPORTED_MODULE_14__.extractOptions)(this.videoElement, initOptions);
     this._videojsOptions = this.options.videojsOptions;
@@ -5466,7 +5504,7 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
   }
   getVPInstanceId() {
     if (!this.vpInstanceId) {
-      this.vpInstanceId = (0,uuid__WEBPACK_IMPORTED_MODULE_20__["default"])();
+      this.vpInstanceId = (0,uuid__WEBPACK_IMPORTED_MODULE_21__["default"])();
     }
     return this.vpInstanceId;
   }
@@ -5481,7 +5519,7 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
       const analyticsData = (0,_utils_get_analytics_player_options__WEBPACK_IMPORTED_MODULE_18__.getAnalyticsFromPlayerOptions)(options);
       const analyticsParams = new URLSearchParams(analyticsData).toString();
       const baseParams = new URLSearchParams({
-        vpVersion: "2.3.4-edge.5",
+        vpVersion: "2.3.4-edge.7",
         vpInstanceId: this.getVPInstanceId(),
         // #if (process.env.WEBPACK_BUILD_LIGHT)
         vpLightBuild: true,
@@ -5494,8 +5532,9 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
       console.warn(err);
     }
   }
-  _clearTimeOut = () => {
-    this.videojs.clearTimeout(this.reTryId);
+  _resetReTryVideoState = () => {
+    this.reTryVideoStateRetriesCount = 0;
+    this.videojs.clearTimeout(this.reTryVideoStateTimeoutId);
   };
   _setVideoJsListeners(ready) {
     this.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.ERROR, () => {
@@ -5505,27 +5544,35 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
 
         /*
          error codes :
-           3 - media playback was aborted due to a corruption problem
-           4 - media error, media source not supported
+         3 - media playback was aborted due to a corruption problem
+         4 - media error, media source not supported
          */
         const isCorrupted = error.code === 3 && (video_js__WEBPACK_IMPORTED_MODULE_0___default().browser).IS_SAFARI;
         if ([isCorrupted, error.code === 4].includes(true) && [_utils_consts__WEBPACK_IMPORTED_MODULE_17__.SOURCE_TYPE.AUDIO, _utils_consts__WEBPACK_IMPORTED_MODULE_17__.SOURCE_TYPE.VIDEO].includes(type)) {
-          this.videojs.error(null);
-          _utils__WEBPACK_IMPORTED_MODULE_9__["default"].handleCldError(this, this.playerOptions);
+          if (this.isLiveStream) {
+            this.videojs.error({
+              code: _plugins_cloudinary_common__WEBPACK_IMPORTED_MODULE_19__.ERROR_CODE.CUSTOM,
+              message: 'Live Stream not started'
+            });
+            this.reloadVideoUntilAvailable();
+          } else {
+            this.videojs.error(null);
+            _utils__WEBPACK_IMPORTED_MODULE_9__["default"].handleCldError(this, this.playerOptions);
+          }
         } else {
-          this._clearTimeOut();
+          this._resetReTryVideoState();
         }
       }
     });
     this.videojs.tech_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.RETRY_PLAYLIST, () => {
       const mediaRequestsErrored = lodash_get__WEBPACK_IMPORTED_MODULE_2___default()(this.videojs, 'hls.stats.mediaRequestsErrored', 0);
       if (mediaRequestsErrored > 0) {
-        this._clearTimeOut();
+        this._resetReTryVideoState();
         _utils__WEBPACK_IMPORTED_MODULE_9__["default"].handleCldError(this, this.playerOptions);
       }
     });
-    this.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.PLAY, this._clearTimeOut);
-    this.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.CAN_PLAY_THROUGH, this._clearTimeOut);
+    this.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.PLAY, this._resetReTryVideoState);
+    this.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.CAN_PLAY_THROUGH, this._resetReTryVideoState);
     this.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_17__.PLAYER_EVENT.CLD_SOURCE_CHANGED, this._onSourceChange.bind(this));
     this.videojs.ready(() => {
       this._onReady();
@@ -5756,24 +5803,43 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
       this.videojs.cloudinaryAnalytics(options);
     }
   }
-  reTryVideo(maxNumberOfCalls, timeout) {
-    if (!this.isVideoReady()) {
-      if (this.nbCalls < maxNumberOfCalls) {
-        this.nbCalls++;
-        this.reTryId = this.videojs.setTimeout(() => this.reTryVideo(maxNumberOfCalls, timeout), timeout);
+  reTryVideoStateUntilAvailable() {
+    let maxNumberOfCalls = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Number.POSITIVE_INFINITY;
+    let timeout = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : RETRY_DEFAULT_TIMEOUT;
+    if (typeof this.reTryVideoStateRetriesCount !== 'number') {
+      this.reTryVideoStateRetriesCount = 0;
+    }
+    if (!(0,_utils_video_retry__WEBPACK_IMPORTED_MODULE_20__.isVideoInReadyState)(this.videojs.readyState())) {
+      if (this.reTryVideoStateRetriesCount < maxNumberOfCalls) {
+        this.reTryVideoStateRetriesCount++;
+        this.reTryVideoStateTimeoutId = this.videojs.setTimeout(() => this.reTryVideoStateUntilAvailable(maxNumberOfCalls, timeout), timeout);
       } else {
         let e = new Error('Video is not ready please try later');
         this.videojs.trigger('error', e);
       }
+    } else {
+      this.reTryVideoStateRetriesCount = 0;
     }
   }
-  isVideoReady() {
-    const s = this.videojs.readyState();
-    if (s >= (/iPad|iPhone|iPod/.test(navigator.userAgent) ? 1 : 4)) {
-      this.nbCalls = 0;
-      return true;
+  _resetReloadVideo = () => {
+    this.reloadVideoRetriesCount = 0;
+    this.videojs.clearTimeout(this.reloadVideoTimeoutId);
+  };
+  reloadVideoUntilAvailable() {
+    let maxNumberOfCalls = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Number.POSITIVE_INFINITY;
+    let timeout = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : RETRY_DEFAULT_TIMEOUT;
+    if (typeof this.reloadVideoRetriesCount !== 'number') {
+      this.reloadVideoRetriesCount = 0;
+    }
+    if (this.reloadVideoRetriesCount < maxNumberOfCalls) {
+      this.reloadVideoRetriesCount++;
+      this.reloadVideoTimeoutId = this.videojs.setTimeout(() => {
+        const videoUrl = this.currentSourceUrl();
+        (0,_utils_video_retry__WEBPACK_IMPORTED_MODULE_20__.checkIfVideoIsAvailable)(videoUrl, this.isLiveStream ? 'live' : 'default').then(() => this.source(videoUrl)).catch(() => this.reloadVideoUntilAvailable(maxNumberOfCalls, timeout));
+      }, timeout);
+    } else {
+      this.videojs.trigger('error', new Error('Sorry, we could not load your video'));
     }
-    return false;
   }
   _initAutoplay() {
     const autoplayMode = this.playerOptions.autoplayMode;
@@ -5809,6 +5875,7 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
   }
   _onSourceChange(e, _ref5) {
     let {
+      source,
       sourceOptions
     } = _ref5;
     this._sendInternalAnalytics({
@@ -5819,6 +5886,7 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
     // #if (!process.env.WEBPACK_BUILD_LIGHT)
     //     this._initQualitySelector();
     // #endif
+    this.isLiveStream = source.resourceConfig().type === 'live';
   }
   _setExtendedEvents() {
     const events = [];
@@ -5888,11 +5956,11 @@ class VideoPlayer extends _utils__WEBPACK_IMPORTED_MODULE_9__["default"].mixin(_
     if (this.playerOptions.withCredentials) {
       options.withCredentials = true;
     }
-    clearTimeout(this.reTryId);
-    this.nbCalls = 0;
+    this._resetReloadVideo();
+    this._resetReTryVideoState();
     const maxTries = this.videojs.options_.maxTries || 3;
     const videoReadyTimeout = this.videojs.options_.videoTimeout || 55000;
-    this.reTryVideo(maxTries, videoReadyTimeout);
+    this.reTryVideoStateUntilAvailable(maxTries, videoReadyTimeout);
     return this.videojs.cloudinary.source(publicId, options);
   }
   posterOptions(options) {