From c6129ffc31746eb26bdfccb424222d2e8f974b44 Mon Sep 17 00:00:00 2001
From: Akinwale Ariwodola <akinwale@gmail.com>
Date: Mon, 23 Apr 2018 10:26:09 +0100
Subject: [PATCH] added new setting to toggle background media play

---
 app/src/component/mediaPlayer/index.js |  6 +++++-
 app/src/component/mediaPlayer/view.js  |  4 ++--
 app/src/page/settings/index.js         |  1 +
 app/src/page/settings/view.js          | 11 +++++++++++
 4 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/app/src/component/mediaPlayer/index.js b/app/src/component/mediaPlayer/index.js
index 4b97d52d..e3715f59 100644
--- a/app/src/component/mediaPlayer/index.js
+++ b/app/src/component/mediaPlayer/index.js
@@ -1,7 +1,11 @@
 import { connect } from 'react-redux';
+import { SETTINGS } from 'lbry-redux';
+import { makeSelectClientSetting } from '../../redux/selectors/settings';
 import MediaPlayer from './view';
 
-const select = state => ({});
+const select = state => ({
+    backgroundPlayEnabled: makeSelectClientSetting(SETTINGS.BACKGROUND_PLAY_ENABLED)(state),
+});
 const perform = dispatch => ({});
 
 export default connect(select, perform)(MediaPlayer);
diff --git a/app/src/component/mediaPlayer/view.js b/app/src/component/mediaPlayer/view.js
index 469bd12a..39929d05 100644
--- a/app/src/component/mediaPlayer/view.js
+++ b/app/src/component/mediaPlayer/view.js
@@ -243,7 +243,7 @@ class MediaPlayer extends React.PureComponent {
   }
 
   render() {
-    const { fileInfo, thumbnail, style, fullScreenStyle } = this.props;
+    const { backgroundPlayEnabled, fileInfo, thumbnail, style, fullScreenStyle } = this.props;
     const flexCompleted = this.getCurrentTimePercentage() * 100;
     const flexRemaining = (1 - this.getCurrentTimePercentage()) * 100;
     
@@ -252,7 +252,7 @@ class MediaPlayer extends React.PureComponent {
         <Video source={{ uri: 'file:///' + fileInfo.download_path }}
                ref={(ref: Video) => { this.video = ref }}
                resizeMode={this.state.resizeMode}
-               playInBackground={true}
+               playInBackground={backgroundPlayEnabled}
                style={mediaPlayerStyle.player}
                rate={this.state.rate}
                volume={this.state.volume}
diff --git a/app/src/page/settings/index.js b/app/src/page/settings/index.js
index 3d05e8e7..8d1ed539 100644
--- a/app/src/page/settings/index.js
+++ b/app/src/page/settings/index.js
@@ -5,6 +5,7 @@ import { makeSelectClientSetting } from '../../redux/selectors/settings';
 import SettingsPage from './view';
 
 const select = state => ({
+  backgroundPlayEnabled: makeSelectClientSetting(SETTINGS.BACKGROUND_PLAY_ENABLED)(state),
   keepDaemonRunning: makeSelectClientSetting(SETTINGS.KEEP_DAEMON_RUNNING)(state),
   showNsfw: makeSelectClientSetting(SETTINGS.SHOW_NSFW)(state),
 });
diff --git a/app/src/page/settings/view.js b/app/src/page/settings/view.js
index f651b335..87577753 100644
--- a/app/src/page/settings/view.js
+++ b/app/src/page/settings/view.js
@@ -11,6 +11,7 @@ class SettingsPage extends React.PureComponent {
   
   render() {
     const {
+      backgroundPlayEnabled,
       keepDaemonRunning,
       showNsfw,
       setClientSetting
@@ -21,6 +22,16 @@ class SettingsPage extends React.PureComponent {
         <PageHeader title={"Settings"}
           onBackPressed={() => { this.props.navigation.goBack(); }} />
         <ScrollView style={settingsStyle.scrollContainer}>
+          <View style={settingsStyle.row}>
+            <View style={settingsStyle.switchText}>
+              <Text style={settingsStyle.label}>Enable background media playback</Text>
+              <Text style={settingsStyle.description}>Enable this option to play audio or video in the background when the app is suspended.</Text>
+            </View>
+            <View style={settingsStyle.switchContainer}>
+              <Switch value={backgroundPlayEnabled} onValueChange={(value) => setClientSetting(SETTINGS.BACKGROUND_PLAY_ENABLED, value)} />
+            </View>
+          </View>
+          
           <View style={settingsStyle.row}>
             <View style={settingsStyle.switchText}>
               <Text style={settingsStyle.label}>Show NSFW content</Text>