mirrors/vector-im-hydrogen-web
1
0
Fork 0
mirror of https://github.com/vector-im/hydrogen-web.git synced 2024-12-23 03:25:12 +01:00
Code Issues Projects Releases Wiki Activity

Add spinner

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/domain/login/LoginViewModel.js
View File

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

6
src/platform/web/ui/css/login.css
View File

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

2
src/platform/web/ui/login/LoginView.js
View File

@ -19,6 +19,7 @@ import {hydrogenGithubLink} from "./common.js";
import {PasswordLoginView} from "./PasswordLoginView.js"; import {PasswordLoginView} from "./PasswordLoginView.js";
import {CompleteSSOView} from "./CompleteSSOView.js"; import {CompleteSSOView} from "./CompleteSSOView.js";
import {SessionLoadStatusView} from "./SessionLoadStatusView.js"; import {SessionLoadStatusView} from "./SessionLoadStatusView.js";
import {spinner} from "../common.js";
export class LoginView extends TemplateView { export class LoginView extends TemplateView {
render(t, vm) { 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.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.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), t.mapView(vm => vm.startSSOLoginViewModel, vm => vm ? new StartSSOLoginView(vm) : null),