From f9771134af144d1d861632e239640e93a3408c3f Mon Sep 17 00:00:00 2001 From: Radu Batori Date: Wed, 27 Sep 2017 10:41:33 +0300 Subject: [PATCH 01/26] Exit fullscreen if endWithThumbnail is set --- index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/index.js b/index.js index 7891623..e2e87c2 100644 --- a/index.js +++ b/index.js @@ -170,6 +170,7 @@ export default class VideoPlayer extends Component { if (this.props.endWithThumbnail) { this.setState({ isStarted: false }); + this.player.dismissFullscreenPlayer(); } this.setState({ progress: 1 }); From 7918dee1af43830d84ec67fab7902831f184a26c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Wed, 27 Sep 2017 10:19:53 +0200 Subject: [PATCH 02/26] 0.8.4 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 2becc55..2fa6f92 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-video-player", - "version": "0.8.3", + "version": "0.8.4", "description": "A video player for React Native with controls", "main": "index.js", "scripts": { From b2fef1d534aeaabb50610aedf88127afc5381184 Mon Sep 17 00:00:00 2001 From: Radu Batori Date: Wed, 27 Sep 2017 13:21:25 +0300 Subject: [PATCH 03/26] Fix Image deprecation on RN > 0.46 --- index.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/index.js b/index.js index e2e87c2..62be08b 100644 --- a/index.js +++ b/index.js @@ -1,9 +1,11 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { Image, Platform, StyleSheet, TouchableOpacity, View, ViewPropTypes } from 'react-native'; +import { Image, ImageBackground, Platform, StyleSheet, TouchableOpacity, View, ViewPropTypes } from 'react-native'; import Icon from 'react-native-vector-icons/MaterialIcons'; import Video from 'react-native-video'; // eslint-disable-line +const BackgroundImage = ImageBackground || Image; // fall back to Image if RN < 0.46 + const styles = StyleSheet.create({ preloadingPlaceholder: { backgroundColor: 'black', @@ -321,7 +323,7 @@ export default class VideoPlayer extends Component { renderThumbnail() { const { thumbnail, style, customStyles, ...props } = this.props; return ( - {this.renderStartButton()} - + ); } From 1536ac59fdea5780b75f1fdfb42485d2ad45fdc9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Tue, 10 Oct 2017 12:14:45 +0200 Subject: [PATCH 04/26] 0.8.5 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 2fa6f92..d421613 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-video-player", - "version": "0.8.4", + "version": "0.8.5", "description": "A video player for React Native with controls", "main": "index.js", "scripts": { From 8d97d655d8b4409cab6f414c60f4f1fa6d0658d0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Mon, 20 Nov 2017 10:11:43 +0100 Subject: [PATCH 05/26] Added seek function --- README.md | 6 ++++++ index.js | 4 ++++ 2 files changed, 10 insertions(+) diff --git a/README.md b/README.md index 359babe..b9c7d6a 100644 --- a/README.md +++ b/README.md @@ -63,6 +63,12 @@ All other props are passed to the react-native-video component. - playArrow - videoWrapper +## Methods + +| Method | Props | Description | +|-------------------------|-----------------|---------------------------------------------------------------------------| +| seek | time: float | Seek the player to the given time. | + ## Future features - [X] Make seek bar seekable. diff --git a/index.js b/index.js index 62be08b..0b45662 100644 --- a/index.js +++ b/index.js @@ -308,6 +308,10 @@ export default class VideoPlayer extends Component { this.hideControls(); } + seek(t) { + this.player.seek(t); + } + renderStartButton() { const { customStyles } = this.props; return ( From 07f938f31f3613be48ff6d92d5e407faeff739f9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Mon, 20 Nov 2017 10:13:05 +0100 Subject: [PATCH 06/26] 0.8.6 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d421613..862ebe0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-video-player", - "version": "0.8.5", + "version": "0.8.6", "description": "A video player for React Native with controls", "main": "index.js", "scripts": { From 5e8d173752118bfab6cc203e7333dbdff59372cb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Mon, 20 Nov 2017 10:14:10 +0100 Subject: [PATCH 07/26] 0.8.6 --- CHANGELOG.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index afc1010..4ece02e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,6 @@ +## 0.8.6 + - Added `seek` method. + ## 0.8.2 - Fixed error in more Android versions From ed4fb6164ada52d7c2b716a648c660694c1c45e7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Wed, 17 Jan 2018 09:30:07 +0100 Subject: [PATCH 08/26] Reset progress to 0 when replaying video --- index.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/index.js b/index.js index 0b45662..741084f 100644 --- a/index.js +++ b/index.js @@ -145,10 +145,11 @@ export default class VideoPlayer extends Component { this.props.onStart(); } - this.setState({ + this.setState(state => ({ isPlaying: true, isStarted: true, - }); + progress: state.progress === 1 ? 0 : state.progress, + })); this.hideControls(); } @@ -459,8 +460,8 @@ export default class VideoPlayer extends Component { { marginTop: -this.getSizeStyles().height }, ]} > - { this.showControls(); if (pauseOnPress) @@ -469,7 +470,7 @@ export default class VideoPlayer extends Component { onLongPress={() => { if (fullScreenOnLongPress && Platform.OS !== 'android') this.onToggleFullScreen(); - }} + }} /> {((!this.state.isPlaying) || this.state.isControlsVisible) From e02b327a17f87921af9d81f07d098cc98462d858 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Wed, 17 Jan 2018 09:48:45 +0100 Subject: [PATCH 09/26] Add stop, pause and resume methods --- README.md | 3 +++ example/app/index.js | 15 ++++++++++++++- index.js | 23 +++++++++++++++++++++++ 3 files changed, 40 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index b9c7d6a..13b7837 100644 --- a/README.md +++ b/README.md @@ -68,6 +68,9 @@ All other props are passed to the react-native-video component. | Method | Props | Description | |-------------------------|-----------------|---------------------------------------------------------------------------| | seek | time: float | Seek the player to the given time. | +| stop | | Stop the playback and reset back to 0:00. | +| pause | | Pause the playback. | +| resume | | Resume the playback. | ## Future features diff --git a/example/app/index.js b/example/app/index.js index 1e8c5b4..f9b4e37 100644 --- a/example/app/index.js +++ b/example/app/index.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import { View, Text } from 'react-native'; +import { View, Text, Button } from 'react-native'; import VideoPlayer from 'react-native-video-player'; const VIMEO_ID = '179859217'; @@ -37,6 +37,19 @@ export default class App extends Component { videoHeight={this.state.video.height} duration={this.state.video.duration/* I'm using a hls stream here, react-native-video can't figure out the length, so I pass it here from the vimeo config */} + ref={r => this.player = r} + /> +