Add spinner

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-08-20 22:18:24 +05:30
parent 82067ca6f5
commit a5985cba2a
3 changed files with 11 additions and 3 deletions

View File

@ -39,6 +39,7 @@ export class LoginViewModel extends ViewModel {
this._errorMessage = "";
this._hideHomeserver = false;
this._isBusy = false;
this._isFetchingLoginOptions = false;
this._createViewModels(this._homeserver);
}
@ -51,6 +52,7 @@ export class LoginViewModel extends ViewModel {
get cancelUrl() { return this.urlCreator.urlForSegment("session"); }
get loadViewModel() {return this._loadViewModel; }
get isBusy() { return this._isBusy; }
get isFetchingLoginOptions() { return this._isFetchingLoginOptions; }
async _createViewModels(homeserver) {
if (this._loginToken) {
@ -67,11 +69,15 @@ export class LoginViewModel extends ViewModel {
else {
this._errorMessage = "";
try {
this._isFetchingLoginOptions = true;
this.emitChange("isFetchingLoginOptions");
this._loginOptions = await this._sessionContainer.queryLogin(homeserver);
}
catch (e) {
this._loginOptions = null;
}
this._isFetchingLoginOptions = false;
this.emitChange("isFetchingLoginOptions");
if (this._loginOptions) {
if (this._loginOptions.sso) { this._showSSOLogin(); }
if (this._loginOptions.password) { this._showPasswordLogin(); }

View File

@ -54,15 +54,15 @@ limitations under the License.
padding: 0 0.4em 0.4em;
}
.SessionLoadStatusView {
.SessionLoadStatusView, .LoginView_query-spinner {
display: flex;
}
.SessionLoadStatusView> :not(:first-child) {
.SessionLoadStatusView> :not(:first-child), .LoginView_query-spinner> :not(:first-child) {
margin-left: 12px;
}
.SessionLoadStatusView p {
.SessionLoadStatusView p, .LoginView_query-spinner p {
flex: 1;
margin: 0;
}

View File

@ -19,6 +19,7 @@ import {hydrogenGithubLink} from "./common.js";
import {PasswordLoginView} from "./PasswordLoginView.js";
import {CompleteSSOView} from "./CompleteSSOView.js";
import {SessionLoadStatusView} from "./SessionLoadStatusView.js";
import {spinner} from "../common.js";
export class LoginView extends TemplateView {
render(t, vm) {
@ -41,6 +42,7 @@ export class LoginView extends TemplateView {
})
]
)),
t.if(vm => vm.isFetchingLoginOptions, t => t.div({className: "LoginView_query-spinner"}, [spinner(t), t.p("Fetching available login options...")])),
t.mapView(vm => vm.passwordLoginViewModel, vm => vm ? new PasswordLoginView(vm): null),
t.if(vm => vm.passwordLoginViewModel && vm.startSSOLoginViewModel, t => t.p({className: "LoginView_separator"}, vm.i18n`or`)),
t.mapView(vm => vm.startSSOLoginViewModel, vm => vm ? new StartSSOLoginView(vm) : null),