_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">
<mat-card>
<mat-card-content>
<mat-form-field>
<input matInput formControlName="username" type="text">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="{{'settings.email' | i18n}}" formControlName="email" type="email">
<mat-error *ngIf="hasError('email')">
{{'settings.email.error' | i18n}}
</mat-error>
</mat-form-field>
<mat-form-field>
<textarea [mat-autosize] [matAutosizeMinRows]="3" matInput placeholder="{{'settings.about' | i18n}}" formControlName="about"></textarea>
<mat-error>
{{'settings.about.error' | i18n}}
</mat-error>
</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 class="container">
<form [formGroup]="form" (ngSubmit)="save()" #formDirective="ngForm" *ngIf="user">
<mat-card>
<mat-card-content>
<mat-card-title><a routerLink="/u/{{user.username}}">{{user.username}}</a></mat-card-title>
<mat-form-field>
<input matInput placeholder="{{'settings.email' | i18n}}" formControlName="email" type="email">
<mat-error *ngIf="hasError('email')">
{{'settings.email.error' | i18n}}
</mat-error>
</mat-form-field>
<mat-form-field>
<textarea [mat-autosize] [matAutosizeMinRows]="3" matInput placeholder="{{'settings.about' | i18n}}"
formControlName="about"></textarea>
<mat-error>
{{'settings.about.error' | i18n}}
</mat-error>
</mat-form-field>
<mat-divider></mat-divider>
<p>{{'settings.pagesettings' | i18n}}</p>
<mat-form-field>
<button *ngIf="user.settings.gravity || form.get('gravity').value != user.metadata.defaultGravity" matPrefix
mat-icon-button (click)="resetGravity()">
<mat-icon>cancel</mat-icon>
</button>
<input type="number" min="0" max="2" step="0.1" matInput placeholder="{{'settings.gravity' | i18n}}"
formControlName="gravity">
<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;
}
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 ],
email: [ '', Validators.nullValidator ],
about: [ '', Validators.nullValidator ],
gravity: [ '', Validators.nullValidator ],
});
this.form.get('username').disable();
this.userService.get().subscribe(user => {
this.user = user;
if (!this.user.settings) {
this.user.settings = {};
}
this.form.get('username').setValue(this.user.username);
this.form.get('email').setValue(this.user.email);
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;
}
resetGravity(): void {
this.user.settings.gravity = null;
this.form.get('gravity').setValue(this.user.metadata.defaultGravity);
}
save(): void {
if (this.working) {
return;
@ -53,8 +63,21 @@ export class PageSettings implements OnInit {
this.user.about = this.form.get('about').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.user = data;
if (!this.user.settings) {
this.user.settings = {};
}
this.working = false;
this.success = true;
}, (error) => {

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

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

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

@ -1,3 +1,20 @@
mat-form-field {
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>
<ng-container *ngIf="user">
<table>
<tr *ngIf="user.metadata && user.metadata.self">
<th></th>
<td><a routerLink="/settings">{{'settings' | i18n}}</a></td>
</tr>
<tr>
<th>{{'user.username' | i18n}}</th>
<td>{{user.username}}</td>

5
src/styles.scss
View File

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