Merge pull request #50 from lbryio/hide-watch-button

Hide Watch button for non-video content everywhere, not just My Files page

js/lbry.js

@@ -283,21 +283,25 @@ lbry.imagePath = function(file)
   return lbry.rootPath + '/img/' + file;
 }
 
-lbry.getMediaType = function(filename) {
+lbry.getMediaType = function(contentType, fileName) {
-  var dotIndex = filename.lastIndexOf('.');
+  if (contentType) {
-  if (dotIndex == -1) {
+    return /^[^/]+/.exec(contentType);
-    return 'unknown';
-  }
-
-  var ext = filename.substr(dotIndex + 1);
-  if (/^mp4|mov|m4v|flv|f4v$/i.test(ext)) {
-    return 'video';
-  } else if (/^mp3|m4a|aac|wav|flac|ogg$/i.test(ext)) {
-    return 'audio';
-  } else if (/^html|htm|pdf|odf|doc|docx|md|markdown|txt$/i.test(ext)) {
-    return 'document';
   } else {
-    return 'unknown';
+    var dotIndex = filename.lastIndexOf('.');
+    if (dotIndex == -1) {
+      return 'unknown';
+    }
+
+    var ext = filename.substr(dotIndex + 1);
+    if (/^mp4|mov|m4v|flv|f4v$/i.test(ext)) {
+      return 'video';
+    } else if (/^mp3|m4a|aac|wav|flac|ogg$/i.test(ext)) {
+      return 'audio';
+    } else if (/^html|htm|pdf|odf|doc|docx|md|markdown|txt$/i.test(ext)) {
+      return 'document';
+    } else {
+      return 'unknown';
+    }
   }
 }
 

js/page/discover.js

@@ -105,7 +105,7 @@ var SearchResultRow = React.createClass({
             <div className="meta"><a href={'/?show=' + this.props.name}>lbry://{this.props.name}</a></div>
             <h3 style={searchRowTitleStyle}><a href={'/?show=' + this.props.name}>{this.props.title}</a></h3>
             <div>
-              <WatchLink streamName={this.props.name} button="primary" />
+              {this.props.mediaType == 'video' ? <WatchLink streamName={this.props.name} button="primary" /> : null}
               <DownloadLink streamName={this.props.name} button="text" />
             </div>
             <p style={searchRowDescriptionStyle}>{this.props.description}</p>
@@ -175,8 +175,8 @@ var FeaturedContentItem = React.createClass({
 
     return (<div style={featuredContentItemContainerStyle}>
       <SearchResultRow name={this.props.name} title={this.state.title} imgUrl={this.state.metadata.thumbnail || '/img/default-thumb.svg'}
-                 description={this.state.metadata.description} cost={this.state.amount} nsfw={this.state.metadata.nsfw}
+                 description={this.state.metadata.description} mediaType={lbry.getMediaType(this.state.metadata.content_type)}
-                 available={this.state.available} />
+                 cost={this.state.amount} nsfw={this.state.metadata.nsfw} available={this.state.available} />
     </div>);
   }
 });

js/page/my_files.js

@@ -195,7 +195,9 @@ var MyFilesPage = React.createClass({
         }
 
         var ratioLoaded = written_bytes / total_bytes;
-        var showWatchButton = (lbry.getMediaType(file_name) == 'video' || lbry.getMediaType(file_name) == 'audio');
+
+        var mediaType = lbry.getMediaType(metadata.content_type, file_name);
+        var showWatchButton = (mediaType == 'video');
 
         content.push(<MyFilesRow key={lbry_uri} lbryUri={lbry_uri} title={title || ('lbry://' + lbry_uri)} completed={completed} stopped={stopped}
                                  ratioLoaded={ratioLoaded} imgUrl={thumbnail} path={download_path}

js/page/show.js

@@ -24,6 +24,7 @@ var FormatItem = React.createClass({
     var language = claimInfo.language;
     var license = claimInfo.license;
     var fileContentType = (claimInfo.content_type || claimInfo['content-type']);
+    var mediaType = lbry.getMediaType(fileContentType);
     var available = this.props.available;
     var amount = this.props.amount || 0.0;
 
@@ -56,7 +57,7 @@ var FormatItem = React.createClass({
             </table>
           </section>
           <section>
-            <WatchLink streamName={this.props.name} button="primary" />
+            {mediaType == 'video' ? <WatchLink streamName={this.props.name} button="primary" /> : null}
             <DownloadLink streamName={this.props.name} button="alt" />
           </section>
         </div>