MOBILE-4201 login: Show error message if check site fails
Pau Ferrer Ocaña
parent
663f42de2a
commit
9c2133bd73
|
|
@ -20,82 +20,92 @@
|
|||
</ion-header>
|
||||
<ion-content class="ion-padding limited-width">
|
||||
<core-loading [hideUntil]="pageLoaded">
|
||||
<div class="ion-text-wrap ion-text-center core-login-info-box">
|
||||
<div class="core-login-site">
|
||||
<div class="core-login-site-logo">
|
||||
<!-- Show site logo or a default image. -->
|
||||
<img *ngIf="logoUrl" [src]="logoUrl" role="presentation" alt="" onError="this.src='assets/img/login_logo.png'">
|
||||
<img *ngIf="!logoUrl" src="assets/img/login_logo.png" role="presentation" alt="">
|
||||
<ng-container *ngIf="!siteCheckError">
|
||||
<div class="ion-text-wrap ion-text-center core-login-info-box">
|
||||
<div class="core-login-site">
|
||||
<div class="core-login-site-logo">
|
||||
<!-- Show site logo or a default image. -->
|
||||
<img *ngIf="logoUrl" [src]="logoUrl" role="presentation" alt="" onError="this.src='assets/img/login_logo.png'">
|
||||
<img *ngIf="!logoUrl" src="assets/img/login_logo.png" role="presentation" alt="">
|
||||
</div>
|
||||
|
||||
<h2 *ngIf="siteName" class="ion-margin-top ion-no-padding core-sitename">
|
||||
<core-format-text [text]="siteName" [filter]="false"></core-format-text>
|
||||
</h2>
|
||||
<p class="core-siteurl">{{siteUrl}}</p>
|
||||
</div>
|
||||
|
||||
<h2 *ngIf="siteName" class="ion-margin-top ion-no-padding core-sitename">
|
||||
<core-format-text [text]="siteName" [filter]="false"></core-format-text>
|
||||
</h2>
|
||||
<p class="core-siteurl">{{siteUrl}}</p>
|
||||
<core-login-exceeded-attempts *ngIf="exceededAttemptsHTML && supportConfig && loginAttempts >= 3"
|
||||
[supportConfig]="supportConfig" [supportSubject]="'core.login.exceededloginattemptssupportsubject' | translate">
|
||||
<div [innerHTML]="exceededAttemptsHTML" (click)="exceededAttemptsClicked($event)"></div>
|
||||
</core-login-exceeded-attempts>
|
||||
</div>
|
||||
|
||||
<core-login-exceeded-attempts *ngIf="exceededAttemptsHTML && supportConfig && loginAttempts >= 3"
|
||||
[supportConfig]="supportConfig" [supportSubject]="'core.login.exceededloginattemptssupportsubject' | translate">
|
||||
<div [innerHTML]="exceededAttemptsHTML" (click)="exceededAttemptsClicked($event)"></div>
|
||||
</core-login-exceeded-attempts>
|
||||
</div>
|
||||
|
||||
<div class="core-login-methods">
|
||||
<form [formGroup]="credForm" (ngSubmit)="login($event)" class="core-login-form" #credentialsForm *ngIf="!isBrowserSSO">
|
||||
<ion-item>
|
||||
<ion-label class="sr-only">{{ 'core.login.username' | translate }}</ion-label>
|
||||
<ion-input type="text" name="username" placeholder="{{ 'core.login.username' | translate }}" formControlName="username"
|
||||
autocapitalize="none" autocorrect="off" autocomplete="username" enterkeyhint="next" required="true">
|
||||
</ion-input>
|
||||
</ion-item>
|
||||
<ion-item class="ion-margin-bottom">
|
||||
<ion-label class="sr-only">{{ 'core.login.password' | translate }}</ion-label>
|
||||
<core-show-password name="password">
|
||||
<ion-input name="password" type="password" placeholder="{{ 'core.login.password' | translate }}"
|
||||
formControlName="password" [clearOnEdit]="false" autocomplete="current-password" enterkeyhint="go"
|
||||
<div class="core-login-methods">
|
||||
<form [formGroup]="credForm" (ngSubmit)="login($event)" class="core-login-form" #credentialsForm *ngIf="!isBrowserSSO">
|
||||
<ion-item>
|
||||
<ion-label class="sr-only">{{ 'core.login.username' | translate }}</ion-label>
|
||||
<ion-input type="text" name="username" placeholder="{{ 'core.login.username' | translate }}"
|
||||
formControlName="username" autocapitalize="none" autocorrect="off" autocomplete="username" enterkeyhint="next"
|
||||
required="true">
|
||||
</ion-input>
|
||||
</core-show-password>
|
||||
</ion-item>
|
||||
<ion-item class="ion-margin-bottom">
|
||||
<ion-label class="sr-only">{{ 'core.login.password' | translate }}</ion-label>
|
||||
<core-show-password name="password">
|
||||
<ion-input name="password" type="password" placeholder="{{ 'core.login.password' | translate }}"
|
||||
formControlName="password" [clearOnEdit]="false" autocomplete="current-password" enterkeyhint="go"
|
||||
required="true">
|
||||
</ion-input>
|
||||
</core-show-password>
|
||||
</ion-item>
|
||||
<ion-button expand="block" type="submit" [disabled]="!credForm.valid"
|
||||
class="ion-margin core-login-login-button ion-text-wrap">
|
||||
{{ 'core.login.loginbutton' | translate }}
|
||||
</ion-button>
|
||||
<!-- Remove this once Ionic fixes this bug: https://github.com/ionic-team/ionic-framework/issues/19368 -->
|
||||
<input type="submit" class="core-submit-hidden-enter" />
|
||||
|
||||
<!-- Forgotten password option. -->
|
||||
<ion-button *ngIf="showForgottenPassword" expand="block" fill="clear"
|
||||
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
|
||||
{{ 'core.login.forgotten' | translate }}
|
||||
</ion-button>
|
||||
</form>
|
||||
|
||||
<ng-container *ngIf="isBrowserSSO">
|
||||
<ion-button expand="block" (click)="openBrowserSSO()"
|
||||
class="ion-margin core-login-login-inbrowser-button ion-text-wrap">
|
||||
{{ 'core.login.loginbutton' | translate }}
|
||||
<ion-icon name="fas-up-right-from-square" slot="end" aria-hidden="true"></ion-icon>
|
||||
</ion-button>
|
||||
<p class="text-center core-login-inbrowser">{{ 'core.openinbrowserdescription' | translate }}</p>
|
||||
</ng-container>
|
||||
|
||||
|
||||
<core-login-methods *ngIf="siteConfig" [siteConfig]="siteConfig" [siteUrl]="siteUrl"></core-login-methods>
|
||||
</div>
|
||||
|
||||
<div class="core-login-sign-up" *ngIf="canSignup || authInstructions">
|
||||
<h2>{{ 'core.login.firsttime' | translate }}</h2>
|
||||
|
||||
<ion-item class="ion-text-wrap ion-no-padding core-login-instructions">
|
||||
<ion-label>
|
||||
<core-format-text *ngIf="authInstructions" [text]="authInstructions" [filter]="false"></core-format-text>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-button expand="block" type="submit" [disabled]="!credForm.valid"
|
||||
class="ion-margin core-login-login-button ion-text-wrap">
|
||||
{{ 'core.login.loginbutton' | translate }}
|
||||
</ion-button>
|
||||
<!-- Remove this once Ionic fixes this bug: https://github.com/ionic-team/ionic-framework/issues/19368 -->
|
||||
<input type="submit" class="core-submit-hidden-enter" />
|
||||
|
||||
<!-- Forgotten password option. -->
|
||||
<ion-button *ngIf="showForgottenPassword" expand="block" fill="clear"
|
||||
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
|
||||
{{ 'core.login.forgotten' | translate }}
|
||||
</ion-button>
|
||||
</form>
|
||||
|
||||
<ng-container *ngIf="isBrowserSSO">
|
||||
<ion-button expand="block" (click)="openBrowserSSO()" class="ion-margin core-login-login-inbrowser-button ion-text-wrap">
|
||||
{{ 'core.login.loginbutton' | translate }}
|
||||
<ion-icon name="fas-up-right-from-square" slot="end" aria-hidden="true"></ion-icon>
|
||||
</ion-button>
|
||||
<p class="text-center core-login-inbrowser">{{ 'core.openinbrowserdescription' | translate }}</p>
|
||||
</ng-container>
|
||||
|
||||
|
||||
<core-login-methods *ngIf="siteConfig" [siteConfig]="siteConfig" [siteUrl]="siteUrl"></core-login-methods>
|
||||
</div>
|
||||
</div>
|
||||
<ion-button *ngIf="canSignup" expand="block" class="ion-margin ion-text-wrap" fill="outline" (click)="openEmailSignup()">
|
||||
{{ 'core.login.startsignup' | translate }}
|
||||
</ion-button>
|
||||
</ng-container>
|
||||
<core-empty-box *ngIf="siteCheckError" icon="fas-circle-exclamation" [message]="siteCheckError">
|
||||
<ion-button expand="block" (click)="checkSite()" fill="outline">
|
||||
{{ 'core.tryagain' | translate }}
|
||||
</ion-button>
|
||||
</core-empty-box>
|
||||
|
||||
<div class="core-login-sign-up" *ngIf="canSignup || authInstructions">
|
||||
<h2>{{ 'core.login.firsttime' | translate }}</h2>
|
||||
|
||||
<ion-item class="ion-text-wrap ion-no-padding core-login-instructions">
|
||||
<ion-label>
|
||||
<core-format-text *ngIf="authInstructions" [text]="authInstructions" [filter]="false"></core-format-text>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
||||
|
||||
</div>
|
||||
<ion-button *ngIf="canSignup" expand="block" class="ion-margin ion-text-wrap" fill="outline" (click)="openEmailSignup()">
|
||||
{{ 'core.login.startsignup' | translate }}
|
||||
</ion-button>
|
||||
</core-loading>
|
||||
</ion-content>
|
||||
|
|
|
|||
|
|
@ -60,6 +60,7 @@ export class CoreLoginCredentialsPage implements OnInit, OnDestroy {
|
|||
supportConfig?: CoreUserSupportConfig;
|
||||
exceededAttemptsHTML?: SafeHtml | string | null;
|
||||
siteConfig?: CoreSitePublicConfigResponse;
|
||||
siteCheckError = '';
|
||||
|
||||
protected siteCheck?: CoreSiteCheckResponse;
|
||||
protected eventThrown = false;
|
||||
|
|
@ -103,7 +104,7 @@ export class CoreLoginCredentialsPage implements OnInit, OnDestroy {
|
|||
password: ['', Validators.required],
|
||||
});
|
||||
|
||||
await this.checkSite(this.siteUrl);
|
||||
await this.checkSite();
|
||||
|
||||
if (CorePlatform.isIOS() && !this.isBrowserSSO) {
|
||||
// Make iOS auto-fill work. The field that isn't focused doesn't get updated, do it manually.
|
||||
|
|
@ -143,18 +144,17 @@ export class CoreLoginCredentialsPage implements OnInit, OnDestroy {
|
|||
* Get site config and check if it requires SSO login.
|
||||
* This should be used only if a fixed URL is set, otherwise this check is already performed in CoreLoginSitePage.
|
||||
*
|
||||
* @param siteUrl Site URL to check.
|
||||
* @returns Promise resolved when done.
|
||||
*/
|
||||
protected async checkSite(siteUrl: string): Promise<void> {
|
||||
async checkSite(): Promise<void> {
|
||||
this.pageLoaded = false;
|
||||
|
||||
// If the site is configured with http:// protocol we force that one, otherwise we use default mode.
|
||||
const protocol = siteUrl.indexOf('http://') === 0 ? 'http://' : undefined;
|
||||
const protocol = this.siteUrl.indexOf('http://') === 0 ? 'http://' : undefined;
|
||||
|
||||
try {
|
||||
if (!this.siteCheck) {
|
||||
this.siteCheck = await CoreSites.checkSite(siteUrl, protocol);
|
||||
this.siteCheck = await CoreSites.checkSite(this.siteUrl, protocol);
|
||||
}
|
||||
|
||||
this.siteUrl = this.siteCheck.siteUrl;
|
||||
|
|
@ -162,9 +162,13 @@ export class CoreLoginCredentialsPage implements OnInit, OnDestroy {
|
|||
|
||||
await this.treatSiteConfig();
|
||||
|
||||
this.siteCheckError = '';
|
||||
|
||||
// Check if user needs to authenticate in a browser.
|
||||
this.isBrowserSSO = CoreLoginHelper.isSSOLoginNeeded(this.siteCheck.code);
|
||||
} catch (error) {
|
||||
this.siteCheckError = CoreDomUtils.getErrorMessage(error) || 'Error loading site';
|
||||
|
||||
CoreDomUtils.showErrorModal(error);
|
||||
} finally {
|
||||
this.pageLoaded = true;
|
||||
|
|
|
|||
Loading…
Reference in New Issue