56 lines
2.8 KiB
HTML
56 lines
2.8 KiB
HTML
<div *ngIf="!isLoggedIn" class="form-container">
|
|
<p>Please log in:</p>
|
|
<label for="email">Your @nachklang.art email: </label>
|
|
<input id="email" type="text" aria-label="Your Email" [(ngModel)]="email"><br>
|
|
<label for="password">Password: </label>
|
|
<input id="password" type="password" aria-label="Password" (keyup.enter)="login()" [(ngModel)]="password"><br>
|
|
<button (click)="login()">Login</button>
|
|
<br><br>
|
|
<p>If you dont' have an account yet, please use the following form to register:</p>
|
|
<label for="name">Your full name: </label>
|
|
<input id="name" type="text" aria-label="Your Name" [(ngModel)]="name"><br>
|
|
<label for="registerEmail">Your @nachklang.art email: </label>
|
|
<input id="registerEmail" type="text" aria-label="Your Email" [(ngModel)]="registerEmail"><br>
|
|
<label for="registerPassword">Password: </label>
|
|
<input id="registerPassword" type="password" aria-label="Password" [(ngModel)]="registerPassword"><br>
|
|
<label for="registerPasswordConfirm">Confirm password: </label>
|
|
<input id="registerPasswordConfirm" type="password" aria-label="Password" (keyup.enter)="register()" [(ngModel)]="registerPasswordConfirm"><br>
|
|
<p *ngIf="!checkPasswordPolicy()">Passwords have to use uppercase and lowercase letters, numbers and must have at least 12 characters!</p>
|
|
<p *ngIf="!checkPasswordsMatch()">Passwords do not match!</p>
|
|
<button (click)="register()">Register</button>
|
|
</div>
|
|
<div *ngIf="isLoggedIn">
|
|
<span>Logged in as {{getUserName()}}</span>
|
|
<span *ngIf="checkUserInactive()"> (inactive)</span>
|
|
<span> </span>
|
|
<button (click)="logout()">Logout</button>
|
|
<span> | </span>
|
|
<span>Calendar: </span>
|
|
<select [(ngModel)]="selectedCalendar" (change)="handleCalendarChange()">
|
|
<option value="" disabled selected hidden>Select calendar</option>
|
|
<option value="public">Public</option>
|
|
<option value="members">Internal - Members</option>
|
|
<option value="choir">Internal - Choir</option>
|
|
<option value="management">Internal - Management</option>
|
|
</select>
|
|
<span> | </span>
|
|
<span>Filter: </span>
|
|
<select [(ngModel)]="eventFilter" (change)="getEvents()">
|
|
<option value="all">All Events</option>
|
|
<option value="future">Future Events only</option>
|
|
<option value="past">Past Events only</option>
|
|
</select>
|
|
<span> | </span>
|
|
<span>Sorting: </span>
|
|
<select [(ngModel)]="eventSorting" (change)="sortEvents()">
|
|
<option value="start_asc">Start Date - Ascending</option>
|
|
<option value="start_desc">Start Date - Descending</option>
|
|
<option value="created_asc">Created Date - Ascending</option>
|
|
<option value="created_desc">Created Date - Descending</option>
|
|
</select>
|
|
<span> | </span>
|
|
<button (click)="getEvents()">Reload Events</button>
|
|
<div style="height: 1em;"></div>
|
|
<app-events-table [events]="this.events" [selectedCalendar]="getCalendarId(selectedCalendar)"></app-events-table>
|
|
</div>
|