Skip to content

Commit f35ed90

Browse files
crazyservercrazyserver
committed
MOBILE-3463 login: Add url and sitefinder options for multisite
1 parent 5ab88ad commit f35ed90

File tree

2 files changed

+60
-48
lines changed

2 files changed

+60
-48
lines changed

‎src/core/login/pages/site/site.html‎

Lines changed: 56 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -14,65 +14,77 @@
1414
<div text-center padding margin-bottom [class.hidden]="hasSites || enteredSiteUrl" class="core-login-site-logo">
1515
<img src="assets/img/login_logo.png" class="avatar-full login-logo" role="presentation">
1616
</div>
17-
<form ion-list [formGroup]="siteForm" (ngSubmit)="connect($event, siteForm.value.siteUrl)" *ngIf="!fixedSites || fixedDisplay == 'select'" #siteFormEl>
17+
<form ion-list [formGroup]="siteForm" (ngSubmit)="connect($event, siteForm.value.siteUrl)" *ngIf="!fixedSites || siteSelector == 'select'" #siteFormEl>
1818
<!-- Form to input the site URL if there are no fixed sites. -->
1919
<ng-container *ngIf="!fixedSites">
20-
<ion-item>
21-
<ion-label stacked><h2>{{ 'core.login.siteaddress' | translate }}</h2></ion-label>
22-
<ion-input name="url" placeholder="https://campus.example.edu" formControlName="siteUrl" [core-auto-focus]="showKeyboard" (ionChange)="searchSite($event, siteForm.value.siteUrl)"></ion-input>
23-
</ion-item>
24-
</ng-container>
20+
<ng-container *ngIf="siteSelector == 'url'">
21+
<ion-item>
22+
<ion-label stacked><h2>{{ 'core.login.siteaddress' | translate }}</h2></ion-label>
23+
<ion-input name="url" type="url" placeholder="https://campus.example.edu" formControlName="siteUrl" [core-auto-focus]="showKeyboard"></ion-input>
24+
</ion-item>
25+
</ng-container>
26+
<ng-container *ngIf="siteSelector != 'url'">
27+
<ion-item>
28+
<ion-label stacked><h2>{{ 'core.login.siteaddress' | translate }}</h2></ion-label>
29+
<ion-input name="url" placeholder="https://campus.example.edu" formControlName="siteUrl" [core-auto-focus]="showKeyboard" (ionChange)="searchSite($event, siteForm.value.siteUrl)"></ion-input>
30+
</ion-item>
2531

26-
<ion-list *ngIf="!fixedSites" [class.hidden]="!hasSites && !enteredSiteUrl" class="core-login-site-list">
27-
<ion-item no-lines class="core-login-site-list-title"><h2 class="item-heading">{{ 'core.login.selectsite' | translate }}</h2></ion-item>
28-
<button ion-item *ngIf="enteredSiteUrl" (click)="connect($event, enteredSiteUrl.url)" [attr.aria-label]="'core.login.connect' | translate" detail-push class="core-login-entered-site">
29-
<ion-thumbnail item-start>
30-
<core-icon name="fa-pencil"></core-icon>
31-
</ion-thumbnail>
32-
<h2 text-wrap>{{ 'core.login.yourenteredsite' | translate }}</h2>
33-
<p>{{enteredSiteUrl.noProtocolUrl}}</p>
34-
</button>
32+
<ion-list [class.hidden]="!hasSites && !enteredSiteUrl" class="core-login-site-list">
33+
<ion-item no-lines class="core-login-site-list-title"><h2 class="item-heading">{{ 'core.login.selectsite' | translate }}</h2></ion-item>
34+
<button ion-item *ngIf="enteredSiteUrl" (click)="connect($event, enteredSiteUrl.url)" [attr.aria-label]="'core.login.connect' | translate" detail-push class="core-login-entered-site">
35+
<ion-thumbnail item-start>
36+
<core-icon name="fa-pencil"></core-icon>
37+
</ion-thumbnail>
38+
<h2 text-wrap>{{ 'core.login.yourenteredsite' | translate }}</h2>
39+
<p>{{enteredSiteUrl.noProtocolUrl}}</p>
40+
</button>
3541

