react-native-video - npm Package Compare versions

Comparing version 0.2.4 to 0.2.5

package.json

 {
   "name": "react-native-video",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "A <Video> element for react-native",
@@ -8,3 +8,3 @@ "main": "Video.ios.js",
   "dependencies": {
-    "react-native": "^0.3.1"
+    "react-native": "^0.3.5"
   },
@@ -11,0 +11,0 @@ "repository": {

README.md

@@ -30,4 +30,10 @@ ## react-native-video
 // on a single screen if you like.
-<Video source={"background"} style={styles.backgroundVideo}
-       resizeMode="cover" repeat={true} />
+<Video source={{uri: "background"}} // Can be a URL or a local file.
+       rate={1.0}                   // 0 is paused, 1 is normal.
+       volume={1.0}                 // 0 is muted, 1 is normal.
+       muted={false}                // Mutes the audio entirely.
+       paused={false}               // Pauses playback entirely.
+       resizeMode="cover"           // Fill the whole screen at aspect ratio.
+       repeat={true}                // Repeat forever.
+       style={styles.backgroundVideo} />
 
@@ -50,16 +56,6 @@ // Later on in your styles..
 
-- [ ] Support `require('video!...')`
-- [ ] Support other extensions than `mp4` - `mov` would be useful for
-  playing videos from phone's camera
-- [x] Switch to AVPlayer (0.1.6)
-- [x] Switch resizeMode to prop instead of style (0.1.7)
-- [x] Add `paused` prop (0.1.7)
-- [x] Add `rate` prop
-- [x] Add `volume` prop
-- [x] Add `muted` prop
-- [x] Add some way to get back the `currentTime` value (0.1.9 - `onProgress` prop)
-- [x] Add some way to get back the `duration` value (0.1.8 - `onLoad` prop)
 - [ ] Add some way to interface with `seekToTime`
 - [ ] Add support for captions
+- [ ] Support `require('video!...')`
 - [ ] Add support for playing multiple videos in a sequence (will interfere with current `repeat` implementation)
-- [ ] Any other [for other AVPlayer props](https://developer.apple.com/library/prerelease/ios/documentation/AVFoundation/Reference/AVPlayer_Class/index.html)
+- [ ] Add `onComplete` callback for when it finishes playing

Video.ios.js

@@ -13,7 +13,10 @@ var React = require('react-native');
 var merge = require('merge');
+var deepDiffer = require('deepDiffer');
 
 var Video = React.createClass({
   propTypes: {
-    source: PropTypes.string,
+    // should probably be a shape
+    source: PropTypes.object,
     style: StyleSheetPropType(VideoStylePropTypes),
+    source: PropTypes.object,
     resizeMode: PropTypes.string,
@@ -25,3 +28,5 @@ repeat: PropTypes.bool,
     rate: PropTypes.number,
+    onLoadStart: PropTypes.func,
     onLoad: PropTypes.func,
+    onError: PropTypes.func,
     onProgress: PropTypes.func,
@@ -37,2 +42,6 @@ },
 
+  _onLoadStart(event) {
+    this.props.onLoadStart && this.props.onLoadStart(event.nativeEvent);
+  },
+
   _onLoad(event) {
@@ -42,2 +51,6 @@ this.props.onLoad && this.props.onLoad(event.nativeEvent);
 
+  _onError(event) {
+    this.props.onError && this.props.onError(event.nativeEvent);
+  },
+
   _onProgress(event) {
@@ -50,2 +63,4 @@ this.props.onProgress && this.props.onProgress(event.nativeEvent);
     var source = this.props.source;
+    var isNetwork = !!(source.uri && source.uri.match(/^https?:/));
+    var isAsset = !!(source.uri && source.uri.match(/^assets-library:/));
 
@@ -57,3 +72,3 @@ var resizeMode;
       resizeMode = NativeModules.VideoManager.ScaleAspectFit;
-    } else if (this.props.resizeMode == VideoResizeMode.cover) {
+    } else if (this.props.resizeMode === VideoResizeMode.cover) {
       resizeMode = NativeModules.VideoManager.ScaleAspectFill;
@@ -67,5 +82,11 @@ } else {
       resizeMode: resizeMode,
-      src: source,
+      src: {
+        uri: source.uri,
+        isNetwork,
+        isAsset,
+        type: source.type || 'mp4'
+      },
       onLoad: this._onLoad,
       onProgress: this._onProgress,
+
     });
@@ -79,4 +100,4 @@
   validAttributes: merge(ReactIOSViewAttributes.UIView,
-    {src: true, resizeMode: true, repeat: true, paused: true, muted: true,
-     volume: true, rate: true}),
+    {src: {diff: deepDiffer}, resizeMode: true, repeat: true,
+     paused: true, muted: true, volume: true, rate: true}),
   uiViewClassName: 'RCTVideo',
@@ -83,0 +104,0 @@ });

New alerts

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11149682

increased by51588.29%

Number of package files

30

increased by150%

Lines of code

335

increased by252.63%

Worsened metrics

Number of lines in readme file

60

decreased by-6.25%

Number of medium supply chain risk alerts

3

increased byInfinity%

Dependency changes

• Updatedreact-native@^0.3.5