react-player - npm Package Compare versions

Comparing version 1.13.0 to 1.14.0

lib/players/Facebook.js

@@ -40,3 +40,3 @@ "use strict";
 
-var SDK_URL = '//connect.facebook.net/en_US/sdk.js';
+var SDK_URL = 'https://connect.facebook.net/en_US/sdk.js';
 var SDK_GLOBAL = 'FB';
@@ -43,0 +43,0 @@ var SDK_GLOBAL_READY = 'fbAsyncInit';

lib/players/FilePlayer.js

@@ -96,4 +96,11 @@ "use strict";
 
+function supportsWebKitPresentationMode(video) {
+  if (!video) video = document.createElement('video'); // Check if Safari supports PiP, and is not on mobile (other than iPad)
+  // iPhone safari appears to "support" PiP through the check, however PiP does not function
+
+  return video.webkitSupportsPresentationMode && typeof video.webkitSetPresentationMode === 'function' && !/iPhone|iPod/.test(navigator.userAgent);
+}
+
 function canEnablePIP(url) {
-  return canPlay(url) && !!document.pictureInPictureEnabled && !AUDIO_EXTENSIONS.test(url);
+  return canPlay(url) && (!!document.pictureInPictureEnabled || supportsWebKitPresentationMode()) && !AUDIO_EXTENSIONS.test(url);
 }
@@ -178,2 +185,14 @@
 
+    _defineProperty(_assertThisInitialized(_this), "onPresentationModeChange", function (e) {
+      if (_this.player && supportsWebKitPresentationMode(_this.player)) {
+        var webkitPresentationMode = _this.player.webkitPresentationMode;
+
+        if (webkitPresentationMode === 'picture-in-picture') {
+          _this.onEnablePIP(e);
+        } else if (webkitPresentationMode === 'inline') {
+          _this.onDisablePIP(e);
+        }
+      }
+    });
+
     _defineProperty(_assertThisInitialized(_this), "onSeek", function (e) {
@@ -258,2 +277,3 @@ _this.props.onSeek(e.target.currentTime);
       player.addEventListener('leavepictureinpicture', this.onDisablePIP);
+      player.addEventListener('webkitpresentationmodechanged', this.onPresentationModeChange);
 
@@ -279,2 +299,3 @@ if (playsinline) {
       player.removeEventListener('leavepictureinpicture', this.onDisablePIP);
+      player.removeEventListener('webkitpresentationmodechanged', this.onPresentationModeChange);
     } // Proxy methods to prevent listener leaks
@@ -334,2 +355,4 @@
 
+          _this2.dash.on('error', _this2.props.onError);
+
           _this2.dash.getDebug().setLogToBrowserConsole(false);
@@ -395,2 +418,4 @@ });
         this.player.requestPictureInPicture();
+      } else if (supportsWebKitPresentationMode(this.player) && this.player.webkitPresentationMode !== 'picture-in-picture') {
+        this.player.webkitSetPresentationMode('picture-in-picture');
       }
@@ -403,2 +428,4 @@ }
         document.exitPictureInPicture();
+      } else if (supportsWebKitPresentationMode(this.player) && this.player.webkitPresentationMode !== 'inline') {
+        this.player.webkitSetPresentationMode('inline');
       }
@@ -405,0 +432,0 @@ }

lib/players/Mixcloud.js

@@ -44,3 +44,3 @@ "use strict";
 
-var SDK_URL = '//widget.mixcloud.com/media/js/widgetApi.js';
+var SDK_URL = 'https://widget.mixcloud.com/media/js/widgetApi.js';
 var SDK_GLOBAL = 'Mixcloud';
@@ -47,0 +47,0 @@ var MATCH_URL = /mixcloud\.com\/([^/]+\/[^/]+)/;

lib/players/Streamable.js

@@ -40,3 +40,3 @@ "use strict";
 
-var SDK_URL = '//cdn.embed.ly/player-0.1.0.min.js';
+var SDK_URL = 'https://cdn.embed.ly/player-0.1.0.min.js';
 var SDK_GLOBAL = 'playerjs';
@@ -43,0 +43,0 @@ var MATCH_URL = /streamable\.com\/([a-z0-9]+)$/;

