Merge pull request #83 from VocaDB/develop

Develop

Author: up2code

android/app/src/main/AndroidManifest.xml

@@ -11,10 +11,11 @@
     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" tools:node="remove" />
     <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
     <uses-permission android:name="android.permission.VIBRATE" />
-
+    
     <uses-sdk
         android:minSdkVersion="16"
-        android:targetSdkVersion="26" />
+        android:targetSdkVersion="26"
+        tools:overrideLibrary="com.reactNativeQuickActions" />
 
     <application
       android:name=".MainApplication"

src/components/YouTubePlayer/YoutubePlayer.js

@@ -1,21 +1,42 @@
 import React from 'react';
-import { View, Text, WebView } from 'react-native';
+import { View, Text, WebView, AppState } from 'react-native';
 import PropTypes from 'prop-types';
 
 const Player = require('./player.html');
 
 class YoutubePlayer extends React.Component {
+
+    state = {
+        appState: AppState.currentState
+    }
+  
+    componentDidMount() {
+        AppState.addEventListener('change', this._handleAppStateChange);
+    }
+  
+    componentWillUnmount() {
+        AppState.removeEventListener('change', this._handleAppStateChange);
+    }
+  
+    _handleAppStateChange = (nextAppState) => {        
+        this.setState({appState: nextAppState});
+    }
+  
     render () {
 
         return (
             <View style={{ height: 260 }}>
-                <WebView
-                    style={{flex:1}}
-                    javaScriptEnabled={true}
-                    mediaPlaybackRequiresUserAction={false}
-                    allowsInlineMediaPlayback={true}
-                    source={{uri: `https://www.youtube.com/embed/${this.props.pvId}?playsinline=1`}}
-                />
+
+                {this.state.appState == 'active' &&
+                    <WebView
+                        style={{flex:1}}
+                        javaScriptEnabled={true}
+                        mediaPlaybackRequiresUserAction={true}
+                        allowsInlineMediaPlayback={true}
+                        source={{uri: `https://www.youtube.com/embed/${this.props.pvId}?playsinline=1`}}
+                    />
+                }
+
             </View>
         )
     }