36-
<div class="core-login-site-list-found" [class.hidden]="!hasSites" [class.dimmed]="loadingSites">
37-
<div *ngIf="loadingSites" class="core-login-site-list-loading"><ion-spinner></ion-spinner></div>
38-
<button ion-item *ngFor="let site of sites" (click)="connect($event, site.url, site)" [attr.aria-label]="site.name" detail-push>
39-
<ion-thumbnail item-start>
40-
<img [src]="site.imageurl" *ngIf="site.imageurl" onError="this.src='assets/icon/icon.png'">
41-
<img src="assets/icon/icon.png" *ngIf="!site.imageurl" class="core-login-default-icon">
42-
</ion-thumbnail>
43-
<h2 text-wrap>{{site.name}}<ng-container *ngIf="site.alias"> ({{site.alias}})</ng-container></h2>
44-
<p>{{site.noProtocolUrl}}</p>
45-
<p *ngIf="site.country || site.city" text-wrap><ng-container *ngIf="site.city">{{site.city}} - </ng-container>{{site.country}}</p>
46-
</button>
47-
</div>
48-
</ion-list>
42+
<div class="core-login-site-list-found" [class.hidden]="!hasSites" [class.dimmed]="loadingSites">
43+
<div *ngIf="loadingSites" class="core-login-site-list-loading"><ion-spinner></ion-spinner></div>
44+
<button ion-item *ngFor="let site of sites" (click)="connect($event, site.url, site)" [attr.aria-label]="site.name" detail-push>
45+
<ion-thumbnail item-start>
46+
<img [src]="site.imageurl" *ngIf="site.imageurl" onError="this.src='assets/icon/icon.png'">
47+
<img src="assets/icon/icon.png" *ngIf="!site.imageurl" class="core-login-default-icon">
48+
</ion-thumbnail>
49+
<h2 text-wrap>{{site.name}}<ng-container *ngIf="site.alias"> ({{site.alias}})</ng-container></h2>
50+
<p>{{site.noProtocolUrl}}</p>
51+
<p *ngIf="site.country || site.city" text-wrap><ng-container *ngIf="site.city">{{site.city}} - </ng-container>{{site.country}}</p>
52+
</button>
53+
</div>
54+
</ion-list>
4955

50-
<div *ngIf="!fixedSites && !hasSites && loadingSites" class="core-login-site-nolist-loading"><ion-spinner></ion-spinner></div>
56+
<div *ngIf="!hasSites && loadingSites" class="core-login-site-nolist-loading"><ion-spinner></ion-spinner></div>
57+
</ng-container>
58+
</ng-container>
5159

5260
<!-- Pick the site from a list of fixed sites. -->
53-
<ion-item *ngIf="fixedSites && fixedDisplay == 'select'" margin-vertical text-wrap>
61+
<ion-item *ngIf="fixedSites && siteSelector == 'select'" margin-vertical text-wrap>
5462
<ion-label stacked for="siteSelect">{{ 'core.login.selectsite' | translate }}</ion-label>
5563
<ion-select formControlName="siteUrl" name="url" placeholder="{{ 'core.login.siteaddress' | translate }}" interface="action-sheet">
5664
<ion-option *ngFor="let site of fixedSites" [value]="site.url">{{site.name}}</ion-option>
5765
</ion-select>
5866
</ion-item>
67+
68+
<button *ngIf="(fixedSites && siteSelector == 'select') || (!fixedSites && siteSelector == 'url')" ion-button block [disabled]="!siteForm.valid">{{ 'core.login.connect' | translate }}</button>
5969
</form>
6070

