aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/+my-account
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2019-07-09 11:45:19 +0200
committerChocobozzz <chocobozzz@cpy.re>2019-07-24 10:58:16 +0200
commit7cd4d2ba10106c10602c86f74f55743ded588896 (patch)
tree81f0dd7a7ef763511158d1035f3e09e09d5dcd2c /client/src/app/+my-account
parent8d76959e11ab7172040853fa4fadaf8d53e6aa12 (diff)
downloadPeerTube-7cd4d2ba10106c10602c86f74f55743ded588896.tar.gz
PeerTube-7cd4d2ba10106c10602c86f74f55743ded588896.tar.zst
PeerTube-7cd4d2ba10106c10602c86f74f55743ded588896.zip
WIP plugins: add theme support
Diffstat (limited to 'client/src/app/+my-account')
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-interface/index.ts1
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.html13
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.scss16
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.ts64
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-settings.component.html5
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-settings.component.ts2
-rw-r--r--client/src/app/+my-account/my-account.module.ts14
7 files changed, 104 insertions, 11 deletions
diff --git a/client/src/app/+my-account/my-account-settings/my-account-interface/index.ts b/client/src/app/+my-account/my-account-settings/my-account-interface/index.ts
new file mode 100644
index 000000000..62fce79a8
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-interface/index.ts
@@ -0,0 +1 @@
export * from './my-account-interface-settings.component'
diff --git a/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.html b/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.html
new file mode 100644
index 000000000..f34e77f6a
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.html
@@ -0,0 +1,13 @@
1<form role="form" (ngSubmit)="updateInterfaceSettings()" [formGroup]="form">
2 <div class="form-group">
3 <label i18n for="theme">Theme</label>
4
5 <div class="peertube-select-container">
6 <select formControlName="theme" id="theme">
7 <option i18n value="default">default</option>
8
9 <option *ngFor="let theme of availableThemes" [value]="theme">{{ theme }}</option>
10 </select>
11 </div>
12 </div>
13</form>
diff --git a/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.scss b/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.scss
new file mode 100644
index 000000000..629f01733
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.scss
@@ -0,0 +1,16 @@
1@import '_variables';
2@import '_mixins';
3
4input[type=submit] {
5 @include peertube-button;
6 @include orange-button;
7
8 display: block;
9 margin-top: 15px;
10}
11
12.peertube-select-container {
13 @include peertube-select-container(340px);
14
15 margin-bottom: 30px;
16}
diff --git a/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.ts
new file mode 100644
index 000000000..f7055072f
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.ts
@@ -0,0 +1,64 @@
1import { Component, Input, OnInit } from '@angular/core'
2import { Notifier, ServerService } from '@app/core'
3import { UserUpdateMe } from '../../../../../../shared'
4import { AuthService } from '../../../core'
5import { FormReactive, User, UserService } from '../../../shared'
6import { I18n } from '@ngx-translate/i18n-polyfill'
7import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
8import { Subject } from 'rxjs'
9
10@Component({
11 selector: 'my-account-interface-settings',
12 templateUrl: './my-account-interface-settings.component.html',
13 styleUrls: [ './my-account-interface-settings.component.scss' ]
14})
15export class MyAccountInterfaceSettingsComponent extends FormReactive implements OnInit {
16 @Input() user: User = null
17 @Input() userInformationLoaded: Subject<any>
18
19 constructor (
20 protected formValidatorService: FormValidatorService,
21 private authService: AuthService,
22 private notifier: Notifier,
23 private userService: UserService,
24 private serverService: ServerService,
25 private i18n: I18n
26 ) {
27 super()
28 }
29
30 get availableThemes () {
31 return this.serverService.getConfig().theme.registered
32 }
33
34 ngOnInit () {
35 this.buildForm({
36 theme: null
37 })
38
39 this.userInformationLoaded
40 .subscribe(() => {
41 this.form.patchValue({
42 theme: this.user.theme
43 })
44 })
45 }
46
47 updateInterfaceSettings () {
48 const theme = this.form.value['theme']
49
50 const details: UserUpdateMe = {
51 theme
52 }
53
54 this.userService.updateMyProfile(details).subscribe(
55 () => {
56 this.notifier.success(this.i18n('Interface settings updated.'))
57
58 window.location.reload()
59 },
60
61 err => this.notifier.error(err.message)
62 )
63 }
64}
diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html
index e51302f7c..eb9367d1f 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html
+++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html
@@ -10,9 +10,12 @@
10<div i18n class="account-title">Video settings</div> 10<div i18n class="account-title">Video settings</div>
11<my-account-video-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-video-settings> 11<my-account-video-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-video-settings>
12 12
13<div i18n class="account-title" id="notifications">Notifications</div> 13<div i18n class="account-title">Notifications</div>
14<my-account-notification-preferences [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-notification-preferences> 14<my-account-notification-preferences [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-notification-preferences>
15 15
16<div i18n class="account-title">Interface</div>
17<my-account-interface-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-interface-settings>
18
16<div i18n class="account-title">Password</div> 19<div i18n class="account-title">Password</div>
17<my-account-change-password></my-account-change-password> 20<my-account-change-password></my-account-change-password>
18 21
diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts
index f4b954e54..95fd2a3db 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts
@@ -1,4 +1,4 @@
1import { Component, OnInit, ViewChild } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { Notifier } from '@app/core' 2import { Notifier } from '@app/core'
3import { BytesPipe } from 'ngx-pipes' 3import { BytesPipe } from 'ngx-pipes'
4import { AuthService } from '../../core' 4import { AuthService } from '../../core'
diff --git a/client/src/app/+my-account/my-account.module.ts b/client/src/app/+my-account/my-account.module.ts
index a1b198e3e..5be1b0d05 100644
--- a/client/src/app/+my-account/my-account.module.ts
+++ b/client/src/app/+my-account/my-account.module.ts
@@ -25,19 +25,14 @@ import { MyAccountServerBlocklistComponent } from '@app/+my-account/my-account-b
25import { MyAccountHistoryComponent } from '@app/+my-account/my-account-history/my-account-history.component' 25import { MyAccountHistoryComponent } from '@app/+my-account/my-account-history/my-account-history.component'
26import { MyAccountNotificationsComponent } from '@app/+my-account/my-account-notifications/my-account-notifications.component' 26import { MyAccountNotificationsComponent } from '@app/+my-account/my-account-notifications/my-account-notifications.component'
27import { MyAccountNotificationPreferencesComponent } from '@app/+my-account/my-account-settings/my-account-notification-preferences' 27import { MyAccountNotificationPreferencesComponent } from '@app/+my-account/my-account-settings/my-account-notification-preferences'
28import { 28import { MyAccountVideoPlaylistCreateComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component'
29 MyAccountVideoPlaylistCreateComponent 29import { MyAccountVideoPlaylistUpdateComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component'
30} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component'
31import {
32 MyAccountVideoPlaylistUpdateComponent
33} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component'
34import { MyAccountVideoPlaylistsComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlists.component' 30import { MyAccountVideoPlaylistsComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlists.component'
35import { 31import { MyAccountVideoPlaylistElementsComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component'
36 MyAccountVideoPlaylistElementsComponent
37} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component'
38import { DragDropModule } from '@angular/cdk/drag-drop' 32import { DragDropModule } from '@angular/cdk/drag-drop'
39import { MyAccountChangeEmailComponent } from '@app/+my-account/my-account-settings/my-account-change-email' 33import { MyAccountChangeEmailComponent } from '@app/+my-account/my-account-settings/my-account-change-email'
40import { MultiSelectModule } from 'primeng/primeng' 34import { MultiSelectModule } from 'primeng/primeng'
35import { MyAccountInterfaceSettingsComponent } from '@app/+my-account/my-account-settings/my-account-interface'
41 36
42@NgModule({ 37@NgModule({
43 imports: [ 38 imports: [
@@ -58,6 +53,7 @@ import { MultiSelectModule } from 'primeng/primeng'
58 MyAccountVideoSettingsComponent, 53 MyAccountVideoSettingsComponent,
59 MyAccountProfileComponent, 54 MyAccountProfileComponent,
60 MyAccountChangeEmailComponent, 55 MyAccountChangeEmailComponent,
56 MyAccountInterfaceSettingsComponent,
61 57
62 MyAccountVideosComponent, 58 MyAccountVideosComponent,
63 59