byteark-player-react - npm Package Compare versions

Comparing version 2.0.0 to 2.0.1

dist/index.js

@@ -6,18 +6,28 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
 function _inheritsLoose(subClass, superClass) {
   subClass.prototype = Object.create(superClass.prototype);
   subClass.prototype.constructor = subClass;
-
   _setPrototypeOf(subClass, superClass);
 }
-
 function _setPrototypeOf(o, p) {
-  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
     o.__proto__ = p;
     return o;
   };
-
   return _setPrototypeOf(o, p);
 }
-
 function _assertThisInitialized(self) {
@@ -27,3 +37,2 @@ if (self === void 0) {
   }
-
   return self;
@@ -69,3 +78,2 @@ }
   var support = {};
-
   var testSystem = function testSystem(keySystem) {
@@ -78,3 +86,2 @@ return navigator.requestMediaKeySystemAccess(keySystem, configs).then(function () {
   };
-
   var tests = testKeySystems.map(function (keySystem) {
@@ -86,7 +93,5 @@ return testSystem(keySystem);
     var isSupportFairPlay = support['com.apple.fps.3_0'] === true || support['com.apple.fps.2_0'] === true || support['com.apple.fps.1_0'] === true || support['com.apple.fps'] === true;
-
     if (!isSupportWidevine && !isSupportFairPlay) {
       return Promise.reject(new Error('Browser does not support DRM'));
     }
-
     return {
@@ -142,10 +147,7 @@ widevine: isSupportWidevine,
   }
-
   var _aspectRatio$split = aspectRatio.split(':'),
-      hStr = _aspectRatio$split[0],
-      vStr = _aspectRatio$split[1];
-
+    hStr = _aspectRatio$split[0],
+    vStr = _aspectRatio$split[1];
   return Number.parseFloat(vStr) / Number.parseFloat(hStr) * 100;
 }
-
 function PlayerPlaceholder(props) {
@@ -177,7 +179,5 @@ var options = props.playerOptions;
   };
-
   if (options.fluid) {
     placeholderCustomStyle.paddingTop = calculatePlaceholderPaddingTopFromAspectRatio(props.aspectRatio || '16:9') + "%";
   }
-
   if (!options.fluid && options.fill) {
@@ -187,11 +187,8 @@ placeholderCustomStyle.height = '100%';
   }
-
   if (options.lazyload && !props.loaded) {
     placeholderCustomStyle.position = 'relative';
   }
-
   if (options.lazyload && props.loaded) {
     placeholderCustomStyle.position = 'absolute';
   }
-
   var shouldShowPlayIcon = options.controls === undefined || options.controls === null || options.controls === true;
@@ -219,6 +216,4 @@ return /*#__PURE__*/React.createElement("div", {
   }
-
   return null;
 }
-
 function createScriptTag(id, src) {
@@ -242,3 +237,2 @@ return new Promise(function (resolve, reject) {
 }
-
 function createLinkStyleTag(id, src) {
@@ -264,3 +258,2 @@ return new Promise(function (resolve, reject) {
 }
-
 var loadScriptOrStyle = function loadScriptOrStyle(id, src, type) {
@@ -271,18 +264,12 @@ try {
     }
-
     var existingElement = document.getElementById(id);
-
     if (existingElement) {
       return Promise.resolve(waitForTagLoad(existingElement));
     }
-
     var resolvedType = type || tryResolveSrcType(src);
-
     switch (resolvedType) {
       case 'script':
         return Promise.resolve(createScriptTag(id, src));
-
       case 'style':
         return Promise.resolve(createLinkStyleTag(id, src));
-
       default:
@@ -295,3 +282,2 @@ throw new Error('Not supported resource type');
 };
-
 var waitForTagLoad = function waitForTagLoad(tag) {
@@ -303,3 +289,2 @@ try {
       }
-
       tag.addEventListener('load', function () {
@@ -360,5 +345,4 @@ return resolve();
     var name = _ref.name,
-        setter = _ref.setter;
+      setter = _ref.setter;
     var effectiveSetter = setter || name;
-
     if (!isEqual(nextProps[name], prevProps[name])) {
@@ -380,3 +364,2 @@ player[effectiveSetter](nextProps[name]);
 }
-
 function defaultCreatePlayerFunction(videoNode, options, onReady) {
@@ -386,6 +369,4 @@ if (bytearkPlayer.initAsync) {
   }
-
   return bytearkPlayer.init(videoNode, options, onReady);
 }
-
 var defaultSetupPlayerFunction = function defaultSetupPlayerFunction(options, loaderFunction, loadPluginOptions) {
@@ -398,11 +379,7 @@ try {
 };
-
 var ByteArkPlayerContainer = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(ByteArkPlayerContainer, _React$Component);
-
   function ByteArkPlayerContainer(props) {
     var _this;
-
     _this = _React$Component.call(this, props) || this;
-
     _this.onPlayerLoaded = function () {
@@ -417,3 +394,2 @@ if (_this.props.onPlayerLoaded) {
     };
-
     _this.onPlayerLoadError = function (error, originalError) {
@@ -423,3 +399,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerLoadError) {
@@ -433,3 +408,2 @@ try {
     };
-
     _this.onPlayerSetup = function () {
@@ -439,3 +413,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerSetup) {
@@ -445,3 +418,2 @@ _this.props.onPlayerSetup();
     };
-
     _this.onPlayerSetupError = function (error, originalError) {
@@ -451,3 +423,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerSetupError) {
@@ -461,3 +432,2 @@ try {
     };
-
     _this.onPlayerCreated = function () {
@@ -467,3 +437,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerCreated) {
@@ -473,3 +442,2 @@ _this.props.onPlayerCreated(_this.player);
     };
-
     _this.onReady = function () {
@@ -479,3 +447,2 @@ _this.setState({
       });
-
       if (_this.props.onReady) {
@@ -485,10 +452,8 @@ _this.props.onReady(_this.player);
     };
-
-    _this.createPlayerInstance = function () {
+    _this.createPlayerInstance = function (resultOptions) {
       try {
         window.bytearkPlayer.isBrowserSupportDrm = isBrowserSupportDrm;
         var createPlayerFunction = _this.props.createPlayerFunction || defaultCreatePlayerFunction;
-        return Promise.resolve(createPlayerFunction(_this.videoNode, _this.props, _this.onReady)).then(function (_createPlayerFunction) {
+        return Promise.resolve(createPlayerFunction(_this.videoNode, resultOptions, _this.onReady)).then(function (_createPlayerFunction) {
           _this.player = _createPlayerFunction;
-
           _this.onPlayerCreated();
@@ -500,7 +465,5 @@ });
     };
-
     _this.onVideoNodeCreated = function (node) {
       _this.videoNode = node;
     };
-
     _this.player = null;
@@ -517,21 +480,15 @@ _this.state = {
   }
-
   var _proto = ByteArkPlayerContainer.prototype;
-
   _proto.player = function player() {
     return this.player;
   };
-
   _proto.loaded = function loaded() {
     return this.state.loaded;
   };
-
   _proto.ready = function ready() {
     return this.state.ready;
   };
-
   _proto.error = function error() {
     return this.state.error;
   };
-
   _proto.componentDidMount = function componentDidMount() {
@@ -542,23 +499,20 @@ if (!this.props.lazyload) {
   };
-
   _proto.initializePlayer = function initializePlayer() {
     try {
-      var _this3 = this;
-
-      var isClient = _this3.canUserDOM();
-
+      var _this2 = this;
+      var isClient = _this2.canUserDOM();
       if (!isClient) {
         return Promise.resolve();
       }
-
-      if (_this3.initializeInProgress) {
+      if (_this2.initializeInProgress) {
         return Promise.resolve();
       }
-
-      _this3.initializeInProgress = true;
+      _this2.initializeInProgress = true;
       return Promise.resolve(_catch(function () {
-        return Promise.resolve(_this3.loadPlayerResources()).then(function () {
-          return Promise.resolve(_this3.setupPlayer()).then(function () {
-            return Promise.resolve(_this3.createPlayerInstance()).then(function () {
-              _this3.initializeInProgress = false;
+        return Promise.resolve(_this2.loadPlayerResources()).then(function () {
+          return Promise.resolve(_this2.setupOptions()).then(function (resultOptions) {
+            return Promise.resolve(_this2.setupPlayer(resultOptions)).then(function () {
+              return Promise.resolve(_this2.createPlayerInstance(resultOptions)).then(function () {
+                _this2.initializeInProgress = false;
+              });
             });
@@ -568,3 +522,3 @@ });
       }, function (err) {
-        _this3.initializeInProgress = false;
+        _this2.initializeInProgress = false;
         throw err;
@@ -576,39 +530,30 @@ }));
   };
-
   _proto.loadPlayerResources = function loadPlayerResources() {
     try {
-      var _temp3 = function _temp3(_result2) {
-        if (_exit2) return _result2;
-
-        _this5.onPlayerLoaded();
+      var _temp2 = function _temp2(_result2) {
+        if (_exit) return _result2;
+        _this3.onPlayerLoaded();
       };
-
-      var _exit2 = false;
-
-      var _this5 = this;
-
-      var _temp4 = _catch(function () {
+      var _exit = false;
+      var _this3 = this;
+      var _temp = _catch(function () {
         var promises = [];
-
-        if (_this5.props.playerSlugId) {
-          if (_this5.props.playerJsFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-script-" + _this5.props.playerSlugId, _this5.props.playerServerEndpoint + "/" + _this5.props.playerSlugId + "/libraries/" + _this5.props.playerJsFileName, 'script'));
+        if (_this3.props.playerSlugId) {
+          if (_this3.props.playerJsFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-script-" + _this3.props.playerSlugId, _this3.props.playerServerEndpoint + "/" + _this3.props.playerSlugId + "/libraries/" + _this3.props.playerJsFileName, 'script'));
           }
-
-          if (_this5.props.playerCssFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-style-" + _this5.props.playerSlugId, _this5.props.playerServerEndpoint + "/" + _this5.props.playerSlugId + "/libraries/" + _this5.props.playerCssFileName, 'style'));
+          if (_this3.props.playerCssFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-style-" + _this3.props.playerSlugId, _this3.props.playerServerEndpoint + "/" + _this3.props.playerSlugId + "/libraries/" + _this3.props.playerCssFileName, 'style'));
           }
         } else {
-          if (_this5.props.playerJsFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-script-" + _this5.props.playerVersion, _this5.props.playerEndpoint + "/" + _this5.props.playerVersion + "/" + _this5.props.playerJsFileName, 'script'));
+          if (_this3.props.playerJsFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-script-" + _this3.props.playerVersion, _this3.props.playerEndpoint + "/" + _this3.props.playerVersion + "/" + _this3.props.playerJsFileName, 'script'));
           }
-
-          if (_this5.props.playerCssFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-style-" + _this5.props.playerVersion, _this5.props.playerEndpoint + "/" + _this5.props.playerVersion + "/" + _this5.props.playerCssFileName, 'style'));
+          if (_this3.props.playerCssFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-style-" + _this3.props.playerVersion, _this3.props.playerEndpoint + "/" + _this3.props.playerVersion + "/" + _this3.props.playerCssFileName, 'style'));
           }
         }
-
         return Promise.resolve(Promise.all(promises)).then(function () {});
       }, function (originalError) {
-        _this5.onPlayerLoadError({
+        _this3.onPlayerLoadError({
           code: 'ERROR_BYTEARK_PLAYER_REACT_100001',
@@ -618,7 +563,5 @@ message: 'Sorry, something wrong when loading the video player.',
         }, originalError);
-
         throw originalError;
       });
-
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+      return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
     } catch (e) {
@@ -628,18 +571,37 @@ return Promise.reject(e);
   };
-
-  _proto.setupPlayer = function setupPlayer() {
+  _proto.setupOptions = function setupOptions() {
     try {
-      var _this7 = this;
-
-      if (_this7.setupPlayerPromise) {
-        return Promise.resolve(_this7.setupPlayerPromise);
+      var _this4 = this;
+      return Promise.resolve(_catch(function () {
+        return Promise.resolve(window.bytearkPlayer.canAutoplay(_this4.props)).then(function (autoplayResult) {
+          var resultPlayerOptions = _extends({}, _this4.props, {
+            autoplayResult_: autoplayResult
+          });
+          return resultPlayerOptions;
+        });
+      }, function (originalError) {
+        _this4.onPlayerSetupError({
+          code: 'ERROR_BYTEARK_PLAYER_REACT_100001',
+          message: 'Sorry, something wrong when loading the video player.',
+          messageSecondary: 'Please refresh the page to try again.'
+        }, originalError);
+        throw originalError;
+      }));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  _proto.setupPlayer = function setupPlayer(resultOptions) {
+    try {
+      var _this5 = this;
+      if (_this5.setupPlayerPromise) {
+        return Promise.resolve(_this5.setupPlayerPromise);
       }
-
       return Promise.resolve(_catch(function () {
-        var setupPlayerFunction = _this7.props.setupPlayerFunction || defaultSetupPlayerFunction;
-        return Promise.resolve(setupPlayerFunction(_this7.props, loadScriptOrStyle)).then(function () {
-          _this7.onPlayerSetup();
+        var setupPlayerFunction = _this5.props.setupPlayerFunction || defaultSetupPlayerFunction;
+        return Promise.resolve(setupPlayerFunction(resultOptions, loadScriptOrStyle)).then(function () {
+          _this5.onPlayerSetup();
         });
       }, function (originalError) {
-        _this7.onPlayerSetupError({
+        _this5.onPlayerSetupError({
           code: 'ERROR_BYTEARK_PLAYER_REACT_100001',
@@ -649,3 +611,2 @@ message: 'Sorry, something wrong when loading the video player.',
         }, originalError);
-
         throw originalError;
@@ -657,3 +618,2 @@ }));
   };
-
   _proto.componentWillUnmount = function componentWillUnmount() {
@@ -667,3 +627,2 @@ if (this.player) {
   };
-
   _proto.render = function render() {
@@ -681,3 +640,2 @@ return /*#__PURE__*/React.createElement("div", {
   };
-
   _proto.renderPlaceholder = function renderPlaceholder() {
@@ -687,11 +645,8 @@ var createPlaceholderFunction = this.props.createPlaceholderFunction || defaultCreatePlaceholderFunction;
   };
-
   _proto.renderPlayer = function renderPlayer() {
     var videoStyle = {};
     var videoClasses = '';
-
     if (this.props.className) {
       videoClasses = this.props.className;
     }
-
     if (this.props.fill === 'fluid') {
@@ -701,3 +656,2 @@ if (this.props.aspectRatio === '4:3') {
       }
-
       if (this.props.aspectRatio === '16:9') {
@@ -707,3 +661,2 @@ videoClasses += ' vjs-16-9';
     }
-
     if (this.props.audioOnlyMode) {
@@ -717,3 +670,2 @@ return /*#__PURE__*/React.createElement("audio", {
     }
-
     return /*#__PURE__*/React.createElement("video", {
@@ -726,3 +678,2 @@ playsInline: true,
   };
-
   _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
@@ -733,19 +684,18 @@ if (this.player) {
   };
-
   _proto.onClickPlaceholder = function onClickPlaceholder() {
-    var _this8 = this;
-
-    this.initializePlayer().then(function () {
-      _this8.setState({
-        showPlaceholder: false
+    try {
+      var _this6 = this;
+      return Promise.resolve(_this6.initializePlayer()).then(function () {
+        _this6.setState({
+          showPlaceholder: false
+        });
+        _this6.player.play();
       });
-
-      _this8.player.play();
-    });
+    } catch (e) {
+      return Promise.reject(e);
+    }
   };
-
   _proto.canUserDOM = function canUserDOM() {
     return typeof window !== 'undefined' && window.document && window.document.createElement;
   };
-
   return ByteArkPlayerContainer;
@@ -752,0 +702,0 @@ }(React.Component);

dist/index.modern.js

 import React from 'react';
 import isEqual from 'lodash.isequal';
 
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
 function _inheritsLoose(subClass, superClass) {
   subClass.prototype = Object.create(superClass.prototype);
   subClass.prototype.constructor = subClass;
-
   _setPrototypeOf(subClass, superClass);
 }
-
 function _setPrototypeOf(o, p) {
-  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
     o.__proto__ = p;
     return o;
   };
-
   return _setPrototypeOf(o, p);
 }
-
 function _assertThisInitialized(self) {
@@ -24,3 +34,2 @@ if (self === void 0) {
   }
-
   return self;
@@ -66,3 +75,2 @@ }
   var support = {};
-
   var testSystem = function testSystem(keySystem) {
@@ -75,3 +83,2 @@ return navigator.requestMediaKeySystemAccess(keySystem, configs).then(function () {
   };
-
   var tests = testKeySystems.map(function (keySystem) {
@@ -83,7 +90,5 @@ return testSystem(keySystem);
     var isSupportFairPlay = support['com.apple.fps.3_0'] === true || support['com.apple.fps.2_0'] === true || support['com.apple.fps.1_0'] === true || support['com.apple.fps'] === true;
-
     if (!isSupportWidevine && !isSupportFairPlay) {
       return Promise.reject(new Error('Browser does not support DRM'));
     }
-
     return {
@@ -139,10 +144,7 @@ widevine: isSupportWidevine,
   }
-
   var _aspectRatio$split = aspectRatio.split(':'),
-      hStr = _aspectRatio$split[0],
-      vStr = _aspectRatio$split[1];
-
+    hStr = _aspectRatio$split[0],
+    vStr = _aspectRatio$split[1];
   return Number.parseFloat(vStr) / Number.parseFloat(hStr) * 100;
 }
-
 function PlayerPlaceholder(props) {
@@ -174,7 +176,5 @@ var options = props.playerOptions;
   };
-
   if (options.fluid) {
     placeholderCustomStyle.paddingTop = calculatePlaceholderPaddingTopFromAspectRatio(props.aspectRatio || '16:9') + "%";
   }
-
   if (!options.fluid && options.fill) {
@@ -184,11 +184,8 @@ placeholderCustomStyle.height = '100%';
   }
-
   if (options.lazyload && !props.loaded) {
     placeholderCustomStyle.position = 'relative';
   }
-
   if (options.lazyload && props.loaded) {
     placeholderCustomStyle.position = 'absolute';
   }
-
   var shouldShowPlayIcon = options.controls === undefined || options.controls === null || options.controls === true;
@@ -216,6 +213,4 @@ return /*#__PURE__*/React.createElement("div", {
   }
-
   return null;
 }
-
 function createScriptTag(id, src) {
@@ -239,3 +234,2 @@ return new Promise(function (resolve, reject) {
 }
-
 function createLinkStyleTag(id, src) {
@@ -261,3 +255,2 @@ return new Promise(function (resolve, reject) {
 }
-
 var loadScriptOrStyle = function loadScriptOrStyle(id, src, type) {
@@ -268,18 +261,12 @@ try {
     }
-
     var existingElement = document.getElementById(id);
-
     if (existingElement) {
       return Promise.resolve(waitForTagLoad(existingElement));
     }
-
     var resolvedType = type || tryResolveSrcType(src);
-
     switch (resolvedType) {
       case 'script':
         return Promise.resolve(createScriptTag(id, src));
-
       case 'style':
         return Promise.resolve(createLinkStyleTag(id, src));
-
       default:
@@ -292,3 +279,2 @@ throw new Error('Not supported resource type');
 };
-
 var waitForTagLoad = function waitForTagLoad(tag) {
@@ -300,3 +286,2 @@ try {
       }
-
       tag.addEventListener('load', function () {
@@ -357,5 +342,4 @@ return resolve();
     var name = _ref.name,
-        setter = _ref.setter;
+      setter = _ref.setter;
     var effectiveSetter = setter || name;
-
     if (!isEqual(nextProps[name], prevProps[name])) {
@@ -377,3 +361,2 @@ player[effectiveSetter](nextProps[name]);
 }
-
 function defaultCreatePlayerFunction(videoNode, options, onReady) {
@@ -383,6 +366,4 @@ if (bytearkPlayer.initAsync) {
   }
-
   return bytearkPlayer.init(videoNode, options, onReady);
 }
-
 var defaultSetupPlayerFunction = function defaultSetupPlayerFunction(options, loaderFunction, loadPluginOptions) {
@@ -395,11 +376,7 @@ try {
 };
-
 var ByteArkPlayerContainer = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(ByteArkPlayerContainer, _React$Component);
-
   function ByteArkPlayerContainer(props) {
     var _this;
-
     _this = _React$Component.call(this, props) || this;
-
     _this.onPlayerLoaded = function () {
@@ -414,3 +391,2 @@ if (_this.props.onPlayerLoaded) {
     };
-
     _this.onPlayerLoadError = function (error, originalError) {
@@ -420,3 +396,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerLoadError) {
@@ -430,3 +405,2 @@ try {
     };
-
     _this.onPlayerSetup = function () {
@@ -436,3 +410,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerSetup) {
@@ -442,3 +415,2 @@ _this.props.onPlayerSetup();
     };
-
     _this.onPlayerSetupError = function (error, originalError) {
@@ -448,3 +420,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerSetupError) {
@@ -458,3 +429,2 @@ try {
     };
-
     _this.onPlayerCreated = function () {
@@ -464,3 +434,2 @@ _this.setState({
       });
-
       if (_this.props.onPlayerCreated) {
@@ -470,3 +439,2 @@ _this.props.onPlayerCreated(_this.player);
     };
-
     _this.onReady = function () {
@@ -476,3 +444,2 @@ _this.setState({
       });
-
       if (_this.props.onReady) {
@@ -482,10 +449,8 @@ _this.props.onReady(_this.player);
     };
-
-    _this.createPlayerInstance = function () {
+    _this.createPlayerInstance = function (resultOptions) {
       try {
         window.bytearkPlayer.isBrowserSupportDrm = isBrowserSupportDrm;
         var createPlayerFunction = _this.props.createPlayerFunction || defaultCreatePlayerFunction;
-        return Promise.resolve(createPlayerFunction(_this.videoNode, _this.props, _this.onReady)).then(function (_createPlayerFunction) {
+        return Promise.resolve(createPlayerFunction(_this.videoNode, resultOptions, _this.onReady)).then(function (_createPlayerFunction) {
           _this.player = _createPlayerFunction;
-
           _this.onPlayerCreated();
@@ -497,7 +462,5 @@ });
     };
-
     _this.onVideoNodeCreated = function (node) {
       _this.videoNode = node;
     };
-
     _this.player = null;
@@ -514,21 +477,15 @@ _this.state = {
   }
-
   var _proto = ByteArkPlayerContainer.prototype;
-
   _proto.player = function player() {
     return this.player;
   };
-
   _proto.loaded = function loaded() {
     return this.state.loaded;
   };
-
   _proto.ready = function ready() {
     return this.state.ready;
   };
-
   _proto.error = function error() {
     return this.state.error;
   };
-
   _proto.componentDidMount = function componentDidMount() {
@@ -539,23 +496,20 @@ if (!this.props.lazyload) {
   };
-
   _proto.initializePlayer = function initializePlayer() {
     try {
-      var _this3 = this;
-
-      var isClient = _this3.canUserDOM();
-
+      var _this2 = this;
+      var isClient = _this2.canUserDOM();
       if (!isClient) {
         return Promise.resolve();
       }
-
-      if (_this3.initializeInProgress) {
+      if (_this2.initializeInProgress) {
         return Promise.resolve();
       }
-
-      _this3.initializeInProgress = true;
+      _this2.initializeInProgress = true;
       return Promise.resolve(_catch(function () {
-        return Promise.resolve(_this3.loadPlayerResources()).then(function () {
-          return Promise.resolve(_this3.setupPlayer()).then(function () {
-            return Promise.resolve(_this3.createPlayerInstance()).then(function () {
-              _this3.initializeInProgress = false;
+        return Promise.resolve(_this2.loadPlayerResources()).then(function () {
+          return Promise.resolve(_this2.setupOptions()).then(function (resultOptions) {
+            return Promise.resolve(_this2.setupPlayer(resultOptions)).then(function () {
+              return Promise.resolve(_this2.createPlayerInstance(resultOptions)).then(function () {
+                _this2.initializeInProgress = false;
+              });
             });
@@ -565,3 +519,3 @@ });
       }, function (err) {
-        _this3.initializeInProgress = false;
+        _this2.initializeInProgress = false;
         throw err;
@@ -573,39 +527,30 @@ }));
   };
-
   _proto.loadPlayerResources = function loadPlayerResources() {
     try {
-      var _temp3 = function _temp3(_result2) {
-        if (_exit2) return _result2;
-
-        _this5.onPlayerLoaded();
+      var _temp2 = function _temp2(_result2) {
+        if (_exit) return _result2;
+        _this3.onPlayerLoaded();
       };
-
-      var _exit2 = false;
-
-      var _this5 = this;
-
-      var _temp4 = _catch(function () {
+      var _exit = false;
+      var _this3 = this;
+      var _temp = _catch(function () {
         var promises = [];
-
-        if (_this5.props.playerSlugId) {
-          if (_this5.props.playerJsFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-script-" + _this5.props.playerSlugId, _this5.props.playerServerEndpoint + "/" + _this5.props.playerSlugId + "/libraries/" + _this5.props.playerJsFileName, 'script'));
+        if (_this3.props.playerSlugId) {
+          if (_this3.props.playerJsFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-script-" + _this3.props.playerSlugId, _this3.props.playerServerEndpoint + "/" + _this3.props.playerSlugId + "/libraries/" + _this3.props.playerJsFileName, 'script'));
           }
-
-          if (_this5.props.playerCssFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-style-" + _this5.props.playerSlugId, _this5.props.playerServerEndpoint + "/" + _this5.props.playerSlugId + "/libraries/" + _this5.props.playerCssFileName, 'style'));
+          if (_this3.props.playerCssFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-style-" + _this3.props.playerSlugId, _this3.props.playerServerEndpoint + "/" + _this3.props.playerSlugId + "/libraries/" + _this3.props.playerCssFileName, 'style'));
           }
         } else {
-          if (_this5.props.playerJsFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-script-" + _this5.props.playerVersion, _this5.props.playerEndpoint + "/" + _this5.props.playerVersion + "/" + _this5.props.playerJsFileName, 'script'));
+          if (_this3.props.playerJsFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-script-" + _this3.props.playerVersion, _this3.props.playerEndpoint + "/" + _this3.props.playerVersion + "/" + _this3.props.playerJsFileName, 'script'));
           }
-
-          if (_this5.props.playerCssFileName) {
-            promises.push(loadScriptOrStyle("byteark-player-style-" + _this5.props.playerVersion, _this5.props.playerEndpoint + "/" + _this5.props.playerVersion + "/" + _this5.props.playerCssFileName, 'style'));
+          if (_this3.props.playerCssFileName) {
+            promises.push(loadScriptOrStyle("byteark-player-style-" + _this3.props.playerVersion, _this3.props.playerEndpoint + "/" + _this3.props.playerVersion + "/" + _this3.props.playerCssFileName, 'style'));
           }
         }
-
         return Promise.resolve(Promise.all(promises)).then(function () {});
       }, function (originalError) {
-        _this5.onPlayerLoadError({
+        _this3.onPlayerLoadError({
           code: 'ERROR_BYTEARK_PLAYER_REACT_100001',
@@ -615,7 +560,5 @@ message: 'Sorry, something wrong when loading the video player.',
         }, originalError);
-
         throw originalError;
       });
-
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+      return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
     } catch (e) {
@@ -625,18 +568,37 @@ return Promise.reject(e);
   };
-
-  _proto.setupPlayer = function setupPlayer() {
+  _proto.setupOptions = function setupOptions() {
     try {
-      var _this7 = this;
-
-      if (_this7.setupPlayerPromise) {
-        return Promise.resolve(_this7.setupPlayerPromise);
+      var _this4 = this;
+      return Promise.resolve(_catch(function () {
+        return Promise.resolve(window.bytearkPlayer.canAutoplay(_this4.props)).then(function (autoplayResult) {
+          var resultPlayerOptions = _extends({}, _this4.props, {
+            autoplayResult_: autoplayResult
+          });
+          return resultPlayerOptions;
+        });
+      }, function (originalError) {
+        _this4.onPlayerSetupError({
+          code: 'ERROR_BYTEARK_PLAYER_REACT_100001',
+          message: 'Sorry, something wrong when loading the video player.',
+          messageSecondary: 'Please refresh the page to try again.'
+        }, originalError);
+        throw originalError;
+      }));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  _proto.setupPlayer = function setupPlayer(resultOptions) {
+    try {
+      var _this5 = this;
+      if (_this5.setupPlayerPromise) {
+        return Promise.resolve(_this5.setupPlayerPromise);
       }
-
       return Promise.resolve(_catch(function () {
-        var setupPlayerFunction = _this7.props.setupPlayerFunction || defaultSetupPlayerFunction;
-        return Promise.resolve(setupPlayerFunction(_this7.props, loadScriptOrStyle)).then(function () {
-          _this7.onPlayerSetup();
+        var setupPlayerFunction = _this5.props.setupPlayerFunction || defaultSetupPlayerFunction;
+        return Promise.resolve(setupPlayerFunction(resultOptions, loadScriptOrStyle)).then(function () {
+          _this5.onPlayerSetup();
         });
       }, function (originalError) {
-        _this7.onPlayerSetupError({
+        _this5.onPlayerSetupError({
           code: 'ERROR_BYTEARK_PLAYER_REACT_100001',
@@ -646,3 +608,2 @@ message: 'Sorry, something wrong when loading the video player.',
         }, originalError);
-
         throw originalError;
@@ -654,3 +615,2 @@ }));
   };
-
   _proto.componentWillUnmount = function componentWillUnmount() {
@@ -664,3 +624,2 @@ if (this.player) {
   };
-
   _proto.render = function render() {
@@ -678,3 +637,2 @@ return /*#__PURE__*/React.createElement("div", {
   };
-
   _proto.renderPlaceholder = function renderPlaceholder() {
@@ -684,11 +642,8 @@ var createPlaceholderFunction = this.props.createPlaceholderFunction || defaultCreatePlaceholderFunction;
   };
-
   _proto.renderPlayer = function renderPlayer() {
     var videoStyle = {};
     var videoClasses = '';
-
     if (this.props.className) {
       videoClasses = this.props.className;
     }
-
     if (this.props.fill === 'fluid') {
@@ -698,3 +653,2 @@ if (this.props.aspectRatio === '4:3') {
       }
-
       if (this.props.aspectRatio === '16:9') {
@@ -704,3 +658,2 @@ videoClasses += ' vjs-16-9';
     }
-
     if (this.props.audioOnlyMode) {
@@ -714,3 +667,2 @@ return /*#__PURE__*/React.createElement("audio", {
     }
-
     return /*#__PURE__*/React.createElement("video", {
@@ -723,3 +675,2 @@ playsInline: true,
   };
-
   _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
@@ -730,19 +681,18 @@ if (this.player) {
   };
-
   _proto.onClickPlaceholder = function onClickPlaceholder() {
-    var _this8 = this;
-
-    this.initializePlayer().then(function () {
-      _this8.setState({
-        showPlaceholder: false
+    try {
+      var _this6 = this;
+      return Promise.resolve(_this6.initializePlayer()).then(function () {
+        _this6.setState({
+          showPlaceholder: false
+        });
+        _this6.player.play();
       });
-
-      _this8.player.play();
-    });
+    } catch (e) {
+      return Promise.reject(e);
+    }
   };
-
   _proto.canUserDOM = function canUserDOM() {
     return typeof window !== 'undefined' && window.document && window.document.createElement;
   };
-
   return ByteArkPlayerContainer;
@@ -749,0 +699,0 @@ }(React.Component);

package.json

 {
   "name": "byteark-player-react",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "ByteArk Player Container for React",
@@ -32,17 +32,20 @@ "author": "byteark",
     "cross-env": "^7.0.3",
-    "eslint": "^7.18.0",
-    "eslint-config-prettier": "^7.2.0",
-    "eslint-config-standard": "^16.0.2",
-    "eslint-config-standard-react": "^11.0.1",
-    "eslint-plugin-import": "^2.22.1",
+    "eslint": "^8.50.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-config-react-app": "^7.0.1",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-config-standard-react": "^13.0.0",
+    "eslint-plugin-import": "^2.28.1",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^3.3.1",
-    "eslint-plugin-promise": "^4.2.1",
-    "eslint-plugin-react": "^7.22.0",
+    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-standard": "^5.0.0",
-    "gh-pages": "^2.2.0",
+    "gh-pages": "^6.0.0",
     "microbundle-crl": "^0.13.11",
-    "node-sass": "^7.0.0",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.0.5",
+    "postcss-flexbugs-fixes": "^5.0.2",
+    "postcss-loader": "^7.3.3",
+    "postcss-normalize": "^10.0.1",
+    "prettier": "^3.0.3",
     "react": "^18.2.0",
@@ -49,0 +52,0 @@ "react-dom": "^18.2.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

182414

increased by4.69%

Lines of code

1322

increased by6.79%

Worsened metrics

Dev dependency count

23

increased by15%

No dependency changes