_Bastler/bstlboard-front
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

user settings

Browse Source
This commit is contained in:
_Bastler 2021-10-06 11:13:46 +02:00
parent 8630b4786a
commit a7ec8f8aa1
7 changed files with 151 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
src/app/pages/settings/settings.page.html
View File

@ -1,28 +1,44 @@
<form [formGroup]="form" (ngSubmit)="save()" #formDirective="ngForm" *ngIf="user"> <div class="container">
<mat-card> <form [formGroup]="form" (ngSubmit)="save()" #formDirective="ngForm" *ngIf="user">
<mat-card-content> <mat-card>
<mat-form-field> <mat-card-content>
<input matInput formControlName="username" type="text"> <mat-card-title><a routerLink="/u/{{user.username}}">{{user.username}}</a></mat-card-title>
</mat-form-field> <mat-form-field>
<mat-form-field> <input matInput placeholder="{{'settings.email' | i18n}}" formControlName="email" type="email">
<input matInput placeholder="{{'settings.email' | i18n}}" formControlName="email" type="email"> <mat-error *ngIf="hasError('email')">
<mat-error *ngIf="hasError('email')"> {{'settings.email.error' | i18n}}
{{'settings.email.error' | i18n}} </mat-error>
</mat-error> </mat-form-field>
</mat-form-field> <mat-form-field>
<mat-form-field> <textarea [mat-autosize] [matAutosizeMinRows]="3" matInput placeholder="{{'settings.about' | i18n}}"
<textarea [mat-autosize] [matAutosizeMinRows]="3" matInput placeholder="{{'settings.about' | i18n}}" formControlName="about"></textarea> formControlName="about"></textarea>
<mat-error> <mat-error>
{{'settings.about.error' | i18n}} {{'settings.about.error' | i18n}}
</mat-error> </mat-error>
</mat-form-field> </mat-form-field>
</mat-card-content> <mat-divider></mat-divider>
<mat-card-actions> <p>{{'settings.pagesettings' | i18n}}</p>
<button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid"> <mat-form-field>
{{'settings.update' | i18n}} <button *ngIf="user.settings.gravity || form.get('gravity').value != user.metadata.defaultGravity" matPrefix
</button> mat-icon-button (click)="resetGravity()">
<a *ngIf="success" mat-button color="primary">{{'settings.success' | i18n}}</a> <mat-icon>cancel</mat-icon>
</mat-card-actions> </button>
</mat-card> <input type="number" min="0" max="2" step="0.1" matInput placeholder="{{'settings.gravity' | i18n}}"
formControlName="gravity">
</form> <mat-hint *ngIf="form.get('gravity').value != 0">
{{'settings.gravity.hint' | i18n}}
</mat-hint>
<mat-hint *ngIf="form.get('gravity').value == 0">
{{'settings.gravity.zero' | i18n}}
</mat-hint>
</mat-form-field>
</mat-card-content>
<mat-card-actions>
<button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
{{'settings.update' | i18n}}
</button>
<a *ngIf="success" mat-button color="primary">{{'settings.success' | i18n}}</a>
</mat-card-actions>
</mat-card>
</form>
</div>

19
src/app/pages/settings/settings.page.scss
View File

@ -1,3 +1,20 @@
mat-form-field { mat-form-field, mat-slider {
display: block; display: block;
} }
form {
margin-left: 15px;
margin-bottom: 15px;
@media screen and (min-width: 576px) {
max-width: 100%;
}
@media screen and (min-width: 768px) {
max-width: 80%;
}
@media screen and (min-width: 992px) {
max-width: 50%;
}
}

23
src/app/pages/settings/settings.page.ts
View File