61-
<!-- Pick the site from a list of fixed sites. -->
62-
<ion-list *ngIf="fixedSites && (fixedDisplay == 'list' || fixedDisplay == 'listnourl')">
63-
<ion-item no-lines><h2 class="item-heading">{{ 'core.login.selectsite' | translate }}</h2></ion-item>
64-
<ion-searchbar *ngIf="fixedSites.length > 4" [(ngModel)]="filter" (ionInput)="filterChanged($event)" (ionCancel)="filterChanged()" [placeholder]="'core.login.findyoursite' | translate"></ion-searchbar>
65-
<ion-item *ngFor="let site of filteredSites" (click)="connect($event, site.url)" [title]="site.name" detail-push text-wrap>
66-
<h2>{{site.name}}</h2>
67-
<p *ngIf="fixedDisplay == 'list'">{{site.url}}</p>
68-
</ion-item>
69-
</ion-list>
71+
<ng-container *ngIf="fixedSites">
72+
<!-- Pick the site from a list of fixed sites. -->
73+
<ion-list *ngIf="siteSelector == 'list' || siteSelector == 'listnourl'">
74+
<ion-item no-lines><h2 class="item-heading">{{ 'core.login.selectsite' | translate }}</h2></ion-item>
75+
<ion-searchbar *ngIf="fixedSites.length > 4" [(ngModel)]="filter" (ionInput)="filterChanged($event)" (ionCancel)="filterChanged()" [placeholder]="'core.login.findyoursite' | translate"></ion-searchbar>
76+
<ion-item *ngFor="let site of filteredSites" (click)="connect($event, site.url)" [title]="site.name" detail-push text-wrap>
77+
<h2>{{site.name}}</h2>
78+
<p *ngIf="siteSelector == 'list'">{{site.url}}</p>
79+
</ion-item>
80+
</ion-list>
7081

71-
<!-- Display them using buttons. -->
72-
<div *ngIf="fixedSites && fixedDisplay == 'buttons'">
73-
<p class="padding no-padding-bottom">{{ 'core.login.selectsite' | translate }}</p>
74-
<a *ngFor="let site of fixedSites" ion-button block (click)="connect($event, site.url)" [title]="site.name" margin-bottom>{{site.name}}</a>
75-
</div>
82+
<!-- Display them using buttons. -->
83+
<div *ngIf="siteSelector == 'buttons'">
84+
<p class="padding no-padding-bottom">{{ 'core.login.selectsite' | translate }}</p>
85+
<a *ngFor="let site of fixedSites" ion-button block (click)="connect($event, site.url)" [title]="site.name" margin-bottom>{{site.name}}</a>
86+
</div>
87+
</ng-container>
7688

7789
<ng-container *ngIf="showScanQR && !hasSites && !enteredSiteUrl">
7890
<div class="core-login-site-qrcode-separator">{{ 'core.login.or' | translate }}</div>

‎src/core/login/pages/site/site.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export class CoreLoginSitePage {
5353
siteForm: FormGroup;
5454
fixedSites: CoreLoginSiteInfo[];
5555
filteredSites: CoreLoginSiteInfo[];
56-
fixedDisplay = 'buttons';
56+
siteSelector = 'sitefinder';
5757
showKeyboard = false;
5858
filter = '';
5959
sites: CoreLoginSiteInfoExtended[] = [];
@@ -82,14 +82,14 @@ export class CoreLoginSitePage {
8282
this.showKeyboard = !!navParams.get('showKeyboard');
8383

8484
let url = '';
85+
this.siteSelector = CoreConfigConstants.multisitesdisplay;
8586

8687
// Load fixed sites if they're set.
8788
if (this.loginHelper.hasSeveralFixedSites()) {
8889
this.fixedSites = <any[]> this.loginHelper.getFixedSites();
89-
this.fixedDisplay = CoreConfigConstants.multisitesdisplay;
9090
// Autoselect if not defined.
91-
if (['list', 'listnourl', 'select', 'buttons'].indexOf(this.fixedDisplay) < 0) {
92-
this.fixedDisplay = this.fixedSites.length > 8 ? 'list' : (this.fixedSites.length > 3 ? 'select' : 'buttons');
91+
if (['list', 'listnourl', 'select', 'buttons'].indexOf(this.siteSelector) < 0) {
92+
this.siteSelector = this.fixedSites.length > 8 ? 'list' : (this.fixedSites.length > 3 ? 'select' : 'buttons');
9393
}
9494
this.filteredSites = this.fixedSites;
9595
url = this.fixedSites[0].url;

0 commit comments

Comments
 (0)