connection changes and changelog

CHANGELOG.md

@@ -8,14 +8,17 @@ Web UI version numbers should always match the corresponding version of LBRY App
 
 ## [Unreleased]
 ### Added
-  *
+  * 
   *
 
 ### Changed
-  *
+  * Video player switched from plyr to render-media
   *
 
 ### Fixed
+  * Video player should behave better on streaming
+  * Daemon times out more quickly when it cannot start
+  * Connection should fail more cleanly, rather than get stuck entirely
   * Closing modal dialogs was broken on some download and stream errors
   * Discover landing page improperly showed loading error when it was loading correctly
 

ui/js/component/load_screen.js

@@ -31,9 +31,11 @@ class LoadScreen extends React.Component {
         <img src={imgSrc} alt="LBRY"/>
         <div className="load-screen__message">
           <h3>
-            <BusyMessage message={this.props.message} />
+            {!this.props.isWarning ?
+              <BusyMessage message={this.props.message} /> :
+              <span><Icon icon="icon-warning" />{' ' + this.props.message}</span> }
           </h3>
-          {this.props.isWarning ? <Icon icon="icon-warning" /> : null} <span className={'load-screen__details ' + (this.props.isWarning ? 'load-screen__details--warning' : '')}>{this.props.details}</span>
+          <span className={'load-screen__details ' + (this.props.isWarning ? 'load-screen__details--warning' : '')}>{this.props.details}</span>
         </div>
       </div>
     );

ui/js/component/splash.js

@@ -13,6 +13,7 @@ export class SplashScreen extends React.Component {
 
     this.state = {
       details: 'Starting daemon',
+      message: "Connecting",
       isLagging: false,
     };
   }
@@ -29,11 +30,12 @@ export class SplashScreen extends React.Component {
       // TODO: This is a hack, and the logic should live in the daemon
       // to give us a better sense of when we are actually started
       this.setState({
-        details: 'Waiting for name resolution',
+        message: "Testing Network",
+        details: "Waiting for name resolution",
         isLagging: false
       });
 
-      lbry.resolve({uri: 'lbry://one'}).then(() => {
+      lbry.resolve({uri: "lbry://one"}).then(() => {
         this.props.onLoadDone();
       });
       return;
@@ -48,21 +50,19 @@ export class SplashScreen extends React.Component {
   }
 
   componentDidMount() {
-    lbry.connect().then((isConnected) => {
-      if (isConnected) {
-        this.updateStatus();
-      } else {
+    lbry.connect()
+      .then(() => { this.updateStatus() })
+      .catch(() => {
         this.setState({
           isLagging: true,
-          message: "Failed to connect to LBRY",
-          details: "LBRY was unable to start and connect properly."
+          message: "Connection Failure",
+          details: "Try closing all LBRY processes and starting again. If this still happpens, your anti-virus software or firewall may be preventing LBRY from connecting. Contact hello@lbry.io if you think this is a software bug."
         })
-      }
-    })
+      })
   }
 
   render() {
-    return <LoadScreen message={this.props.message} details={this.state.details} isWarning={this.state.isLagging} />
+    return <LoadScreen message={this.state.message} details={this.state.details} isWarning={this.state.isLagging} />
   }
 }
 

ui/js/lbry.js

@@ -95,26 +95,27 @@ lbry.call = function (method, params, callback, errorCallback, connectFailedCall
 lbry._connectPromise = null;
 lbry.connect = function() {
   if (lbry._connectPromise === null) {
-
     lbry._connectPromise = new Promise((resolve, reject) => {
 
+      let tryNum = 0
+
+      function checkDaemonStartedFailed() {
+        console.log('status error try num ' + tryNum)
+        if (tryNum <= 100) { // Move # of tries into constant or config option
+          setTimeout(() => {
+            tryNum++
+            checkDaemonStarted();
+          }, tryNum < 50 ? 400 : 1000);
+        }
+        else {
+          reject(new Error("Unable to connect to LBRY"));
+        }
+      }
+
       // Check every half second to see if the daemon is accepting connections
-      function checkDaemonStarted(tryNum = 0) {
-        lbry.isDaemonAcceptingConnections(function (runningStatus) {
-          if (runningStatus) {
-            resolve(true);
-          }
-          else {
-            if (tryNum <= 600) { // Move # of tries into constant or config option
-              setTimeout(function () {
-                checkDaemonStarted(tryNum + 1);
-              }, tryNum < 100 ? 200 : 1000);
-            }
-            else {
-              reject(new Error("Unable to connect to LBRY"));
-            }
-          }
-        });
+      function checkDaemonStarted() {
+        console.log('check daemon started try ' + tryNum)
+        lbry.call('status', {}, resolve, checkDaemonStartedFailed, checkDaemonStartedFailed)
       }
 
       checkDaemonStarted();
@@ -124,11 +125,6 @@ lbry.connect = function() {
   return lbry._connectPromise;
 }
 
-lbry.isDaemonAcceptingConnections = function (callback) {
-  // Returns true/false whether the daemon is at a point it will start returning status
-  lbry.call('status', {}, () => callback(true), null, () => callback(false))
-};
-
 lbry.checkAddressIsMine = function(address, callback) {
   lbry.call('address_is_mine', {address: address}, callback);
 }

ui/js/main.js

@@ -89,7 +89,7 @@ var init = function() {
   if (window.sessionStorage.getItem('loaded') == 'y') {
     onDaemonReady();
   } else {
-    ReactDOM.render(<SplashScreen message="Connecting" onLoadDone={onDaemonReady} />, canvas);
+    ReactDOM.render(<SplashScreen onLoadDone={onDaemonReady} />, canvas);
   }
 };