@ -26,15 +26,20 @@ export class PageSettings implements OnInit {
username: [ { disabled: true }, Validators.nullValidator ], username: [ { disabled: true }, Validators.nullValidator ],
email: [ '', Validators.nullValidator ], email: [ '', Validators.nullValidator ],
about: [ '', Validators.nullValidator ], about: [ '', Validators.nullValidator ],
gravity: [ '', Validators.nullValidator ],
}); });
this.form.get('username').disable(); this.form.get('username').disable();
this.userService.get().subscribe(user => { this.userService.get().subscribe(user => {
this.user = user; this.user = user;
if (!this.user.settings) {
this.user.settings = {};
}
this.form.get('username').setValue(this.user.username); this.form.get('username').setValue(this.user.username);
this.form.get('email').setValue(this.user.email); this.form.get('email').setValue(this.user.email);
this.form.get('about').setValue(this.user.about); this.form.get('about').setValue(this.user.about);
this.form.get('gravity').setValue(this.user.settings.gravity || this.user.metadata.defaultGravity);
}) })
} }
@ -42,6 +47,11 @@ export class PageSettings implements OnInit {
return this.form.controls[ controlName ].errors != null; return this.form.controls[ controlName ].errors != null;
} }
resetGravity(): void {
this.user.settings.gravity = null;
this.form.get('gravity').setValue(this.user.metadata.defaultGravity);
}
save(): void { save(): void {
if (this.working) { if (this.working) {
return; return;
@ -53,8 +63,21 @@ export class PageSettings implements OnInit {
this.user.about = this.form.get('about').value; this.user.about = this.form.get('about').value;
this.user.email = this.form.get('email').value; this.user.email = this.form.get('email').value;
if (!this.user.settings) {
this.user.settings = {};
}
if (this.form.get('gravity').value != this.user.metadata.defaultGravity && !this.user.settings.gravity) {
this.user.settings.gravity = this.form.get('gravity').value;
} else if (this.user.settings.gravity) {
this.user.settings.gravity = this.form.get('gravity').value;
}
this.userService.update(this.user).subscribe((data) => { this.userService.update(this.user).subscribe((data) => {
this.user = data; this.user = data;
if (!this.user.settings) {
this.user.settings = {};
}
this.working = false; this.working = false;
this.success = true; this.success = true;
}, (error) => { }, (error) => {

86
src/app/pages/submission/submission.page.html
View File

@ -1,44 +1,48 @@
<form [formGroup]="form" (ngSubmit)="create()" #formDirective="ngForm"> <div class="container">
<mat-card> <form [formGroup]="form" (ngSubmit)="create()" #formDirective="ngForm">
<mat-card-content> <mat-card>
<p>{{'submission.info' | i18n}}</p> <mat-card-content>
<p>{{'submission.info' | i18n}}</p>
<mat-form-field> <mat-form-field>
<mat-select placeholder="{{'submission.entryType' | i18n}}" formControlName="entryType"> <mat-select placeholder="{{'submission.entryType' | i18n}}" formControlName="entryType">
<mat-select-trigger> <mat-select-trigger>
<mat-icon>{{'entryType.' + entryType + '.icon' | i18n}}</mat-icon> {{'entryType.' + entryType | i18n}} <mat-icon>{{'entryType.' + entryType + '.icon' | i18n}}</mat-icon> {{'entryType.' + entryType | i18n}}
</mat-select-trigger> </mat-select-trigger>
<mat-option *ngFor="let entryType of entryTypes" [value]="entryType" > <mat-option *ngFor="let entryType of entryTypes" [value]="entryType">
<mat-icon>{{'entryType.' + entryType + '.icon' | i18n}}</mat-icon> {{'entryType.' + entryType | i18n}} <mat-icon>{{'entryType.' + entryType + '.icon' | i18n}}</mat-icon> {{'entryType.' + entryType | i18n}}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<input matInput placeholder="{{'submission.url' | i18n}}" formControlName="url" type="url" [required]="entryType == 'LINK'" matAutofocus> <input matInput placeholder="{{'submission.url' | i18n}}" formControlName="url" type="url"
<mat-error *ngIf="hasError('url')"> [required]="entryType == 'LINK'" matAutofocus>
{{'submission.url.error' | i18n}} <mat-error *ngIf="hasError('url')">
</mat-error> {{'submission.url.error' | i18n}}
</mat-form-field> </mat-error>
</mat-form-field>
<mat-form-field> <mat-form-field>
<input matInput placeholder="{{'submission.title' | i18n}}" formControlName="title" type="text" required (focus)="onTitleFocus($event)"> <input matInput placeholder="{{'submission.title' | i18n}}" formControlName="title" type="text" required
<mat-error> (focus)="onTitleFocus($event)">
{{'submission.title.error' | i18n}} <mat-error>
</mat-error> {{'submission.title.error' | i18n}}
</mat-form-field> </mat-error>
<mat-form-field> </mat-form-field>
<textarea [mat-autosize] [matAutosizeMinRows]="3" matInput placeholder="{{'submission.text' | i18n}}" formControlName="text"></textarea> <mat-form-field>
<mat-error> <textarea [mat-autosize] [matAutosizeMinRows]="3" matInput placeholder="{{'submission.text' | i18n}}"
{{'submission.text.error' | i18n}} formControlName="text"></textarea>
</mat-error> <mat-error>
</mat-form-field> {{'submission.text.error' | i18n}}
</mat-card-content> </mat-error>
<mat-card-actions> </mat-form-field>
<button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid"> </mat-card-content>
{{'submission.create' | i18n}} <mat-card-actions>
</button> <button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
</mat-card-actions> {{'submission.create' | i18n}}
</mat-card> </button>
</mat-card-actions>
</form> </mat-card>
</form>
</div>

17
src/app/pages/submission/submission.page.scss
View File

@ -1,3 +1,20 @@
mat-form-field { mat-form-field {
display: block; display: block;
} }
form {
margin-left: 15px;
margin-bottom: 15px;
@media screen and (min-width: 576px) {
max-width: 100%;
}
@media screen and (min-width: 768px) {
max-width: 80%;
}
@media screen and (min-width: 992px) {
max-width: 50%;
}
}

4
src/app/pages/user/user.page.html
View File

@ -2,6 +2,10 @@
<page-notfound *ngIf="notfound"></page-notfound> <page-notfound *ngIf="notfound"></page-notfound>
<ng-container *ngIf="user"> <ng-container *ngIf="user">
<table> <table>
<tr *ngIf="user.metadata && user.metadata.self">
<th></th>
<td><a routerLink="/settings">{{'settings' | i18n}}</a></td>
</tr>
<tr> <tr>
<th>{{'user.username' | i18n}}</th> <th>{{'user.username' | i18n}}</th>
<td>{{user.username}}</td> <td>{{user.username}}</td>

5
src/styles.scss
View File

@ -102,11 +102,6 @@ ui-main {
bottom: 0; bottom: 0;
} }
mat-card {
max-width: 400px;
margin: 2em auto;
}
mat-form-field { mat-form-field {
display: block; display: block;
} }