Detect home server from matrix id

src/domain/login/LoginViewModel.js

@@ -69,7 +69,8 @@ export class LoginViewModel extends ViewModel {
                         client: this._client,
                         attemptLogin: loginMethod => this.attemptLogin(loginMethod),
                         loginToken: this._loginToken
-                    })));
+                    })
+                ));
             this.emitChange("completeSSOLoginViewModel");
         }
         else {
@@ -81,26 +82,38 @@ export class LoginViewModel extends ViewModel {
         this._passwordLoginViewModel = this.track(new PasswordLoginViewModel(
             this.childOptions({
                 loginOptions: this._loginOptions,
-                attemptLogin: loginMethod => this.attemptLogin(loginMethod)
-        })));
+                attemptLogin: loginMethod => this.attemptLogin(loginMethod),
+                setHomeserver: homeserver => this.setHomeserver(homeserver)
+            })
+        ));
         this.emitChange("passwordLoginViewModel");
     }
-
+
+    _hidePasswordLogin() {
+        this._passwordLoginViewModel = null;
+        this.emitChange("passwordLoginViewModel");
+    }
+
     _showSSOLogin() {
         this._startSSOLoginViewModel = this.track(
             new StartSSOLoginViewModel(this.childOptions({loginOptions: this._loginOptions}))
         );
         this.emitChange("startSSOLoginViewModel");
     }
 
+    _hideSSOLogin() {
+        this._startSSOLoginViewModel = null;
+        this.emitChange("startSSOLoginViewModel");
+    }
+
     _showError(message) {
         this._errorMessage = message;
         this.emitChange("errorMessage");
     }
 
     _setBusy(status) {
         this._isBusy = status;
-        this._passwordLoginViewModel?.setBusy(status);
+        this._passwordLoginViewModel?.setEnabled(!status);
         this._startSSOLoginViewModel?.setBusy(status);
         this.emitChange("isBusy");
     }
@@ -116,9 +129,9 @@ export class LoginViewModel extends ViewModel {
         if (status === LoadStatus.LoginFailed) {
             return this._client.loginFailure;
         }
+        this._hidePasswordLogin()
         this._hideHomeserver = true;
         this.emitChange("hideHomeserver");
-        this._disposeViewModels();
         this._createLoadViewModel();
         return null;
     }
@@ -151,20 +164,17 @@ export class LoginViewModel extends ViewModel {
         );
     }
 
-    _disposeViewModels() {
-        this._startSSOLoginViewModel = this.disposeTracked(this._ssoLoginViewModel);
-        this._passwordLoginViewModel = this.disposeTracked(this._passwordLoginViewModel);
-        this._completeSSOLoginViewModel = this.disposeTracked(this._completeSSOLoginViewModel);
-        this.emitChange("disposeViewModels");
+    updateLoginOptions() {
+        this._passwordLoginViewModel?.setLoginOptions(this._loginOptions);
     }
 
     async setHomeserver(newHomeserver) {
         this._homeserver = newHomeserver;
+        this._passwordLoginViewModel?.setEnabled(false);
         // clear everything set by queryHomeserver
         this._loginOptions = null;
         this._queriedHomeserver = null;
         this._showError("");
-        this._disposeViewModels();
         this._abortQueryOperation = this.disposeTracked(this._abortQueryOperation);
         this.emitChange(); // multiple fields changing
         // also clear the timeout if it is still running
@@ -181,7 +191,7 @@ export class LoginViewModel extends ViewModel {
             }
         }
         this._abortHomeserverQueryTimeout = this.disposeTracked(this._abortHomeserverQueryTimeout);
-        this.queryHomeserver();
+        await this.queryHomeserver();
     }
 
     async queryHomeserver() {
@@ -211,21 +221,29 @@ export class LoginViewModel extends ViewModel {
                 return; //aborted, bail out
             } else {
                 this._loginOptions = null;
+                this._hideSSOLogin();
+                this._hidePasswordLogin();
             }
         } finally {
             this._abortQueryOperation = this.disposeTracked(this._abortQueryOperation);
             this.emitChange("isFetchingLoginOptions");
         }