lib/players/Twitch.js

@@ -91,3 +91,4 @@ "use strict";
           onError = _this$props.onError,
-          config = _this$props.config;
+          config = _this$props.config,
+          controls = _this$props.controls;
       var isChannel = MATCH_CHANNEL_URL.test(url);
@@ -115,3 +116,4 @@ var id = isChannel ? url.match(MATCH_CHANNEL_URL)[1] : url.match(MATCH_VIDEO_URL)[1];
           muted: _this2.props.muted,
-          controls: _this2.props.controls
+          // https://github.com/CookPete/react-player/issues/733#issuecomment-549085859
+          controls: isChannel ? true : controls
         }, config.twitch.options));
@@ -118,0 +120,0 @@ var _Twitch$Player = Twitch.Player,

lib/players/Wistia.js

@@ -44,3 +44,3 @@ "use strict";
 
-var SDK_URL = '//fast.wistia.com/assets/external/E-v1.js';
+var SDK_URL = 'https://fast.wistia.com/assets/external/E-v1.js';
 var SDK_GLOBAL = 'Wistia';
@@ -47,0 +47,0 @@ var MATCH_URL = /(?:wistia\.com|wi\.st)\/(?:medias|embed)\/(.*)$/;

lib/Preview.js

@@ -122,3 +122,5 @@ "use strict";
     value: function render() {
-      var onClick = this.props.onClick;
+      var _this$props2 = this.props,
+          onClick = _this$props2.onClick,
+          playIcon = _this$props2.playIcon;
       var image = this.state.image;
@@ -152,7 +154,4 @@ var flexCenter = {
       };
-      return _react["default"].createElement("div", {
-        style: styles.preview,
-        className: "react-player__preview",
-        onClick: onClick
-      }, _react["default"].createElement("div", {
+
+      var defaultPlayIcon = _react["default"].createElement("div", {
         style: styles.shadow,
@@ -163,3 +162,9 @@ className: "react-player__shadow"
         className: "react-player__play-icon"
-      })));
+      }));
+
+      return _react["default"].createElement("div", {
+        style: styles.preview,
+        className: "react-player__preview",
+        onClick: onClick
+      }, playIcon || defaultPlayIcon);
     }
@@ -166,0 +171,0 @@ }]);

lib/props.js

@@ -19,3 +19,4 @@ "use strict";
     object = _propTypes["default"].object,
-    func = _propTypes["default"].func;
+    func = _propTypes["default"].func,
+    node = _propTypes["default"].node;
 var propTypes = {
@@ -36,2 +37,3 @@ url: oneOfType([string, array, object]),
   light: oneOfType([bool, string]),
+  playIcon: node,
   wrapper: oneOfType([string, func, shape({
@@ -38,0 +40,0 @@ render: func.isRequired

lib/ReactPlayer.js

@@ -300,2 +300,3 @@ "use strict";
           light = _this$props.light,
+          playIcon = _this$props.playIcon,
           Wrapper = _this$props.wrapper;
@@ -312,2 +313,3 @@ var showPreview = this.state.showPreview && url;
         light: light,
+        playIcon: playIcon,
         onClick: this.handleClickPreview
@@ -314,0 +316,0 @@ });

lib/utils.js

@@ -154,3 +154,3 @@ "use strict";
         });
-        requests[url] = [];
+        requests[url] = null;
       } else if (!sdkReady) {
@@ -157,0 +157,0 @@ onLoaded(window[sdkGlobal]);

package.json

 {
   "name": "react-player",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "description": "A React component for playing a variety of URLs, including file paths, YouTube, Facebook, Twitch, SoundCloud, Streamable, Vimeo, Wistia and DailyMotion",
@@ -5,0 +5,0 @@ "main": "lib/ReactPlayer.js",

README.md

@@ -80,2 +80,3 @@ <h1 align='center'>
 `wrapper` | Element or component to use as the container element | `div`
+`playIcon` | Element or component to use as the play icon in light mode
 `config` | Override options for the various players, see [config prop](#config-prop)
@@ -82,0 +83,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

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1491470

increased by37.33%

Lines of code

4616

increased by0.83%

Number of lines in readme file

360

increased by0.28%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes