allow registration and login from guest to be cancellable

src/components/structures/MatrixChat.js

@@ -226,10 +226,14 @@ module.exports = React.createClass({
         switch (payload.action) {
             case 'logout':
                 if (window.localStorage) {
+                    var hsUrl = this.getCurrentHsUrl();
+                    var isUrl = this.getCurrentIsUrl();
                     window.localStorage.clear();
                     // preserve our HS & IS URLs for convenience
-                    window.localStorage.setItem("mx_hs_url", this.getCurrentHsUrl());
-                    window.localStorage.setItem("mx_is_url", this.getCurrentIsUrl());
+                    // N.B. we cache them in hsUrl/isUrl and can't really inline them
+                    // as getCurrentHsUrl() may call through to localStorage.
+                    window.localStorage.setItem("mx_hs_url", hsUrl);
+                    window.localStorage.setItem("mx_is_url", isUrl);
                 }
                 Notifier.stop();
                 UserActivity.stop();
@@ -275,11 +279,31 @@ module.exports = React.createClass({
                     screen: 'post_registration'
                 });
                 break;
+            case 'start_login_from_guest':
+                this.replaceState({
+                    screen: 'login',
+                    guestCreds: { // stash our guest creds so we can backout if needed
+                        userId: MatrixClientPeg.get().credentials.userId,
+                        accessToken: MatrixClientPeg.get().getAccessToken(),
+                        homeserverUrl: MatrixClientPeg.get().getHomeserverUrl(),
+                        identityServerUrl: MatrixClientPeg.get().getIdentityServerUrl(),
+                        guest: true
+                    }
+                });
+                this.notifyNewScreen('login');
+                break;            
             case 'start_upgrade_registration':
                 this.replaceState({
                     screen: "register",
                     upgradeUsername: MatrixClientPeg.get().getUserIdLocalpart(),
-                    guestAccessToken: MatrixClientPeg.get().getAccessToken()
+                    guestAccessToken: MatrixClientPeg.get().getAccessToken(),
+                    guestCreds: { // stash our guest creds so we can backout if needed
+                        userId: MatrixClientPeg.get().credentials.userId,
+                        accessToken: MatrixClientPeg.get().getAccessToken(),
+                        homeserverUrl: MatrixClientPeg.get().getHomeserverUrl(),
+                        identityServerUrl: MatrixClientPeg.get().getIdentityServerUrl(),
+                        guest: true
+                    }
                 });
                 this.notifyNewScreen('register');
                 break;
@@ -858,6 +882,11 @@ module.exports = React.createClass({
         this.showScreen("forgot_password");
     },
 
+    onReturnToGuestClick: function() {
+        // reanimate our guest login
+        this.onLoggedIn(this.state.guestCreds);
+    },
+
     onRegistered: function(credentials) {
         this.onLoggedIn(credentials);
         // do post-registration stuff
@@ -1042,7 +1071,9 @@ module.exports = React.createClass({
                     registrationUrl={this.props.registrationUrl}
                     onLoggedIn={this.onRegistered}
                     onLoginClick={this.onLoginClick}
-                    onRegisterClick={this.onRegisterClick} />
+                    onRegisterClick={this.onRegisterClick}
+                    onCancelClick={ MatrixClientPeg.get() && MatrixClientPeg.get().isGuest() ? this.onReturnToGuestClick : null }
+                    />
             );
         } else if (this.state.screen == 'forgot_password') {
             return (
@@ -1065,6 +1096,7 @@ module.exports = React.createClass({
                     customIsUrl={this.getCurrentIsUrl()}
                     onForgotPasswordClick={this.onForgotPasswordClick} 
                     onLoginAsGuestClick={this.props.enableGuest && this.props.config && this.props.config.default_hs_url ? this._registerAsGuest: undefined}
+                    onCancelClick={ MatrixClientPeg.get() && MatrixClientPeg.get().isGuest() ? this.onReturnToGuestClick : null }
                     />
             );
         }

src/components/structures/login/Login.js

@@ -42,6 +42,7 @@ module.exports = React.createClass({displayName: 'Login',
         // login shouldn't care how password recovery is done.
         onForgotPasswordClick: React.PropTypes.func,
         onLoginAsGuestClick: React.PropTypes.func,
+        onCancelClick: React.PropTypes.func,
     },
 
     getInitialState: function() {
@@ -211,6 +212,15 @@ module.exports = React.createClass({displayName: 'Login',
                     Login as guest
                 </a>
         }
+
+        var returnToAppJsx;
+        if (this.props.onCancelClick) {
+            returnToAppJsx = 
+                <a className="mx_Login_create" onClick={this.props.onCancelClick} href="#">
+                    Return to app
+                </a>
+        }
+
         return (
             <div className="mx_Login">
                 <div className="mx_Login_box">
@@ -235,6 +245,7 @@ module.exports = React.createClass({displayName: 'Login',
                             Create a new account
                         </a>
                         { loginAsGuestJsx }
+                        { returnToAppJsx }
                         <LoginFooter />
                     </div>
                 </div>

src/components/structures/login/Registration.js

@@ -45,7 +45,8 @@ module.exports = React.createClass({
         guestAccessToken: React.PropTypes.string,
         disableUsernameChanges: React.PropTypes.bool,
         // registration shouldn't know or care how login is done.
-        onLoginClick: React.PropTypes.func.isRequired
+        onLoginClick: React.PropTypes.func.isRequired,
+        onCancelClick: React.PropTypes.func
     },
 
     getInitialState: function() {
@@ -234,6 +235,15 @@ module.exports = React.createClass({
                 <Spinner />
             );
         }
+
+        var returnToAppJsx;
+        if (this.props.onCancelClick) {
+            returnToAppJsx = 
+                <a className="mx_Login_create" onClick={this.props.onCancelClick} href="#">
+                    Return to app
+                </a>
+        }
+
         return (
             <div>
                 <h2>Create an account</h2>
@@ -254,6 +264,7 @@ module.exports = React.createClass({
                 <a className="mx_Login_create" onClick={this.props.onLoginClick} href="#">
                     I already have an account
                 </a>
+                { returnToAppJsx }
             </div>
         );
     },