diff options
Diffstat (limited to 'client/src/app/+my-account/my-account-settings/my-account-profile')
3 files changed, 27 insertions, 18 deletions
diff --git a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.html b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.html index bbdce5b02..05c0b5ddc 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.html +++ b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.html | |||
@@ -2,22 +2,26 @@ | |||
2 | 2 | ||
3 | <form role="form" (ngSubmit)="updateMyProfile()" [formGroup]="form"> | 3 | <form role="form" (ngSubmit)="updateMyProfile()" [formGroup]="form"> |
4 | 4 | ||
5 | <label i18n for="display-name">Display name</label> | 5 | <div class="form-group"> |
6 | <input | 6 | <label i18n for="display-name">Display name</label> |
7 | type="text" id="display-name" | 7 | <input |
8 | formControlName="display-name" [ngClass]="{ 'input-error': formErrors['display-name'] }" | 8 | type="text" id="display-name" |
9 | > | 9 | formControlName="display-name" [ngClass]="{ 'input-error': formErrors['display-name'] }" |
10 | <div *ngIf="formErrors['display-name']" class="form-error"> | 10 | > |
11 | {{ formErrors['display-name'] }} | 11 | <div *ngIf="formErrors['display-name']" class="form-error"> |
12 | {{ formErrors['display-name'] }} | ||
13 | </div> | ||
12 | </div> | 14 | </div> |
13 | 15 | ||
14 | <label i18n for="description">Description</label> | 16 | <div class="form-group"> |
15 | <textarea | 17 | <label i18n for="description">Description</label> |
16 | id="description" formControlName="description" | 18 | <textarea |
17 | [ngClass]="{ 'input-error': formErrors['description'] }" | 19 | id="description" formControlName="description" |
18 | ></textarea> | 20 | [ngClass]="{ 'input-error': formErrors['description'] }" |
19 | <div *ngIf="formErrors.description" class="form-error"> | 21 | ></textarea> |
20 | {{ formErrors.description }} | 22 | <div *ngIf="formErrors.description" class="form-error"> |
23 | {{ formErrors.description }} | ||
24 | </div> | ||
21 | </div> | 25 | </div> |
22 | 26 | ||
23 | <input type="submit" i18n-value value="Update my profile" [disabled]="!form.valid"> | 27 | <input type="submit" i18n-value value="Update my profile" [disabled]="!form.valid"> |
diff --git a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.scss b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.scss index fc2b92c89..6aabb60f4 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.scss +++ b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.scss | |||
@@ -1,11 +1,14 @@ | |||
1 | @import '_variables'; | 1 | @import '_variables'; |
2 | @import '_mixins'; | 2 | @import '_mixins'; |
3 | 3 | ||
4 | .form-group:first-child { | ||
5 | margin-bottom: 15px; | ||
6 | } | ||
7 | |||
4 | input[type=text] { | 8 | input[type=text] { |
5 | @include peertube-input-text(340px); | 9 | @include peertube-input-text(340px); |
6 | 10 | ||
7 | display: block; | 11 | display: block; |
8 | margin-bottom: 15px; | ||
9 | } | 12 | } |
10 | 13 | ||
11 | textarea { | 14 | textarea { |
diff --git a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts index 1fe337da0..400c3b889 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts +++ b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts | |||
@@ -1,10 +1,11 @@ | |||
1 | import { Component, Input, OnInit } from '@angular/core' | 1 | import { Component, Input, OnInit } from '@angular/core' |
2 | import { NotificationsService } from 'angular2-notifications' | 2 | import { NotificationsService } from 'angular2-notifications' |
3 | import { FormReactive, USER_DESCRIPTION, USER_DISPLAY_NAME, UserService } from '../../../shared' | 3 | import { FormReactive, UserService } from '../../../shared' |
4 | import { User } from '@app/shared' | 4 | import { User } from '@app/shared' |
5 | import { I18n } from '@ngx-translate/i18n-polyfill' | 5 | import { I18n } from '@ngx-translate/i18n-polyfill' |
6 | import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' | 6 | import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' |
7 | import { Subject } from 'rxjs/Subject' | 7 | import { Subject } from 'rxjs/Subject' |
8 | import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service' | ||
8 | 9 | ||
9 | @Component({ | 10 | @Component({ |
10 | selector: 'my-account-profile', | 11 | selector: 'my-account-profile', |
@@ -19,6 +20,7 @@ export class MyAccountProfileComponent extends FormReactive implements OnInit { | |||
19 | 20 | ||
20 | constructor ( | 21 | constructor ( |
21 | protected formValidatorService: FormValidatorService, | 22 | protected formValidatorService: FormValidatorService, |
23 | private userValidatorsService: UserValidatorsService, | ||
22 | private notificationsService: NotificationsService, | 24 | private notificationsService: NotificationsService, |
23 | private userService: UserService, | 25 | private userService: UserService, |
24 | private i18n: I18n | 26 | private i18n: I18n |
@@ -28,8 +30,8 @@ export class MyAccountProfileComponent extends FormReactive implements OnInit { | |||
28 | 30 | ||
29 | ngOnInit () { | 31 | ngOnInit () { |
30 | this.buildForm({ | 32 | this.buildForm({ |
31 | 'display-name': USER_DISPLAY_NAME, | 33 | 'display-name': this.userValidatorsService.USER_DISPLAY_NAME, |
32 | description: USER_DESCRIPTION | 34 | description: this.userValidatorsService.USER_DESCRIPTION |
33 | }) | 35 | }) |
34 | 36 | ||
35 | this.userInformationLoaded.subscribe(() => { | 37 | this.userInformationLoaded.subscribe(() => { |