diff options
Diffstat (limited to 'client/src/app/account/account-settings')
11 files changed, 0 insertions, 363 deletions
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html b/client/src/app/account/account-settings/account-change-password/account-change-password.component.html deleted file mode 100644 index b0e3cada4..000000000 --- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html +++ /dev/null | |||
@@ -1,20 +0,0 @@ | |||
1 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> | ||
2 | |||
3 | <form role="form" (ngSubmit)="changePassword()" [formGroup]="form"> | ||
4 | |||
5 | <label for="new-password">Change password</label> | ||
6 | <input | ||
7 | type="password" id="new-password" placeholder="New password" | ||
8 | formControlName="new-password" [ngClass]="{ 'input-error': formErrors['new-password'] }" | ||
9 | > | ||
10 | <div *ngIf="formErrors['new-password']" class="form-error"> | ||
11 | {{ formErrors['new-password'] }} | ||
12 | </div> | ||
13 | |||
14 | <input | ||
15 | type="password" id="new-confirmed-password" placeholder="Confirm new password" | ||
16 | formControlName="new-confirmed-password" | ||
17 | > | ||
18 | |||
19 | <input type="submit" value="Change password" [disabled]="!form.valid"> | ||
20 | </form> | ||
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss b/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss deleted file mode 100644 index f8279ffd3..000000000 --- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss +++ /dev/null | |||
@@ -1,19 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | input[type=password] { | ||
5 | @include peertube-input-text(340px); | ||
6 | display: block; | ||
7 | |||
8 | &#new-confirmed-password { | ||
9 | margin-top: 15px; | ||
10 | } | ||
11 | } | ||
12 | |||
13 | input[type=submit] { | ||
14 | @include peertube-button; | ||
15 | @include orange-button; | ||
16 | |||
17 | margin-top: 15px; | ||
18 | } | ||
19 | |||
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts b/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts deleted file mode 100644 index 8979e1734..000000000 --- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts +++ /dev/null | |||
@@ -1,62 +0,0 @@ | |||
1 | import { Component, OnInit } from '@angular/core' | ||
2 | import { FormBuilder, FormGroup } from '@angular/forms' | ||
3 | import { NotificationsService } from 'angular2-notifications' | ||
4 | import { FormReactive, USER_PASSWORD, UserService } from '../../../shared' | ||
5 | |||
6 | @Component({ | ||
7 | selector: 'my-account-change-password', | ||
8 | templateUrl: './account-change-password.component.html', | ||
9 | styleUrls: [ './account-change-password.component.scss' ] | ||
10 | }) | ||
11 | export class AccountChangePasswordComponent extends FormReactive implements OnInit { | ||
12 | error: string = null | ||
13 | |||
14 | form: FormGroup | ||
15 | formErrors = { | ||
16 | 'new-password': '', | ||
17 | 'new-confirmed-password': '' | ||
18 | } | ||
19 | validationMessages = { | ||
20 | 'new-password': USER_PASSWORD.MESSAGES, | ||
21 | 'new-confirmed-password': USER_PASSWORD.MESSAGES | ||
22 | } | ||
23 | |||
24 | constructor ( | ||
25 | private formBuilder: FormBuilder, | ||
26 | private notificationsService: NotificationsService, | ||
27 | private userService: UserService | ||
28 | ) { | ||
29 | super() | ||
30 | } | ||
31 | |||
32 | buildForm () { | ||
33 | this.form = this.formBuilder.group({ | ||
34 | 'new-password': [ '', USER_PASSWORD.VALIDATORS ], | ||
35 | 'new-confirmed-password': [ '', USER_PASSWORD.VALIDATORS ] | ||
36 | }) | ||
37 | |||
38 | this.form.valueChanges.subscribe(data => this.onValueChanged(data)) | ||
39 | } | ||
40 | |||
41 | ngOnInit () { | ||
42 | this.buildForm() | ||
43 | } | ||
44 | |||
45 | changePassword () { | ||
46 | const newPassword = this.form.value['new-password'] | ||
47 | const newConfirmedPassword = this.form.value['new-confirmed-password'] | ||
48 | |||
49 | this.error = null | ||
50 | |||
51 | if (newPassword !== newConfirmedPassword) { | ||
52 | this.error = 'The new password and the confirmed password do not correspond.' | ||
53 | return | ||
54 | } | ||
55 | |||
56 | this.userService.changePassword(newPassword).subscribe( | ||
57 | () => this.notificationsService.success('Success', 'Password updated.'), | ||
58 | |||
59 | err => this.error = err.message | ||
60 | ) | ||
61 | } | ||
62 | } | ||
diff --git a/client/src/app/account/account-settings/account-change-password/index.ts b/client/src/app/account/account-settings/account-change-password/index.ts deleted file mode 100644 index 44c330b66..000000000 --- a/client/src/app/account/account-settings/account-change-password/index.ts +++ /dev/null | |||
@@ -1 +0,0 @@ | |||
1 | export * from './account-change-password.component' | ||
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.html b/client/src/app/account/account-settings/account-details/account-details.component.html deleted file mode 100644 index 0e8598e9e..000000000 --- a/client/src/app/account/account-settings/account-details/account-details.component.html +++ /dev/null | |||
@@ -1,25 +0,0 @@ | |||
1 | <form role="form" (ngSubmit)="updateDetails()" [formGroup]="form"> | ||
2 | <div class="form-group"> | ||
3 | <label for="nsfwPolicy">Default policy on videos containing sensitive content</label> | ||
4 | <my-help helpType="custom" customHtml="With <strong>Do not list</strong> or <strong>Blur thumbnails</strong>, a confirmation will be requested to watch the video."></my-help> | ||
5 | |||
6 | <div class="peertube-select-container"> | ||
7 | <select id="nsfwPolicy" formControlName="nsfwPolicy"> | ||
8 | <option value="do_not_list">Do not list</option> | ||
9 | <option value="blur">Blur thumbnails</option> | ||
10 | <option value="display">Display</option> | ||
11 | </select> | ||
12 | </div> | ||
13 | </div> | ||
14 | |||
15 | <div class="form-group"> | ||
16 | <input | ||
17 | type="checkbox" id="autoPlayVideo" | ||
18 | formControlName="autoPlayVideo" | ||
19 | > | ||
20 | <label for="autoPlayVideo"></label> | ||
21 | <label for="autoPlayVideo">Automatically plays video</label> | ||
22 | </div> | ||
23 | |||
24 | <input type="submit" value="Save" [disabled]="!form.valid"> | ||
25 | </form> | ||
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.scss b/client/src/app/account/account-settings/account-details/account-details.component.scss deleted file mode 100644 index ed59e4689..000000000 --- a/client/src/app/account/account-settings/account-details/account-details.component.scss +++ /dev/null | |||
@@ -1,20 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | input[type=checkbox] { | ||
5 | @include peertube-checkbox(1px); | ||
6 | } | ||
7 | |||
8 | input[type=submit] { | ||
9 | @include peertube-button; | ||
10 | @include orange-button; | ||
11 | |||
12 | display: block; | ||
13 | margin-top: 15px; | ||
14 | } | ||
15 | |||
16 | .peertube-select-container { | ||
17 | @include peertube-select-container(340px); | ||
18 | |||
19 | margin-bottom: 30px; | ||
20 | } \ No newline at end of file | ||
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.ts b/client/src/app/account/account-settings/account-details/account-details.component.ts deleted file mode 100644 index de213717e..000000000 --- a/client/src/app/account/account-settings/account-details/account-details.component.ts +++ /dev/null | |||
@@ -1,61 +0,0 @@ | |||
1 | import { Component, Input, OnInit } from '@angular/core' | ||
2 | import { FormBuilder, FormGroup } from '@angular/forms' | ||
3 | import { NotificationsService } from 'angular2-notifications' | ||
4 | import { UserUpdateMe } from '../../../../../../shared' | ||
5 | import { AuthService } from '../../../core' | ||
6 | import { FormReactive, User, UserService } from '../../../shared' | ||
7 | |||
8 | @Component({ | ||
9 | selector: 'my-account-details', | ||
10 | templateUrl: './account-details.component.html', | ||
11 | styleUrls: [ './account-details.component.scss' ] | ||
12 | }) | ||
13 | |||
14 | export class AccountDetailsComponent extends FormReactive implements OnInit { | ||
15 | @Input() user: User = null | ||
16 | |||
17 | form: FormGroup | ||
18 | formErrors = {} | ||
19 | validationMessages = {} | ||
20 | |||
21 | constructor ( | ||
22 | private authService: AuthService, | ||
23 | private formBuilder: FormBuilder, | ||
24 | private notificationsService: NotificationsService, | ||
25 | private userService: UserService | ||
26 | ) { | ||
27 | super() | ||
28 | } | ||
29 | |||
30 | buildForm () { | ||
31 | this.form = this.formBuilder.group({ | ||
32 | nsfwPolicy: [ this.user.nsfwPolicy ], | ||
33 | autoPlayVideo: [ this.user.autoPlayVideo ] | ||
34 | }) | ||
35 | |||
36 | this.form.valueChanges.subscribe(data => this.onValueChanged(data)) | ||
37 | } | ||
38 | |||
39 | ngOnInit () { | ||
40 | this.buildForm() | ||
41 | } | ||
42 | |||
43 | updateDetails () { | ||
44 | const nsfwPolicy = this.form.value['nsfwPolicy'] | ||
45 | const autoPlayVideo = this.form.value['autoPlayVideo'] | ||
46 | const details: UserUpdateMe = { | ||
47 | nsfwPolicy, | ||
48 | autoPlayVideo | ||
49 | } | ||
50 | |||
51 | this.userService.updateMyDetails(details).subscribe( | ||
52 | () => { | ||
53 | this.notificationsService.success('Success', 'Information updated.') | ||
54 | |||
55 | this.authService.refreshUserInformation() | ||
56 | }, | ||
57 | |||
58 | err => this.notificationsService.error('Error', err.message) | ||
59 | ) | ||
60 | } | ||
61 | } | ||
diff --git a/client/src/app/account/account-settings/account-details/index.ts b/client/src/app/account/account-settings/account-details/index.ts deleted file mode 100644 index 4829f608a..000000000 --- a/client/src/app/account/account-settings/account-details/index.ts +++ /dev/null | |||
@@ -1 +0,0 @@ | |||
1 | export * from './account-details.component' | ||
diff --git a/client/src/app/account/account-settings/account-settings.component.html b/client/src/app/account/account-settings/account-settings.component.html deleted file mode 100644 index 7ae27dc75..000000000 --- a/client/src/app/account/account-settings/account-settings.component.html +++ /dev/null | |||
@@ -1,24 +0,0 @@ | |||
1 | <div class="user"> | ||
2 | <img [src]="getAvatarUrl()" alt="Avatar" /> | ||
3 | |||
4 | <div class="user-info"> | ||
5 | <div class="user-info-username">{{ user.username }}</div> | ||
6 | <div class="user-info-followers">{{ user.account?.followersCount }} subscribers</div> | ||
7 | </div> | ||
8 | </div> | ||
9 | |||
10 | <div class="button-file"> | ||
11 | <span>Change your avatar</span> | ||
12 | <input #avatarfileInput type="file" name="avatarfile" id="avatarfile" [accept]="avatarExtensions" (change)="changeAvatar()" /> | ||
13 | </div> | ||
14 | <div class="file-max-size">(extensions: {{ avatarExtensions }}, max size: {{ maxAvatarSize | bytes }})</div> | ||
15 | |||
16 | <div class="user-quota"> | ||
17 | <span class="user-quota-label">Video quota:</span> {{ userVideoQuotaUsed | bytes: 0 }} / {{ userVideoQuota }} | ||
18 | </div> | ||
19 | |||
20 | <div class="account-title">Account settings</div> | ||
21 | <my-account-change-password></my-account-change-password> | ||
22 | |||
23 | <div class="account-title">Video settings</div> | ||
24 | <my-account-details [user]="user"></my-account-details> | ||
diff --git a/client/src/app/account/account-settings/account-settings.component.scss b/client/src/app/account/account-settings/account-settings.component.scss deleted file mode 100644 index 1cc00ca49..000000000 --- a/client/src/app/account/account-settings/account-settings.component.scss +++ /dev/null | |||
@@ -1,56 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | .user { | ||
5 | display: flex; | ||
6 | |||
7 | img { | ||
8 | @include avatar(50px); | ||
9 | |||
10 | margin-right: 15px; | ||
11 | } | ||
12 | |||
13 | .user-info { | ||
14 | .user-info-username { | ||
15 | font-size: 20px; | ||
16 | font-weight: $font-bold; | ||
17 | } | ||
18 | |||
19 | .user-info-followers { | ||
20 | font-size: 15px; | ||
21 | } | ||
22 | } | ||
23 | } | ||
24 | |||
25 | .button-file { | ||
26 | @include peertube-button-file(160px); | ||
27 | |||
28 | margin-top: 10px; | ||
29 | margin-bottom: 5px; | ||
30 | } | ||
31 | |||
32 | .file-max-size { | ||
33 | display: inline-block; | ||
34 | font-size: 13px; | ||
35 | |||
36 | position: relative; | ||
37 | top: -10px; | ||
38 | } | ||
39 | |||
40 | .user-quota { | ||
41 | font-size: 15px; | ||
42 | margin-top: 20px; | ||
43 | |||
44 | .user-quota-label { | ||
45 | font-weight: $font-semibold; | ||
46 | } | ||
47 | } | ||
48 | |||
49 | .account-title { | ||
50 | text-transform: uppercase; | ||
51 | color: $orange-color; | ||
52 | font-weight: $font-bold; | ||
53 | font-size: 13px; | ||
54 | margin-top: 55px; | ||
55 | margin-bottom: 30px; | ||
56 | } | ||
diff --git a/client/src/app/account/account-settings/account-settings.component.ts b/client/src/app/account/account-settings/account-settings.component.ts deleted file mode 100644 index 524607817..000000000 --- a/client/src/app/account/account-settings/account-settings.component.ts +++ /dev/null | |||
@@ -1,74 +0,0 @@ | |||
1 | import { Component, OnInit, ViewChild } from '@angular/core' | ||
2 | import { NotificationsService } from 'angular2-notifications' | ||
3 | import { BytesPipe } from 'ngx-pipes' | ||
4 | import { AuthService } from '../../core' | ||
5 | import { ServerService } from '../../core/server' | ||
6 | import { User } from '../../shared' | ||
7 | import { UserService } from '../../shared/users' | ||
8 | |||
9 | @Component({ | ||
10 | selector: 'my-account-settings', | ||
11 | templateUrl: './account-settings.component.html', | ||
12 | styleUrls: [ './account-settings.component.scss' ] | ||
13 | }) | ||
14 | export class AccountSettingsComponent implements OnInit { | ||
15 | @ViewChild('avatarfileInput') avatarfileInput | ||
16 | |||
17 | user: User = null | ||
18 | userVideoQuota = '0' | ||
19 | userVideoQuotaUsed = 0 | ||
20 | |||
21 | constructor ( | ||
22 | private userService: UserService, | ||
23 | private authService: AuthService, | ||
24 | private serverService: ServerService, | ||
25 | private notificationsService: NotificationsService | ||
26 | ) {} | ||
27 | |||
28 | ngOnInit () { | ||
29 | this.user = this.authService.getUser() | ||
30 | |||
31 | this.authService.userInformationLoaded.subscribe( | ||
32 | () => { | ||
33 | if (this.user.videoQuota !== -1) { | ||
34 | this.userVideoQuota = new BytesPipe().transform(this.user.videoQuota, 0).toString() | ||
35 | } else { | ||
36 | this.userVideoQuota = 'Unlimited' | ||
37 | } | ||
38 | } | ||
39 | ) | ||
40 | |||
41 | this.userService.getMyVideoQuotaUsed() | ||
42 | .subscribe(data => this.userVideoQuotaUsed = data.videoQuotaUsed) | ||
43 | } | ||
44 | |||
45 | getAvatarUrl () { | ||
46 | return this.user.getAvatarUrl() | ||
47 | } | ||
48 | |||
49 | changeAvatar () { | ||
50 | const avatarfile = this.avatarfileInput.nativeElement.files[ 0 ] | ||
51 | |||
52 | const formData = new FormData() | ||
53 | formData.append('avatarfile', avatarfile) | ||
54 | |||
55 | this.userService.changeAvatar(formData) | ||
56 | .subscribe( | ||
57 | data => { | ||
58 | this.notificationsService.success('Success', 'Avatar changed.') | ||
59 | |||
60 | this.user.account.avatar = data.avatar | ||
61 | }, | ||
62 | |||
63 | err => this.notificationsService.error('Error', err.message) | ||
64 | ) | ||
65 | } | ||
66 | |||
67 | get maxAvatarSize () { | ||
68 | return this.serverService.getConfig().avatar.file.size.max | ||
69 | } | ||
70 | |||
71 | get avatarExtensions () { | ||
72 | return this.serverService.getConfig().avatar.file.extensions.join(',') | ||
73 | } | ||
74 | } | ||