+        this.updateLoginOptions();
         if (this._loginOptions) {
-            if (this._loginOptions.sso) { this._showSSOLogin(); }
-            if (this._loginOptions.password) { this._showPasswordLogin(); }
+            if (this._loginOptions.sso && !this._startSSOLoginViewModel) { this._showSSOLogin(); }
+            if (!this._loginOptions.sso && this._startSSOLoginViewModel) { this._hideSSOLogin(); }
+            if (this._loginOptions.password && !this._passwordLoginViewModel) { this._showPasswordLogin(); }
+            if (!this._loginOptions.password && this._passwordLoginViewModel) { this._hidePasswordLogin(); }
             if (!this._loginOptions.sso && !this._loginOptions.password) {
                 this._showError("This homeserver supports neither SSO nor password based login flows");
-            } 
+            }
         }
         else {
             this._showError(`Could not query login methods supported by ${this.homeserver}`);
+            this._hideSSOLogin();
+            this._hidePasswordLogin();
         }
+        this._passwordLoginViewModel?.setEnabled(false);
     }
 
     dispose() {

src/domain/login/PasswordLoginViewModel.js

@@ -24,10 +24,12 @@ export class PasswordLoginViewModel extends ViewModel {
         this._loginOptions = loginOptions;
         this._attemptLogin = attemptLogin;
         this._isBusy = false;
+        this._enabled = true;
         this._errorMessage = "";
     }
 
     get isBusy() { return this._isBusy; }
+    get isEnabled() { return this._isEnabled; }
     get errorMessage() { return this._errorMessage; }
 
     setBusy(status) {
@@ -39,10 +41,56 @@ export class PasswordLoginViewModel extends ViewModel {
         this._errorMessage = message;
         this.emitChange("errorMessage");
     }
+
+    setLoginOptions(loginOptions) {
+        this._loginOptions = loginOptions;
+    }
+
+    setEnabled(enabled) {
+        this._enabled = enabled;
+        this.emitChange("isEnabled");
+    }
+
+    findHomeserverFromUserid (userid) {
+        const matches = userid.match(/@.*:(.+)/);
+        if (!matches) {
+            return;
+        }
+        const [, homeserverInMxid] = matches;
+        return homeserverInMxid;
+    }
+
+    findUsernameFromUsertext (userid) {
+        const matches = userid.match(/@(.+):.*/);
+        if (!matches) {
+            return userid;
+        }
+        const [, username] = matches;
+        return username;
+    }
+
+    async changeHomeserverFromUserid(userid) {
+        const currentHomeserver = this._loginOptions.homeserver;
+        const newHomeserver = this.findHomeserverFromUserid(userid);
+        if (this._loginOptions.homeserver != newHomeserver && newHomeserver) {
+            await this._options.setHomeserver(newHomeserver);
+            return true;
+        }
+        return false;
+    }
 
+    async parseUsernameLogin (username) {
+        await this.changeHomeserverFromUserid(username);
+        return this.findUsernameFromUsertext(username);
+    }
+
     async login(username, password) {
-        this._errorMessage = "";
-        this.emitChange("errorMessage");
+        this.setBusy(true);
+        username = await this.parseUsernameLogin(username);
+        if (!this._loginOptions) {
+            return;
+        }
+        this._showError("");
         const status = await this._attemptLogin(this._loginOptions.password(username, password));
         let error = "";
         switch (status) {
@@ -57,7 +105,9 @@ export class PasswordLoginViewModel extends ViewModel {
                 break;
         }
         if (error) {
+            console.log(error);
             this._showError(error);
         }
+        this.setBusy(false);
     }
 }

src/matrix/common.js

@@ -22,16 +22,16 @@ export function makeTxnId() {
 }
 
 export function isTxnId(txnId) {
-	return txnId.startsWith("t") && txnId.length === 15;
+    return txnId.startsWith("t") && txnId.length === 15;
 }
 
 export function tests() {
-	return {
-		"isTxnId succeeds on result of makeTxnId": assert => {
-			assert(isTxnId(makeTxnId()));
-		},
-		"isTxnId fails on event id": assert => {
-			assert(!isTxnId("$yS_n5n3cIO2aTtek0_2ZSlv-7g4YYR2zKrk2mFCW_rm"));
-		},
-	}
+    return {
+        "isTxnId succeeds on result of makeTxnId": assert => {
+            assert(isTxnId(makeTxnId()));
+        },
+        "isTxnId fails on event id": assert => {
+            assert(!isTxnId("$yS_n5n3cIO2aTtek0_2ZSlv-7g4YYR2zKrk2mFCW_rm"));
+        },
+    }
 }

src/platform/web/ui/login/LoginView.js

@@ -41,7 +41,7 @@ export class LoginView extends TemplateView {
                         id: "homeserver",
                         type: "text",
                         placeholder: vm.i18n`Your matrix homeserver`,
-                        value: vm.homeserver,
+                        value: vm => vm.homeserver,
                         disabled,
                         onInput: event => vm.setHomeserver(event.target.value),
                         onChange: () => vm.queryHomeserver(),

src/platform/web/ui/login/PasswordLoginView.js

@@ -18,7 +18,7 @@ import {TemplateView} from "../general/TemplateView";
 
 export class PasswordLoginView extends TemplateView {
     render(t, vm) {
-        const disabled = vm => !!vm.isBusy;
+        const disabled = vm => vm.isBusy && vm.isEnabled;
         const username = t.input({
             id: "username",
             type: "text",
@@ -32,25 +32,30 @@ export class PasswordLoginView extends TemplateView {
             disabled
         });
 
-        return t.div({className: "PasswordLoginView form"}, [
-            t.if(vm => vm.error, t => t.div({ className: "error" }, vm => vm.error)),
-            t.form({
-                onSubmit: evnt => {
-                    evnt.preventDefault();
-                    vm.login(username.value, password.value);
-                }
-            }, [
-                t.if(vm => vm.errorMessage, (t, vm) => t.p({className: "error"}, vm.i18n(vm.errorMessage))),
-                t.div({ className: "form-row text" }, [t.label({ for: "username" }, vm.i18n`Username`), username]),
-                t.div({ className: "form-row text" }, [t.label({ for: "password" }, vm.i18n`Password`), password]),
-                t.div({ className: "button-row" }, [
-                    t.button({
-                        className: "button-action primary",
-                        type: "submit",
-                        disabled
-                    }, vm.i18n`Log In`),
-                ]),
-            ])
+        return t.div({
+            className: { 
+                PasswordLoginView: true, 
+                form: true, 
+                disabled: disabled
+            }}, [
+                t.if(vm => vm.error, t => t.div({ className: "error" }, vm => vm.error)),
+                t.form({
+                    onSubmit: evnt => {
+                        evnt.preventDefault();
+                        vm.login(username.value, password.value);
+                    }
+                }, [
+                    t.if(vm => vm.errorMessage, (t, vm) => t.p({className: "error"}, vm.i18n(vm.errorMessage))),
+                    t.div({ className: "form-row text" }, [t.label({ for: "username" }, vm.i18n`Username`), username]),
+                    t.div({ className: "form-row text" }, [t.label({ for: "password" }, vm.i18n`Password`), password]),
+                    t.div({ className: "button-row" }, [
+                        t.button({
+                            className: "button-action primary",
+                            type: "submit",
+                            disabled
+                        }, vm.i18n`Log In`),
+                    ]),
+                ])
         ]);
     }
 }