Merge pull request #96 from lbryio/play-press-area

enable pressing the entire media container area to play or download content

src/component/fileDownloadButton/view.js

@@ -73,9 +73,7 @@ class FileDownloadButton extends React.PureComponent {
           onLayout={onButtonLayout}
           style={[style, fileDownloadButtonStyle.container]}
           onPress={() => {
-            if (NativeModules.Firebase) {
             NativeModules.Firebase.track('purchase_uri', { uri: uri });
-            }
             purchaseUri(uri, costInfo, !isPlayable);
             if (NativeModules.UtilityModule) {
               NativeModules.UtilityModule.checkDownloads();

src/index.js

@@ -56,6 +56,7 @@ window.__ = __;
 
 const globalExceptionHandler = (error, isFatal) => {
   if (error && NativeModules.Firebase) {
+    console.log(error);
     NativeModules.Firebase.logException(isFatal, error.message ? error.message : 'No message', JSON.stringify(error));
   }
 };

src/page/file/view.js

@@ -692,6 +692,17 @@ class FilePage extends React.PureComponent {
     }
   };
 
+  onMediaContainerPressed = () => {
+    const { costInfo, contentType, purchaseUri } = this.props;
+    const { uri } = this.state;
+    const mediaType = Lbry.getMediaType(contentType);
+    const isPlayable = mediaType === 'video' || mediaType === 'audio';
+    purchaseUri(uri, costInfo, isPlayable);
+    if (isPlayable) {
+      this.onFileDownloadButtonPlayed();
+    }
+  };
+
   render() {
     const {
       balance,
@@ -885,7 +896,11 @@ class FilePage extends React.PureComponent {
               }
               onLayout={this.checkOrientation}
             >
-              <View style={filePageStyle.mediaContainer}>
+              <TouchableOpacity
+                activeOpacity={0.5}
+                style={filePageStyle.mediaContainer}
+                onPress={this.onMediaContainerPressed}
+              >
                 {(canOpen || (!fileInfo || (isPlayable && !canLoadMedia)) || (!canOpen && fileInfo)) && (
                   <FileItemMedia
                     duration={duration}
@@ -944,7 +959,7 @@ class FilePage extends React.PureComponent {
                 <TouchableOpacity style={filePageStyle.backButton} onPress={this.onBackButtonPressed}>
                   <Icon name={'arrow-left'} size={18} style={filePageStyle.backButtonIcon} />
                 </TouchableOpacity>
-              </View>
+              </TouchableOpacity>
               {(this.state.streamingMode || (canLoadMedia && fileInfo && isPlayable)) && (
                 <View
                   style={playerBgStyle}