From 0c3cc55a317bc088ac3ccd4668b3374b090d11e2 Mon Sep 17 00:00:00 2001
From: Alex Liebowitz <alex@alexliebowitz.com>
Date: Thu, 21 Apr 2016 06:55:41 -0400
Subject: [PATCH] Fix "Download" link; also notify user and disable link on
 click.

---
 js/component/common.js |  2 +-
 js/page/home.js        | 18 +++++++++++++++++-
 scss/_gui.scss         |  5 +++++
 3 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/js/component/common.js b/js/component/common.js
index 968c7505c..c1dd5610e 100644
--- a/js/component/common.js
+++ b/js/component/common.js
@@ -16,7 +16,7 @@ var Link = React.createClass({
     var href = this.props.href ? this.props.href : 'javascript:;',
       icon = this.props.icon ? <Icon icon={this.props.icon} />  : '',
       className = (this.props.button ? 'button-block button-' + this.props.button : 'button-text') +
-                  (this.props.hidden ? ' hidden' : '');
+                  (this.props.hidden ? ' hidden' : '') + (this.props.disabled ? ' disabled' : '');
     return (
       <a className={className} href={href} style={this.props.style ? this.props.style : {}} onClick={this.props.onClick}>
         {this.props.icon ? icon : '' }
diff --git a/js/page/home.js b/js/page/home.js
index 2a8877b8f..c9ffceb85 100644
--- a/js/page/home.js
+++ b/js/page/home.js
@@ -87,6 +87,21 @@ var searchRowImgStyle = {
 
 
 var SearchResultRow = React.createClass({
+  getInitialState: function() {
+    return {
+      downloading: false
+    }
+  },
+  startDownload: function() {
+    if (!this.state.downloading) {
+      this.setState({
+        downloading: true
+      });
+      lbry.getStream(this.props.name, (streamInfo) => {
+        alert('Downloading ' + this.props.title + ' to ' + streamInfo.path);
+      });
+    }
+  },
   render: function() {
     var displayURI = 'lbry://' + this.props.name;
 
@@ -111,7 +126,8 @@ var SearchResultRow = React.createClass({
           <p style={searchRowDescriptionStyle}>{this.props.description}</p>
           <div>
             <Link href={linkURI} label="Watch" icon="icon-play" button="primary" />
-            <Link href={linkURI} label="Download" icon="icon-download" button="alt" />
+            <Link onClick={this.startDownload} label={this.state.downloading ? "Downloading" : "Download"}
+                  disabled={this.state.downloading} icon="icon-download" button="alt" />
           </div>
         </div>
       </div>
diff --git a/scss/_gui.scss b/scss/_gui.scss
index 07df70b4c..40de8cff8 100644
--- a/scss/_gui.scss
+++ b/scss/_gui.scss
@@ -44,6 +44,11 @@ header
   display: none;
 }
 
+.disabled {
+  pointer-events: none;
+  opacity: 0.7;
+}
+
 input[type="search"]
 {
   border: 0 none;