aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/+my-account
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/+my-account')
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-create.component.ts (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts)9
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.component.html (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html)0
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.component.scss (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.scss)0
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.ts (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts)4
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-update.component.ts (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts)13
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channels-routing.module.ts (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channels-routing.module.ts)0
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.html (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html)0
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.scss (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss)0
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.ts (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts)15
-rw-r--r--client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.module.ts (renamed from client/src/app/+my-account/my-account-video-channels/my-account-video-channels.module.ts)18
-rw-r--r--client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts6
-rw-r--r--client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts6
-rw-r--r--client/src/app/+my-account/my-account-history/my-account-history.component.ts25
-rw-r--r--client/src/app/+my-account/my-account-notifications/my-account-notifications.component.ts2
-rw-r--r--client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts12
-rw-r--r--client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts10
-rw-r--r--client/src/app/+my-account/my-account-routing.module.ts35
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts13
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts10
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts5
-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.html17
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.scss21
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.ts89
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-notification-preferences/my-account-notification-preferences.component.ts11
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts9
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-settings.component.html4
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-settings.component.ts9
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-video-settings/index.ts1
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.html75
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.scss24
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts142
-rw-r--r--client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts9
-rw-r--r--client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts9
-rw-r--r--client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component.ts9
-rw-r--r--client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-edit.ts4
-rw-r--r--client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.ts19
-rw-r--r--client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component.ts16
-rw-r--r--client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.ts13
-rw-r--r--client/src/app/+my-account/my-account-videos/my-account-videos.component.ts22
-rw-r--r--client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts8
-rw-r--r--client/src/app/+my-account/my-account.component.ts2
-rw-r--r--client/src/app/+my-account/my-account.module.ts72
-rw-r--r--client/src/app/+my-account/shared/actor-avatar-info.component.html24
-rw-r--r--client/src/app/+my-account/shared/actor-avatar-info.component.scss71
-rw-r--r--client/src/app/+my-account/shared/actor-avatar-info.component.ts66
-rw-r--r--client/src/app/+my-account/top-menu-dropdown.component.html50
-rw-r--r--client/src/app/+my-account/top-menu-dropdown.component.scss56
-rw-r--r--client/src/app/+my-account/top-menu-dropdown.component.ts131
49 files changed, 414 insertions, 753 deletions
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-create.component.ts
index a68f79b47..039c389e4 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-create.component.ts
@@ -1,12 +1,11 @@
1import { Component, OnInit } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { Router } from '@angular/router' 2import { Router } from '@angular/router'
3import { AuthService, Notifier } from '@app/core' 3import { AuthService, Notifier } from '@app/core'
4import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit' 4import { FormValidatorService, VideoChannelValidatorsService } from '@app/shared/shared-forms'
5import { VideoChannelCreate } from '../../../../../shared/models/videos' 5import { VideoChannelService } from '@app/shared/shared-main'
6import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
7import { I18n } from '@ngx-translate/i18n-polyfill' 6import { I18n } from '@ngx-translate/i18n-polyfill'
8import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 7import { VideoChannelCreate } from '@shared/models'
9import { VideoChannelValidatorsService } from '@app/shared/forms/form-validators/video-channel-validators.service' 8import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit'
10 9
11@Component({ 10@Component({
12 selector: 'my-account-video-channel-create', 11 selector: 'my-account-video-channel-create',
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.component.html
index 048d143cd..048d143cd 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.component.html
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.scss b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.component.scss
index 8f8af655c..8f8af655c 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.scss
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.component.scss
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.ts
index 355cb4f55..710c51d8e 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-edit.ts
@@ -1,5 +1,5 @@
1import { FormReactive } from '@app/shared' 1import { FormReactive } from '@app/shared/shared-forms'
2import { VideoChannel } from '@app/shared/video-channel/video-channel.model' 2import { VideoChannel } from '@app/shared/shared-main'
3 3
4export abstract class MyAccountVideoChannelEdit extends FormReactive { 4export abstract class MyAccountVideoChannelEdit extends FormReactive {
5 // We need it even in the create component because it's used in the edit template 5 // We need it even in the create component because it's used in the edit template
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-update.component.ts
index 9c948b367..489c437ea 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channel-update.component.ts
@@ -1,15 +1,12 @@
1import { Subscription } from 'rxjs'
1import { Component, OnDestroy, OnInit } from '@angular/core' 2import { Component, OnDestroy, OnInit } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router' 3import { ActivatedRoute, Router } from '@angular/router'
3import { AuthService, Notifier, ServerService } from '@app/core' 4import { AuthService, Notifier, ServerService } from '@app/core'
4import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit' 5import { FormValidatorService, VideoChannelValidatorsService } from '@app/shared/shared-forms'
5import { VideoChannelUpdate } from '../../../../../shared/models/videos' 6import { VideoChannel, VideoChannelService } from '@app/shared/shared-main'
6import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
7import { Subscription } from 'rxjs'
8import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
9import { I18n } from '@ngx-translate/i18n-polyfill' 7import { I18n } from '@ngx-translate/i18n-polyfill'
10import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 8import { ServerConfig, VideoChannelUpdate } from '@shared/models'
11import { VideoChannelValidatorsService } from '@app/shared/forms/form-validators/video-channel-validators.service' 9import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit'
12import { ServerConfig } from '@shared/models'
13 10
14@Component({ 11@Component({
15 selector: 'my-account-video-channel-update', 12 selector: 'my-account-video-channel-update',
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels-routing.module.ts b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels-routing.module.ts
index 94037e18f..94037e18f 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels-routing.module.ts
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels-routing.module.ts
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.html
index b2e8210d3..b2e8210d3 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.html
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.html
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.scss
index 76fb2cde0..76fb2cde0 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.scss
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.ts
index 9caefe5b1..70510d7c9 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.ts
@@ -1,15 +1,10 @@
1import { Component, OnInit } from '@angular/core' 1import { ChartData } from 'chart.js'
2import { Notifier } from '@app/core' 2import { max, maxBy, min, minBy } from 'lodash-es'
3import { AuthService } from '../../core/auth'
4import { ConfirmService } from '../../core/confirm'
5import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
6import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
7import { ScreenService } from '@app/shared/misc/screen.service'
8import { User } from '@app/shared'
9import { flatMap } from 'rxjs/operators' 3import { flatMap } from 'rxjs/operators'
4import { Component, OnInit } from '@angular/core'
5import { AuthService, ConfirmService, Notifier, ScreenService, User } from '@app/core'
6import { VideoChannel, VideoChannelService } from '@app/shared/shared-main'
10import { I18n } from '@ngx-translate/i18n-polyfill' 7import { I18n } from '@ngx-translate/i18n-polyfill'
11import { min, minBy, max, maxBy } from 'lodash-es'
12import { ChartData } from 'chart.js'
13 8
14@Component({ 9@Component({
15 selector: 'my-account-video-channels', 10 selector: 'my-account-video-channels',
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.module.ts b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.module.ts
index 87d6b762f..f8c6ad56b 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.module.ts
+++ b/client/src/app/+my-account/+my-account-video-channels/my-account-video-channels.module.ts
@@ -1,16 +1,22 @@
1import { NgModule } from '@angular/core'
2import { ChartModule } from 'primeng/chart' 1import { ChartModule } from 'primeng/chart'
3import { MyAccountVideoChannelsRoutingModule } from './my-account-video-channels-routing.module' 2import { NgModule } from '@angular/core'
4import { MyAccountVideoChannelsComponent } from './my-account-video-channels.component' 3import { SharedFormModule } from '@app/shared/shared-forms'
4import { SharedGlobalIconModule } from '@app/shared/shared-icons'
5import { SharedMainModule } from '@app/shared/shared-main'
5import { MyAccountVideoChannelCreateComponent } from './my-account-video-channel-create.component' 6import { MyAccountVideoChannelCreateComponent } from './my-account-video-channel-create.component'
6import { MyAccountVideoChannelUpdateComponent } from './my-account-video-channel-update.component' 7import { MyAccountVideoChannelUpdateComponent } from './my-account-video-channel-update.component'
7import { SharedModule } from '@app/shared' 8import { MyAccountVideoChannelsRoutingModule } from './my-account-video-channels-routing.module'
9import { MyAccountVideoChannelsComponent } from './my-account-video-channels.component'
8 10
9@NgModule({ 11@NgModule({
10 imports: [ 12 imports: [
11 MyAccountVideoChannelsRoutingModule, 13 MyAccountVideoChannelsRoutingModule,
12 SharedModule, 14
13 ChartModule 15 ChartModule,
16
17 SharedMainModule,
18 SharedFormModule,
19 SharedGlobalIconModule
14 ], 20 ],
15 21
16 declarations: [ 22 declarations: [
diff --git a/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts b/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts
index e48c39cdf..03ec75e25 100644
--- a/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts
+++ b/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts
@@ -1,10 +1,10 @@
1import { Component } from '@angular/core' 1import { Component } from '@angular/core'
2import { GenericAccountBlocklistComponent, BlocklistComponentType } from '@app/shared/blocklist' 2import { BlocklistComponentType, GenericAccountBlocklistComponent } from '@app/shared/shared-moderation'
3 3
4@Component({ 4@Component({
5 selector: 'my-account-blocklist', 5 selector: 'my-account-blocklist',
6 styleUrls: [ '../../shared/blocklist/account-blocklist.component.scss' ], 6 styleUrls: [ '../../shared/shared-moderation/account-blocklist.component.scss' ],
7 templateUrl: '../../shared/blocklist/account-blocklist.component.html' 7 templateUrl: '../../shared/shared-moderation/account-blocklist.component.html'
8}) 8})
9export class MyAccountBlocklistComponent extends GenericAccountBlocklistComponent { 9export class MyAccountBlocklistComponent extends GenericAccountBlocklistComponent {
10 mode = BlocklistComponentType.Account 10 mode = BlocklistComponentType.Account
diff --git a/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts b/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts
index cfaba1c7b..9b983a197 100644
--- a/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts
+++ b/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts
@@ -1,10 +1,10 @@
1import { Component } from '@angular/core' 1import { Component } from '@angular/core'
2import { GenericServerBlocklistComponent, BlocklistComponentType } from '@app/shared/blocklist' 2import { BlocklistComponentType, GenericServerBlocklistComponent } from '@app/shared/shared-moderation'
3 3
4@Component({ 4@Component({
5 selector: 'my-account-server-blocklist', 5 selector: 'my-account-server-blocklist',
6 styleUrls: [ '../../+admin/moderation/moderation.component.scss', '../../shared/blocklist/server-blocklist.component.scss' ], 6 styleUrls: [ '../../+admin/moderation/moderation.component.scss', '../../shared/shared-moderation/server-blocklist.component.scss' ],
7 templateUrl: '../../shared/blocklist/server-blocklist.component.html' 7 templateUrl: '../../shared/shared-moderation/server-blocklist.component.html'
8}) 8})
9export class MyAccountServerBlocklistComponent extends GenericServerBlocklistComponent { 9export class MyAccountServerBlocklistComponent extends GenericServerBlocklistComponent {
10 mode = BlocklistComponentType.Account 10 mode = BlocklistComponentType.Account
diff --git a/client/src/app/+my-account/my-account-history/my-account-history.component.ts b/client/src/app/+my-account/my-account-history/my-account-history.component.ts
index 5f0ccee50..dc78b3d6e 100644
--- a/client/src/app/+my-account/my-account-history/my-account-history.component.ts
+++ b/client/src/app/+my-account/my-account-history/my-account-history.component.ts
@@ -1,17 +1,19 @@
1import { Component, OnDestroy, OnInit } from '@angular/core' 1import { Component, OnDestroy, OnInit } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router' 2import { ActivatedRoute, Router } from '@angular/router'
3import { immutableAssign } from '@app/shared/misc/utils' 3import {
4import { ComponentPagination } from '@app/shared/rest/component-pagination.model' 4 AuthService,
5import { AuthService } from '../../core/auth' 5 ComponentPagination,
6import { ConfirmService } from '../../core/confirm' 6 ConfirmService,
7import { AbstractVideoList } from '../../shared/video/abstract-video-list' 7 LocalStorageService,
8import { VideoService } from '../../shared/video/video.service' 8 Notifier,
9 ScreenService,
10 ServerService,
11 UserService
12} from '@app/core'
13import { immutableAssign } from '@app/helpers'
14import { UserHistoryService } from '@app/shared/shared-main'
15import { AbstractVideoList } from '@app/shared/shared-video-miniature'
9import { I18n } from '@ngx-translate/i18n-polyfill' 16import { I18n } from '@ngx-translate/i18n-polyfill'
10import { ScreenService } from '@app/shared/misc/screen.service'
11import { UserHistoryService } from '@app/shared/users/user-history.service'
12import { UserService } from '@app/shared'
13import { Notifier, ServerService } from '@app/core'
14import { LocalStorageService } from '@app/shared/misc/storage.service'
15 17
16@Component({ 18@Component({
17 selector: 'my-account-history', 19 selector: 'my-account-history',
@@ -38,7 +40,6 @@ export class MyAccountHistoryComponent extends AbstractVideoList implements OnIn
38 protected screenService: ScreenService, 40 protected screenService: ScreenService,
39 protected storageService: LocalStorageService, 41 protected storageService: LocalStorageService,
40 private confirmService: ConfirmService, 42 private confirmService: ConfirmService,
41 private videoService: VideoService,
42 private userHistoryService: UserHistoryService 43 private userHistoryService: UserHistoryService
43 ) { 44 ) {
44 super() 45 super()
diff --git a/client/src/app/+my-account/my-account-notifications/my-account-notifications.component.ts b/client/src/app/+my-account/my-account-notifications/my-account-notifications.component.ts
index a50cb0fb9..0c1427d96 100644
--- a/client/src/app/+my-account/my-account-notifications/my-account-notifications.component.ts
+++ b/client/src/app/+my-account/my-account-notifications/my-account-notifications.component.ts
@@ -1,5 +1,5 @@
1import { Component, ViewChild } from '@angular/core' 1import { Component, ViewChild } from '@angular/core'
2import { UserNotificationsComponent } from '@app/shared' 2import { UserNotificationsComponent } from '@app/shared/shared-main'
3 3
4@Component({ 4@Component({
5 templateUrl: './my-account-notifications.component.html', 5 templateUrl: './my-account-notifications.component.html',
diff --git a/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts b/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts
index d5682914e..0e62b5ca5 100644
--- a/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts
+++ b/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts
@@ -1,14 +1,10 @@
1import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core' 1import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'
2import { AuthService, Notifier } from '@app/core' 2import { AuthService, Notifier } from '@app/core'
3import { FormReactive } from '@app/shared' 3import { FormReactive, FormValidatorService, VideoAcceptOwnershipValidatorsService } from '@app/shared/shared-forms'
4import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 4import { VideoChannelService, VideoOwnershipService } from '@app/shared/shared-main'
5import { VideoOwnershipService } from '@app/shared/video-ownership'
6import { VideoChangeOwnership } from '../../../../../../shared/models/videos'
7import { VideoAcceptOwnershipValidatorsService } from '@app/shared/forms/form-validators'
8import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
9import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
10import { I18n } from '@ngx-translate/i18n-polyfill'
11import { NgbModal } from '@ng-bootstrap/ng-bootstrap' 5import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
6import { I18n } from '@ngx-translate/i18n-polyfill'
7import { VideoChangeOwnership, VideoChannel } from '@shared/models'
12 8
13@Component({ 9@Component({
14 selector: 'my-account-accept-ownership', 10 selector: 'my-account-accept-ownership',
diff --git a/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts b/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts
index f0a6303d1..5167732c2 100644
--- a/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts
+++ b/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts
@@ -1,10 +1,8 @@
1import { Component, OnInit, ViewChild } from '@angular/core'
2import { Notifier } from '@app/core'
3import { RestPagination, RestTable } from '@app/shared'
4import { SortMeta } from 'primeng/api' 1import { SortMeta } from 'primeng/api'
5import { VideoChangeOwnership } from '../../../../../shared' 2import { Component, OnInit, ViewChild } from '@angular/core'
6import { VideoOwnershipService } from '@app/shared/video-ownership' 3import { Notifier, RestPagination, RestTable } from '@app/core'
7import { Account } from '@app/shared/account/account.model' 4import { Account, VideoOwnershipService } from '@app/shared/shared-main'
5import { VideoChangeOwnership } from '@shared/models'
8import { MyAccountAcceptOwnershipComponent } from './my-account-accept-ownership/my-account-accept-ownership.component' 6import { MyAccountAcceptOwnershipComponent } from './my-account-accept-ownership/my-account-accept-ownership.component'
9 7
10@Component({ 8@Component({
diff --git a/client/src/app/+my-account/my-account-routing.module.ts b/client/src/app/+my-account/my-account-routing.module.ts
index f6b711e09..ac9cf4cfd 100644
--- a/client/src/app/+my-account/my-account-routing.module.ts
+++ b/client/src/app/+my-account/my-account-routing.module.ts
@@ -2,26 +2,20 @@ import { NgModule } from '@angular/core'
2import { RouterModule, Routes } from '@angular/router' 2import { RouterModule, Routes } from '@angular/router'
3import { MetaGuard } from '@ngx-meta/core' 3import { MetaGuard } from '@ngx-meta/core'
4import { LoginGuard } from '../core' 4import { LoginGuard } from '../core'
5import { MyAccountComponent } from './my-account.component' 5import { MyAccountBlocklistComponent } from './my-account-blocklist/my-account-blocklist.component'
6import { MyAccountServerBlocklistComponent } from './my-account-blocklist/my-account-server-blocklist.component'
7import { MyAccountHistoryComponent } from './my-account-history/my-account-history.component'
8import { MyAccountNotificationsComponent } from './my-account-notifications/my-account-notifications.component'
9import { MyAccountOwnershipComponent } from './my-account-ownership/my-account-ownership.component'
6import { MyAccountSettingsComponent } from './my-account-settings/my-account-settings.component' 10import { MyAccountSettingsComponent } from './my-account-settings/my-account-settings.component'
11import { MyAccountSubscriptionsComponent } from './my-account-subscriptions/my-account-subscriptions.component'
12import { MyAccountVideoImportsComponent } from './my-account-video-imports/my-account-video-imports.component'
13import { MyAccountVideoPlaylistCreateComponent } from './my-account-video-playlists/my-account-video-playlist-create.component'
14import { MyAccountVideoPlaylistElementsComponent } from './my-account-video-playlists/my-account-video-playlist-elements.component'
15import { MyAccountVideoPlaylistUpdateComponent } from './my-account-video-playlists/my-account-video-playlist-update.component'
16import { MyAccountVideoPlaylistsComponent } from './my-account-video-playlists/my-account-video-playlists.component'
7import { MyAccountVideosComponent } from './my-account-videos/my-account-videos.component' 17import { MyAccountVideosComponent } from './my-account-videos/my-account-videos.component'
8import { MyAccountVideoImportsComponent } from '@app/+my-account/my-account-video-imports/my-account-video-imports.component' 18import { MyAccountComponent } from './my-account.component'
9import { MyAccountSubscriptionsComponent } from '@app/+my-account/my-account-subscriptions/my-account-subscriptions.component'
10import { MyAccountOwnershipComponent } from '@app/+my-account/my-account-ownership/my-account-ownership.component'
11import { MyAccountBlocklistComponent } from '@app/+my-account/my-account-blocklist/my-account-blocklist.component'
12import { MyAccountServerBlocklistComponent } from '@app/+my-account/my-account-blocklist/my-account-server-blocklist.component'
13import { MyAccountHistoryComponent } from '@app/+my-account/my-account-history/my-account-history.component'
14import { MyAccountNotificationsComponent } from '@app/+my-account/my-account-notifications/my-account-notifications.component'
15import { MyAccountVideoPlaylistsComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlists.component'
16import {
17 MyAccountVideoPlaylistCreateComponent
18} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component'
19import {
20 MyAccountVideoPlaylistUpdateComponent
21} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component'
22import {
23 MyAccountVideoPlaylistElementsComponent
24} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component'
25 19
26const myAccountRoutes: Routes = [ 20const myAccountRoutes: Routes = [
27 { 21 {
@@ -46,7 +40,10 @@ const myAccountRoutes: Routes = [
46 40
47 { 41 {
48 path: 'video-channels', 42 path: 'video-channels',
49 loadChildren: () => import('./my-account-video-channels/my-account-video-channels.module').then(m => m.MyAccountVideoChannelsModule) 43 loadChildren: () => {
44 return import('./+my-account-video-channels/my-account-video-channels.module')
45 .then(m => m.MyAccountVideoChannelsModule)
46 }
50 }, 47 },
51 48
52 { 49 {
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts
index 9d406805f..5444b97ae 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts
@@ -1,12 +1,10 @@
1import { forkJoin } from 'rxjs'
2import { tap } from 'rxjs/operators'
1import { Component, OnInit } from '@angular/core' 3import { Component, OnInit } from '@angular/core'
2import { AuthService, Notifier, ServerService } from '@app/core' 4import { AuthService, ServerService, UserService } from '@app/core'
3import { FormReactive, UserService } from '../../../shared' 5import { FormReactive, FormValidatorService, UserValidatorsService } from '@app/shared/shared-forms'
4import { I18n } from '@ngx-translate/i18n-polyfill' 6import { I18n } from '@ngx-translate/i18n-polyfill'
5import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 7import { User } from '@shared/models'
6import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
7import { User } from '../../../../../../shared'
8import { tap } from 'rxjs/operators'
9import { forkJoin } from 'rxjs'
10 8
11@Component({ 9@Component({
12 selector: 'my-account-change-email', 10 selector: 'my-account-change-email',
@@ -21,7 +19,6 @@ export class MyAccountChangeEmailComponent extends FormReactive implements OnIni
21 constructor ( 19 constructor (
22 protected formValidatorService: FormValidatorService, 20 protected formValidatorService: FormValidatorService,
23 private userValidatorsService: UserValidatorsService, 21 private userValidatorsService: UserValidatorsService,
24 private notifier: Notifier,
25 private authService: AuthService, 22 private authService: AuthService,
26 private userService: UserService, 23 private userService: UserService,
27 private serverService: ServerService, 24 private serverService: ServerService,
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
index cbb068c7c..6a16f8a2c 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
@@ -1,11 +1,9 @@
1import { filter } from 'rxjs/operators'
1import { Component, OnInit } from '@angular/core' 2import { Component, OnInit } from '@angular/core'
2import { AuthService, Notifier } from '@app/core' 3import { AuthService, Notifier, UserService } from '@app/core'
3import { FormReactive, UserService } from '../../../shared' 4import { FormReactive, FormValidatorService, UserValidatorsService } from '@app/shared/shared-forms'
4import { I18n } from '@ngx-translate/i18n-polyfill' 5import { I18n } from '@ngx-translate/i18n-polyfill'
5import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 6import { User } from '@shared/models'
6import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
7import { filter } from 'rxjs/operators'
8import { User } from '../../../../../../shared'
9 7
10@Component({ 8@Component({
11 selector: 'my-account-change-password', 9 selector: 'my-account-change-password',
diff --git a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
index 25d862867..ae6ac5387 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
@@ -1,9 +1,6 @@
1import { Component, Input } from '@angular/core' 1import { Component, Input } from '@angular/core'
2import { Notifier } from '@app/core' 2import { AuthService, ConfirmService, Notifier, RedirectService, User, UserService } from '@app/core'
3import { AuthService, ConfirmService, RedirectService } from '../../../core'
4import { UserService } from '../../../shared'
5import { I18n } from '@ngx-translate/i18n-polyfill' 3import { I18n } from '@ngx-translate/i18n-polyfill'
6import { User } from '@app/shared'
7 4
8@Component({ 5@Component({
9 selector: 'my-account-danger-zone', 6 selector: 'my-account-danger-zone',
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
deleted file mode 100644
index 62fce79a8..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-interface/index.ts
+++ /dev/null
@@ -1 +0,0 @@
1export * 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
deleted file mode 100644
index 0d0ddc0f2..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.html
+++ /dev/null
@@ -1,17 +0,0 @@
1<form role="form" (ngSubmit)="updateInterfaceSettings()" [formGroup]="form">
2
3 <div class="form-group">
4 <label i18n for="theme">Theme</label>
5
6 <div class="peertube-select-container">
7 <select formControlName="theme" id="theme" class="form-control">
8 <option i18n value="instance-default">instance default</option>
9 <option i18n value="default">peertube default</option>
10
11 <option *ngFor="let theme of availableThemes" [value]="theme">{{ theme }}</option>
12 </select>
13 </div>
14 </div>
15
16 <input *ngIf="!reactiveUpdate" type="submit" class="mt-0" i18n-value value="Save" [disabled]="!form.valid">
17</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
deleted file mode 100644
index 7818dfc02..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.scss
+++ /dev/null
@@ -1,21 +0,0 @@
1@import '_variables';
2@import '_mixins';
3
4label {
5 font-weight: $font-regular;
6 font-size: 100%;
7}
8
9input[type=submit] {
10 @include peertube-button;
11 @include orange-button;
12
13 display: block;
14 margin-top: 15px;
15}
16
17.peertube-select-container {
18 @include peertube-select-container(340px);
19
20 margin-bottom: 30px;
21}
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
deleted file mode 100644
index b6c17c0e3..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-interface/my-account-interface-settings.component.ts
+++ /dev/null
@@ -1,89 +0,0 @@
1import { Component, Input, OnInit, OnDestroy } from '@angular/core'
2import { Notifier, ServerService } from '@app/core'
3import { ServerConfig, UserUpdateMe } from '../../../../../../shared'
4import { AuthService } from '../../../core'
5import { FormReactive } from '../../../shared/forms/form-reactive'
6import { User, UserService } from '../../../shared/users'
7import { I18n } from '@ngx-translate/i18n-polyfill'
8import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
9import { Subject, Subscription } from 'rxjs'
10
11@Component({
12 selector: 'my-account-interface-settings',
13 templateUrl: './my-account-interface-settings.component.html',
14 styleUrls: [ './my-account-interface-settings.component.scss' ]
15})
16export class MyAccountInterfaceSettingsComponent extends FormReactive implements OnInit, OnDestroy {
17 @Input() user: User = null
18 @Input() reactiveUpdate = false
19 @Input() notifyOnUpdate = true
20 @Input() userInformationLoaded: Subject<any>
21
22 formValuesWatcher: Subscription
23
24 private serverConfig: ServerConfig
25
26 constructor (
27 protected formValidatorService: FormValidatorService,
28 private authService: AuthService,
29 private notifier: Notifier,
30 private userService: UserService,
31 private serverService: ServerService,
32 private i18n: I18n
33 ) {
34 super()
35 }
36
37 get availableThemes () {
38 return this.serverConfig.theme.registered
39 .map(t => t.name)
40 }
41
42 ngOnInit () {
43 this.serverConfig = this.serverService.getTmpConfig()
44 this.serverService.getConfig()
45 .subscribe(config => this.serverConfig = config)
46
47 this.buildForm({
48 theme: null
49 })
50
51 this.userInformationLoaded
52 .subscribe(() => {
53 this.form.patchValue({
54 theme: this.user.theme
55 })
56
57 if (this.reactiveUpdate) {
58 this.formValuesWatcher = this.form.valueChanges.subscribe(val => this.updateInterfaceSettings())
59 }
60 })
61 }
62
63 ngOnDestroy () {
64 this.formValuesWatcher?.unsubscribe()
65 }
66
67 updateInterfaceSettings () {
68 const theme = this.form.value['theme']
69
70 const details: UserUpdateMe = {
71 theme
72 }
73
74 if (this.authService.isLoggedIn()) {
75 this.userService.updateMyProfile(details).subscribe(
76 () => {
77 this.authService.refreshUserInformation()
78
79 if (this.notifyOnUpdate) this.notifier.success(this.i18n('Interface settings updated.'))
80 },
81
82 err => this.notifier.error(err.message)
83 )
84 } else {
85 this.userService.updateMyAnonymousProfile(details)
86 if (this.notifyOnUpdate) this.notifier.success(this.i18n('Interface settings updated.'))
87 }
88 }
89}
diff --git a/client/src/app/+my-account/my-account-settings/my-account-notification-preferences/my-account-notification-preferences.component.ts b/client/src/app/+my-account/my-account-settings/my-account-notification-preferences/my-account-notification-preferences.component.ts
index af17a0352..cfa514b26 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-notification-preferences/my-account-notification-preferences.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-notification-preferences/my-account-notification-preferences.component.ts
@@ -1,11 +1,10 @@
1import { debounce } from 'lodash-es'
2import { Subject } from 'rxjs'
1import { Component, Input, OnInit } from '@angular/core' 3import { Component, Input, OnInit } from '@angular/core'
2import { User } from '@app/shared' 4import { Notifier, ServerService, User } from '@app/core'
5import { UserNotificationService } from '@app/shared/shared-main'
3import { I18n } from '@ngx-translate/i18n-polyfill' 6import { I18n } from '@ngx-translate/i18n-polyfill'
4import { Subject } from 'rxjs' 7import { UserNotificationSetting, UserNotificationSettingValue, UserRight } from '@shared/models'
5import { UserNotificationSetting, UserNotificationSettingValue, UserRight } from '../../../../../../shared'
6import { Notifier, ServerService } from '@app/core'
7import { debounce } from 'lodash-es'
8import { UserNotificationService } from '@app/shared/users/user-notification.service'
9 8
10@Component({ 9@Component({
11 selector: 'my-account-notification-preferences', 10 selector: 'my-account-notification-preferences',
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 fcad5a6c2..b0d8494e7 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,11 +1,8 @@
1import { Subject } from 'rxjs'
1import { Component, Input, OnInit } from '@angular/core' 2import { Component, Input, OnInit } from '@angular/core'
2import { Notifier } from '@app/core' 3import { Notifier, User, UserService } from '@app/core'
3import { FormReactive, UserService } from '../../../shared' 4import { FormReactive, FormValidatorService, UserValidatorsService } from '@app/shared/shared-forms'
4import { User } from '@app/shared'
5import { I18n } from '@ngx-translate/i18n-polyfill' 5import { I18n } from '@ngx-translate/i18n-polyfill'
6import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
7import { Subject } from 'rxjs'
8import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
9 6
10@Component({ 7@Component({
11 selector: 'my-account-profile', 8 selector: 'my-account-profile',
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 040b2130f..2826d8d83 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
@@ -34,7 +34,7 @@
34 </div> 34 </div>
35 35
36 <div class="form-group form-group-right col-12 col-lg-8 col-xl-9"> 36 <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
37 <my-account-video-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-video-settings> 37 <my-user-video-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-user-video-settings>
38 </div> 38 </div>
39</div> 39</div>
40 40
@@ -55,7 +55,7 @@
55 </div> 55 </div>
56 56
57 <div class="form-group form-group-right col-12 col-lg-8 col-xl-9"> 57 <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
58 <my-account-interface-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-interface-settings> 58 <my-user-interface-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-user-interface-settings>
59 </div> 59 </div>
60</div> 60</div>
61 61
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 f73f3aa1e..4800be24b 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,11 +1,8 @@
1import { Component, OnInit, AfterViewChecked } from '@angular/core'
2import { Notifier } from '@app/core'
3import { BytesPipe } from 'ngx-pipes' 1import { BytesPipe } from 'ngx-pipes'
4import { AuthService } from '../../core'
5import { User } from '../../shared'
6import { UserService } from '../../shared/users'
7import { I18n } from '@ngx-translate/i18n-polyfill'
8import { ViewportScroller } from '@angular/common' 2import { ViewportScroller } from '@angular/common'
3import { AfterViewChecked, Component, OnInit } from '@angular/core'
4import { AuthService, Notifier, User, UserService } from '@app/core'
5import { I18n } from '@ngx-translate/i18n-polyfill'
9 6
10@Component({ 7@Component({
11 selector: 'my-account-settings', 8 selector: 'my-account-settings',
diff --git a/client/src/app/+my-account/my-account-settings/my-account-video-settings/index.ts b/client/src/app/+my-account/my-account-settings/my-account-video-settings/index.ts
deleted file mode 100644
index 1253bd369..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-video-settings/index.ts
+++ /dev/null
@@ -1 +0,0 @@
1export * from './my-account-video-settings.component'
diff --git a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.html b/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.html
deleted file mode 100644
index 0dda33af2..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.html
+++ /dev/null
@@ -1,75 +0,0 @@
1<form role="form" (ngSubmit)="updateDetails()" [formGroup]="form">
2 <div class="form-group form-group-select">
3 <label i18n for="nsfwPolicy">Default policy on videos containing sensitive content</label>
4 <my-help>
5 <ng-template ptTemplate="customHtml">
6 <ng-container i18n>
7 With <strong>Do not list</strong> or <strong>Blur thumbnails</strong>, a confirmation will be requested to watch the video.
8 </ng-container>
9 </ng-template>
10 </my-help>
11
12 <div class="peertube-select-container">
13 <select id="nsfwPolicy" formControlName="nsfwPolicy" class="form-control">
14 <option i18n value="undefined" disabled>Policy for sensitive videos</option>
15 <option i18n value="do_not_list">Do not list</option>
16 <option i18n value="blur">Blur thumbnails</option>
17 <option i18n value="display">Display</option>
18 </select>
19 </div>
20 </div>
21
22 <div class="form-group form-group-select">
23 <label i18n for="videoLanguages">Only display videos in the following languages/subtitles</label>
24 <my-help>
25 <ng-template ptTemplate="customHtml">
26 <ng-container i18n>In Recently added, Trending, Local, Most liked and Search pages</ng-container>
27 </ng-template>
28 </my-help>
29
30 <div>
31 <p-multiSelect
32 inputId="videoLanguages" [options]="languageItems" formControlName="videoLanguages" [showToggleAll]="true"
33 [defaultLabel]="getDefaultVideoLanguageLabel()" [selectedItemsLabel]="getSelectedVideoLanguageLabel()"
34 emptyFilterMessage="No results found" i18n-emptyFilterMessage
35 ></p-multiSelect>
36 </div>
37 </div>
38
39 <ng-content select="inner-title"></ng-content>
40
41 <div class="form-group">
42 <my-peertube-checkbox
43 inputName="webTorrentEnabled" formControlName="webTorrentEnabled" [recommended]="true"
44 i18n-labelText labelText="Help share videos being played"
45 >
46 <ng-container ngProjectAs="description">
47 <span i18n>The <a routerLink="/about/peertube" fragment="privacy">sharing system</a> implies that some technical information about your system (such as a public IP address) can be sent to other peers, but greatly helps to reduce server load.</span>
48 </ng-container>
49 </my-peertube-checkbox>
50 </div>
51
52 <div class="form-group">
53 <my-peertube-checkbox
54 inputName="autoPlayVideo" formControlName="autoPlayVideo"
55 i18n-labelText labelText="Automatically play videos"
56 >
57 <ng-container ngProjectAs="description">
58 <span i18n>When on a video page, directly start playing the video.</span>
59 </ng-container>
60 </my-peertube-checkbox>
61 </div>
62
63 <div class="form-group">
64 <my-peertube-checkbox
65 inputName="autoPlayNextVideo" formControlName="autoPlayNextVideo"
66 i18n-labelText labelText="Automatically start playing the next video"
67 >
68 <ng-container ngProjectAs="description">
69 <span i18n>When a video ends, follow up with the next suggested video.</span>
70 </ng-container>
71 </my-peertube-checkbox>
72 </div>
73
74 <input *ngIf="!reactiveUpdate" type="submit" i18n-value value="Save" [disabled]="!form.valid">
75</form>
diff --git a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.scss b/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.scss
deleted file mode 100644
index 430250b87..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.scss
+++ /dev/null
@@ -1,24 +0,0 @@
1@import '_variables';
2@import '_mixins';
3
4label {
5 font-weight: $font-regular;
6 font-size: 100%;
7}
8
9input[type=submit] {
10 @include peertube-button;
11 @include orange-button;
12
13 margin-top: 15px;
14}
15
16.peertube-select-container {
17 @include peertube-select-container(340px);
18
19 margin-bottom: 30px;
20}
21
22.form-group-select {
23 margin-bottom: 30px;
24}
diff --git a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts
deleted file mode 100644
index 0aaa54cd7..000000000
--- a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts
+++ /dev/null
@@ -1,142 +0,0 @@
1import { Component, Input, OnInit, OnDestroy } from '@angular/core'
2import { Notifier, ServerService } from '@app/core'
3import { UserUpdateMe } from '../../../../../../shared/models/users'
4import { User, UserService } from '@app/shared/users'
5import { AuthService } from '../../../core'
6import { FormReactive } from '@app/shared/forms/form-reactive'
7import { I18n } from '@ngx-translate/i18n-polyfill'
8import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
9import { forkJoin, Subject, Subscription } from 'rxjs'
10import { SelectItem } from 'primeng/api'
11import { first } from 'rxjs/operators'
12import { NSFWPolicyType } from '@shared/models/videos/nsfw-policy.type'
13import { pick } from 'lodash-es'
14
15@Component({
16 selector: 'my-account-video-settings',
17 templateUrl: './my-account-video-settings.component.html',
18 styleUrls: [ './my-account-video-settings.component.scss' ]
19})
20export class MyAccountVideoSettingsComponent extends FormReactive implements OnInit, OnDestroy {
21 @Input() user: User = null
22 @Input() reactiveUpdate = false
23 @Input() notifyOnUpdate = true
24 @Input() userInformationLoaded: Subject<any>
25
26 languageItems: SelectItem[] = []
27 defaultNSFWPolicy: NSFWPolicyType
28 formValuesWatcher: Subscription
29
30 constructor (
31 protected formValidatorService: FormValidatorService,
32 private authService: AuthService,
33 private notifier: Notifier,
34 private userService: UserService,
35 private serverService: ServerService,
36 private i18n: I18n
37 ) {
38 super()
39 }
40
41 ngOnInit () {
42 let oldForm: any
43
44 this.buildForm({
45 nsfwPolicy: null,
46 webTorrentEnabled: null,
47 autoPlayVideo: null,
48 autoPlayNextVideo: null,
49 videoLanguages: null
50 })
51
52 forkJoin([
53 this.serverService.getVideoLanguages(),
54 this.serverService.getConfig(),
55 this.userInformationLoaded.pipe(first())
56 ]).subscribe(([ languages, config ]) => {
57 this.languageItems = [ { label: this.i18n('Unknown language'), value: '_unknown' } ]
58 this.languageItems = this.languageItems
59 .concat(languages.map(l => ({ label: l.label, value: l.id })))
60
61 const videoLanguages = this.user.videoLanguages
62 ? this.user.videoLanguages
63 : this.languageItems.map(l => l.value)
64
65 this.defaultNSFWPolicy = config.instance.defaultNSFWPolicy
66
67 this.form.patchValue({
68 nsfwPolicy: this.user.nsfwPolicy || this.defaultNSFWPolicy,
69 webTorrentEnabled: this.user.webTorrentEnabled,
70 autoPlayVideo: this.user.autoPlayVideo === true,
71 autoPlayNextVideo: this.user.autoPlayNextVideo,
72 videoLanguages
73 })
74
75 if (this.reactiveUpdate) {
76 oldForm = { ...this.form.value }
77 this.formValuesWatcher = this.form.valueChanges.subscribe((formValue: any) => {
78 const updatedKey = Object.keys(formValue).find(k => formValue[k] !== oldForm[k])
79 oldForm = { ...this.form.value }
80 this.updateDetails([updatedKey])
81 })
82 }
83 })
84 }
85
86 ngOnDestroy () {
87 this.formValuesWatcher?.unsubscribe()
88 }
89
90 updateDetails (onlyKeys?: string[]) {
91 const nsfwPolicy = this.form.value[ 'nsfwPolicy' ]
92 const webTorrentEnabled = this.form.value['webTorrentEnabled']
93 const autoPlayVideo = this.form.value['autoPlayVideo']
94 const autoPlayNextVideo = this.form.value['autoPlayNextVideo']
95
96 let videoLanguages: string[] = this.form.value['videoLanguages']
97 if (Array.isArray(videoLanguages)) {
98 if (videoLanguages.length === this.languageItems.length) {
99 videoLanguages = null // null means "All"
100 } else if (videoLanguages.length > 20) {
101 this.notifier.error('Too many languages are enabled. Please enable them all or stay below 20 enabled languages.')
102 return
103 } else if (videoLanguages.length === 0) {
104 this.notifier.error('You need to enabled at least 1 video language.')
105 return
106 }
107 }
108
109 let details: UserUpdateMe = {
110 nsfwPolicy,
111 webTorrentEnabled,
112 autoPlayVideo,
113 autoPlayNextVideo,
114 videoLanguages
115 }
116
117 if (onlyKeys) details = pick(details, onlyKeys)
118
119 if (this.authService.isLoggedIn()) {
120 this.userService.updateMyProfile(details).subscribe(
121 () => {
122 this.authService.refreshUserInformation()
123
124 if (this.notifyOnUpdate) this.notifier.success(this.i18n('Video settings updated.'))
125 },
126
127 err => this.notifier.error(err.message)
128 )
129 } else {
130 this.userService.updateMyAnonymousProfile(details)
131 if (this.notifyOnUpdate) this.notifier.success(this.i18n('Display/Video settings updated.'))
132 }
133 }
134
135 getDefaultVideoLanguageLabel () {
136 return this.i18n('No language')
137 }
138
139 getSelectedVideoLanguageLabel () {
140 return this.i18n('{{\'{0} languages selected')
141 }
142}
diff --git a/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts b/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts
index b347fc3fe..390293a28 100644
--- a/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts
+++ b/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts
@@ -1,9 +1,8 @@
1import { Component, OnInit } from '@angular/core'
2import { Notifier } from '@app/core'
3import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
4import { UserSubscriptionService } from '@app/shared/user-subscription'
5import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
6import { Subject } from 'rxjs' 1import { Subject } from 'rxjs'
2import { Component, OnInit } from '@angular/core'
3import { ComponentPagination, Notifier } from '@app/core'
4import { VideoChannel } from '@app/shared/shared-main'
5import { UserSubscriptionService } from '@app/shared/shared-user-subscription'
7 6
8@Component({ 7@Component({
9 selector: 'my-account-subscriptions', 8 selector: 'my-account-subscriptions',
diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
index 4452154eb..42ddb0ee2 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
@@ -1,9 +1,8 @@
1import { Component, OnInit } from '@angular/core'
2import { RestPagination, RestTable } from '@app/shared'
3import { SortMeta } from 'primeng/api' 1import { SortMeta } from 'primeng/api'
4import { Notifier } from '@app/core' 2import { Component, OnInit } from '@angular/core'
5import { VideoImport, VideoImportState } from '../../../../../shared/models/videos' 3import { Notifier, RestPagination, RestTable } from '@app/core'
6import { VideoImportService } from '@app/shared/video-import' 4import { VideoImportService } from '@app/shared/shared-main'
5import { VideoImport, VideoImportState } from '@shared/models'
7 6
8@Component({ 7@Component({
9 selector: 'my-account-video-imports', 8 selector: 'my-account-video-imports',
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component.ts b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component.ts
index e47e5f980..e72ae2366 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component.ts
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component.ts
@@ -1,14 +1,13 @@
1import { Component, OnInit } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { Router } from '@angular/router' 2import { Router } from '@angular/router'
3import { AuthService, Notifier, ServerService } from '@app/core' 3import { AuthService, Notifier, ServerService } from '@app/core'
4import { MyAccountVideoPlaylistEdit } from './my-account-video-playlist-edit' 4import { FormValidatorService, VideoPlaylistValidatorsService } from '@app/shared/shared-forms'
5import { VideoPlaylistService } from '@app/shared/shared-video-playlist'
5import { I18n } from '@ngx-translate/i18n-polyfill' 6import { I18n } from '@ngx-translate/i18n-polyfill'
6import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
7import { VideoPlaylistValidatorsService } from '@app/shared'
8import { VideoPlaylistCreate } from '@shared/models/videos/playlist/video-playlist-create.model' 7import { VideoPlaylistCreate } from '@shared/models/videos/playlist/video-playlist-create.model'
9import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
10import { VideoPlaylistPrivacy } from '@shared/models/videos/playlist/video-playlist-privacy.model' 8import { VideoPlaylistPrivacy } from '@shared/models/videos/playlist/video-playlist-privacy.model'
11import { populateAsyncUserVideoChannels } from '@app/shared/misc/utils' 9import { MyAccountVideoPlaylistEdit } from './my-account-video-playlist-edit'
10import { populateAsyncUserVideoChannels } from '@app/helpers'
12 11
13@Component({ 12@Component({
14 selector: 'my-account-video-playlist-create', 13 selector: 'my-account-video-playlist-create',
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-edit.ts b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-edit.ts
index e94188786..7ae8de75e 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-edit.ts
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-edit.ts
@@ -1,6 +1,6 @@
1import { FormReactive } from '@app/shared' 1import { FormReactive } from '@app/shared/shared-forms'
2import { VideoPlaylist } from '@shared/models/videos/playlist/video-playlist.model'
3import { VideoConstant, VideoPlaylistPrivacy } from '@shared/models' 2import { VideoConstant, VideoPlaylistPrivacy } from '@shared/models'
3import { VideoPlaylist } from '@shared/models/videos/playlist/video-playlist.model'
4 4
5export abstract class MyAccountVideoPlaylistEdit extends FormReactive { 5export abstract class MyAccountVideoPlaylistEdit extends FormReactive {
6 // Declare it here to avoid errors in create template 6 // Declare it here to avoid errors in create template
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.ts b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.ts
index 366640618..0add81c38 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.ts
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.ts
@@ -1,16 +1,9 @@
1import { Component, OnDestroy, OnInit } from '@angular/core'
2import { Notifier, ServerService } from '@app/core'
3import { AuthService } from '../../core/auth'
4import { ConfirmService } from '../../core/confirm'
5import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
6import { Subject, Subscription } from 'rxjs' 1import { Subject, Subscription } from 'rxjs'
7import { ActivatedRoute } from '@angular/router'
8import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
9import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
10import { I18n } from '@ngx-translate/i18n-polyfill'
11import { ScreenService } from '@app/shared/misc/screen.service'
12import { CdkDragDrop } from '@angular/cdk/drag-drop' 2import { CdkDragDrop } from '@angular/cdk/drag-drop'
13import { VideoPlaylistElement } from '@app/shared/video-playlist/video-playlist-element.model' 3import { Component, OnDestroy, OnInit } from '@angular/core'
4import { ActivatedRoute } from '@angular/router'
5import { ComponentPagination, Notifier, ScreenService } from '@app/core'
6import { VideoPlaylist, VideoPlaylistElement, VideoPlaylistService } from '@app/shared/shared-video-playlist'
14 7
15@Component({ 8@Component({
16 selector: 'my-account-video-playlist-elements', 9 selector: 'my-account-video-playlist-elements',
@@ -33,12 +26,8 @@ export class MyAccountVideoPlaylistElementsComponent implements OnInit, OnDestro
33 private paramsSub: Subscription 26 private paramsSub: Subscription
34 27
35 constructor ( 28 constructor (
36 private authService: AuthService,
37 private serverService: ServerService,
38 private notifier: Notifier, 29 private notifier: Notifier,
39 private confirmService: ConfirmService,
40 private route: ActivatedRoute, 30 private route: ActivatedRoute,
41 private i18n: I18n,
42 private screenService: ScreenService, 31 private screenService: ScreenService,
43 private videoPlaylistService: VideoPlaylistService 32 private videoPlaylistService: VideoPlaylistService
44 ) {} 33 ) {}
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component.ts b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component.ts
index 2f85cdd96..6787fb757 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component.ts
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component.ts
@@ -1,16 +1,14 @@
1import { forkJoin, Subscription } from 'rxjs'
2import { map, switchMap } from 'rxjs/operators'
1import { Component, OnDestroy, OnInit } from '@angular/core' 3import { Component, OnDestroy, OnInit } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router' 4import { ActivatedRoute, Router } from '@angular/router'
3import { AuthService, Notifier, ServerService } from '@app/core' 5import { AuthService, Notifier, ServerService } from '@app/core'
4import { forkJoin, Subscription } from 'rxjs' 6import { populateAsyncUserVideoChannels } from '@app/helpers'
7import { FormValidatorService, VideoPlaylistValidatorsService } from '@app/shared/shared-forms'
8import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist'
5import { I18n } from '@ngx-translate/i18n-polyfill' 9import { I18n } from '@ngx-translate/i18n-polyfill'
6import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 10import { VideoPlaylistUpdate } from '@shared/models'
7import { MyAccountVideoPlaylistEdit } from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-edit' 11import { MyAccountVideoPlaylistEdit } from './my-account-video-playlist-edit'
8import { populateAsyncUserVideoChannels } from '@app/shared/misc/utils'
9import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
10import { VideoPlaylistValidatorsService } from '@app/shared'
11import { VideoPlaylistUpdate } from '@shared/models/videos/playlist/video-playlist-update.model'
12import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
13import { delayWhen, map, switchMap } from 'rxjs/operators'
14 12
15@Component({ 13@Component({
16 selector: 'my-account-video-playlist-update', 14 selector: 'my-account-video-playlist-update',
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.ts b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.ts
index c6728cc30..ea3bcde4f 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.ts
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.ts
@@ -1,15 +1,10 @@
1import { Subject } from 'rxjs'
2import { debounceTime, flatMap } from 'rxjs/operators'
1import { Component, OnInit } from '@angular/core' 3import { Component, OnInit } from '@angular/core'
2import { Notifier } from '@app/core' 4import { AuthService, ComponentPagination, ConfirmService, Notifier, User } from '@app/core'
3import { AuthService } from '../../core/auth' 5import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist'
4import { ConfirmService } from '../../core/confirm'
5import { User } from '@app/shared'
6import { flatMap, debounceTime } from 'rxjs/operators'
7import { I18n } from '@ngx-translate/i18n-polyfill' 6import { I18n } from '@ngx-translate/i18n-polyfill'
8import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
9import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
10import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
11import { VideoPlaylistType } from '@shared/models' 7import { VideoPlaylistType } from '@shared/models'
12import { Subject } from 'rxjs'
13 8
14@Component({ 9@Component({
15 selector: 'my-account-video-playlists', 10 selector: 'my-account-video-playlists',
diff --git a/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts b/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts
index 0ec033eaf..3cfe8fb38 100644
--- a/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts
+++ b/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts
@@ -1,21 +1,15 @@
1import { concat, Observable, Subject } from 'rxjs' 1import { concat, Observable, Subject } from 'rxjs'
2import { tap, toArray, debounceTime } from 'rxjs/operators' 2import { debounceTime, tap, toArray } from 'rxjs/operators'
3import { Component, ViewChild, OnInit } from '@angular/core' 3import { Component, OnInit, ViewChild } from '@angular/core'
4import { ActivatedRoute, Router } from '@angular/router' 4import { ActivatedRoute, Router } from '@angular/router'
5import { immutableAssign } from '@app/shared/misc/utils' 5import { AuthService, ComponentPagination, ConfirmService, Notifier, ScreenService, ServerService } from '@app/core'
6import { ComponentPagination } from '@app/shared/rest/component-pagination.model' 6import { DisableForReuseHook } from '@app/core/routing/disable-for-reuse-hook'
7import { Notifier, ServerService } from '@app/core' 7import { immutableAssign } from '@app/helpers'
8import { AuthService } from '../../core/auth' 8import { Video, VideoService } from '@app/shared/shared-main'
9import { ConfirmService } from '../../core/confirm' 9import { MiniatureDisplayOptions, OwnerDisplayType, SelectionType, VideosSelectionComponent } from '@app/shared/shared-video-miniature'
10import { Video } from '../../shared/video/video.model'
11import { VideoService } from '../../shared/video/video.service'
12import { I18n } from '@ngx-translate/i18n-polyfill' 10import { I18n } from '@ngx-translate/i18n-polyfill'
13import { ScreenService } from '@app/shared/misc/screen.service' 11import { VideoSortField } from '@shared/models'
14import { VideoChangeOwnershipComponent } from './video-change-ownership/video-change-ownership.component' 12import { VideoChangeOwnershipComponent } from './video-change-ownership/video-change-ownership.component'
15import { MiniatureDisplayOptions, OwnerDisplayType } from '@app/shared/video/video-miniature.component'
16import { SelectionType, VideosSelectionComponent } from '@app/shared/video/videos-selection.component'
17import { VideoSortField } from '@app/shared/video/sort-field.type'
18import { DisableForReuseHook } from '@app/core/routing/disable-for-reuse-hook'
19 13
20@Component({ 14@Component({
21 selector: 'my-account-videos', 15 selector: 'my-account-videos',
diff --git a/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts b/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts
index f4e2b5955..18e716a09 100644
--- a/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts
+++ b/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts
@@ -1,11 +1,9 @@
1import { Component, ElementRef, OnInit, ViewChild } from '@angular/core' 1import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'
2import { Notifier } from '@app/core' 2import { Notifier, UserService } from '@app/core'
3import { FormReactive, FormValidatorService, VideoChangeOwnershipValidatorsService } from '@app/shared/shared-forms'
4import { Video, VideoOwnershipService } from '@app/shared/shared-main'
3import { NgbModal } from '@ng-bootstrap/ng-bootstrap' 5import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
4import { FormReactive, UserService } from '../../../shared/index'
5import { Video } from '@app/shared/video/video.model'
6import { I18n } from '@ngx-translate/i18n-polyfill' 6import { I18n } from '@ngx-translate/i18n-polyfill'
7import { FormValidatorService, VideoChangeOwnershipValidatorsService } from '@app/shared'
8import { VideoOwnershipService } from '@app/shared/video-ownership'
9 7
10@Component({ 8@Component({
11 selector: 'my-video-change-ownership', 9 selector: 'my-video-change-ownership',
diff --git a/client/src/app/+my-account/my-account.component.ts b/client/src/app/+my-account/my-account.component.ts
index ca447c054..ea4da676a 100644
--- a/client/src/app/+my-account/my-account.component.ts
+++ b/client/src/app/+my-account/my-account.component.ts
@@ -1,8 +1,8 @@
1import { Component, OnInit } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { ServerService } from '@app/core' 2import { ServerService } from '@app/core'
3import { I18n } from '@ngx-translate/i18n-polyfill' 3import { I18n } from '@ngx-translate/i18n-polyfill'
4import { TopMenuDropdownParam } from '@app/shared/menu/top-menu-dropdown.component'
5import { ServerConfig } from '@shared/models' 4import { ServerConfig } from '@shared/models'
5import { TopMenuDropdownParam } from './top-menu-dropdown.component'
6 6
7@Component({ 7@Component({
8 selector: 'my-my-account', 8 selector: 'my-my-account',
diff --git a/client/src/app/+my-account/my-account.module.ts b/client/src/app/+my-account/my-account.module.ts
index 72b9fd9f2..9a11a89ea 100644
--- a/client/src/app/+my-account/my-account.module.ts
+++ b/client/src/app/+my-account/my-account.module.ts
@@ -1,47 +1,55 @@
1import { NgModule } from '@angular/core'
2import { TableModule } from 'primeng/table'
3import { AutoCompleteModule } from 'primeng/autocomplete' 1import { AutoCompleteModule } from 'primeng/autocomplete'
4import { InputSwitchModule } from 'primeng/inputswitch' 2import { InputSwitchModule } from 'primeng/inputswitch'
5import { SharedModule } from '../shared' 3import { TableModule } from 'primeng/table'
4import { DragDropModule } from '@angular/cdk/drag-drop'
5import { NgModule } from '@angular/core'
6import { SharedGlobalIconModule } from '@app/shared/shared-icons'
7import { SharedMainModule } from '@app/shared/shared-main'
8import { SharedModerationModule } from '@app/shared/shared-moderation'
9import { SharedUserInterfaceSettingsModule } from '@app/shared/shared-user-settings'
10import { SharedUserSubscriptionModule } from '@app/shared/shared-user-subscription/shared-user-subscription.module'
11import { SharedVideoMiniatureModule } from '@app/shared/shared-video-miniature'
12import { SharedVideoPlaylistModule } from '@app/shared/shared-video-playlist/shared-video-playlist.module'
13import { MyAccountBlocklistComponent } from './my-account-blocklist/my-account-blocklist.component'
14import { MyAccountServerBlocklistComponent } from './my-account-blocklist/my-account-server-blocklist.component'
15import { MyAccountHistoryComponent } from './my-account-history/my-account-history.component'
16import { MyAccountNotificationsComponent } from './my-account-notifications/my-account-notifications.component'
17import { MyAccountAcceptOwnershipComponent } from './my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component'
18import { MyAccountOwnershipComponent } from './my-account-ownership/my-account-ownership.component'
6import { MyAccountRoutingModule } from './my-account-routing.module' 19import { MyAccountRoutingModule } from './my-account-routing.module'
20import { MyAccountChangeEmailComponent } from './my-account-settings/my-account-change-email'
7import { MyAccountChangePasswordComponent } from './my-account-settings/my-account-change-password/my-account-change-password.component' 21import { MyAccountChangePasswordComponent } from './my-account-settings/my-account-change-password/my-account-change-password.component'
22import { MyAccountDangerZoneComponent } from './my-account-settings/my-account-danger-zone'
23import { MyAccountNotificationPreferencesComponent } from './my-account-settings/my-account-notification-preferences'
24import { MyAccountProfileComponent } from './my-account-settings/my-account-profile/my-account-profile.component'
8import { MyAccountSettingsComponent } from './my-account-settings/my-account-settings.component' 25import { MyAccountSettingsComponent } from './my-account-settings/my-account-settings.component'
9import { MyAccountComponent } from './my-account.component' 26import { MyAccountSubscriptionsComponent } from './my-account-subscriptions/my-account-subscriptions.component'
27import { MyAccountVideoImportsComponent } from './my-account-video-imports/my-account-video-imports.component'
28import { MyAccountVideoPlaylistCreateComponent } from './my-account-video-playlists/my-account-video-playlist-create.component'
29import { MyAccountVideoPlaylistElementsComponent } from './my-account-video-playlists/my-account-video-playlist-elements.component'
30import { MyAccountVideoPlaylistUpdateComponent } from './my-account-video-playlists/my-account-video-playlist-update.component'
31import { MyAccountVideoPlaylistsComponent } from './my-account-video-playlists/my-account-video-playlists.component'
10import { MyAccountVideosComponent } from './my-account-videos/my-account-videos.component' 32import { MyAccountVideosComponent } from './my-account-videos/my-account-videos.component'
11import { VideoChangeOwnershipComponent } from './my-account-videos/video-change-ownership/video-change-ownership.component' 33import { VideoChangeOwnershipComponent } from './my-account-videos/video-change-ownership/video-change-ownership.component'
12import { MyAccountOwnershipComponent } from './my-account-ownership/my-account-ownership.component' 34import { MyAccountComponent } from './my-account.component'
13import { MyAccountAcceptOwnershipComponent } from './my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component' 35import { TopMenuDropdownComponent } from './top-menu-dropdown.component'
14import { MyAccountProfileComponent } from '@app/+my-account/my-account-settings/my-account-profile/my-account-profile.component'
15import { MyAccountVideoImportsComponent } from '@app/+my-account/my-account-video-imports/my-account-video-imports.component'
16import { MyAccountDangerZoneComponent } from '@app/+my-account/my-account-settings/my-account-danger-zone'
17import { MyAccountSubscriptionsComponent } from '@app/+my-account/my-account-subscriptions/my-account-subscriptions.component'
18import { MyAccountBlocklistComponent } from '@app/+my-account/my-account-blocklist/my-account-blocklist.component'
19import { MyAccountServerBlocklistComponent } from '@app/+my-account/my-account-blocklist/my-account-server-blocklist.component'
20import { MyAccountHistoryComponent } from '@app/+my-account/my-account-history/my-account-history.component'
21import { MyAccountNotificationsComponent } from '@app/+my-account/my-account-notifications/my-account-notifications.component'
22import { MyAccountNotificationPreferencesComponent } from '@app/+my-account/my-account-settings/my-account-notification-preferences'
23import {
24 MyAccountVideoPlaylistCreateComponent
25} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-create.component'
26import {
27 MyAccountVideoPlaylistUpdateComponent
28} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-update.component'
29import { MyAccountVideoPlaylistsComponent } from '@app/+my-account/my-account-video-playlists/my-account-video-playlists.component'
30import {
31 MyAccountVideoPlaylistElementsComponent
32} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component'
33import { DragDropModule } from '@angular/cdk/drag-drop'
34import { MyAccountChangeEmailComponent } from '@app/+my-account/my-account-settings/my-account-change-email'
35 36
36@NgModule({ 37@NgModule({
37 imports: [ 38 imports: [
38 TableModule,
39 MyAccountRoutingModule, 39 MyAccountRoutingModule,
40
40 AutoCompleteModule, 41 AutoCompleteModule,
41 SharedModule,
42 TableModule, 42 TableModule,
43 InputSwitchModule, 43 InputSwitchModule,
44 DragDropModule 44 DragDropModule,
45
46 SharedMainModule,
47 SharedModerationModule,
48 SharedVideoMiniatureModule,
49 SharedUserSubscriptionModule,
50 SharedVideoPlaylistModule,
51 SharedUserInterfaceSettingsModule,
52 SharedGlobalIconModule
45 ], 53 ],
46 54
47 declarations: [ 55 declarations: [
@@ -68,7 +76,9 @@ import { MyAccountChangeEmailComponent } from '@app/+my-account/my-account-setti
68 MyAccountVideoPlaylistCreateComponent, 76 MyAccountVideoPlaylistCreateComponent,
69 MyAccountVideoPlaylistUpdateComponent, 77 MyAccountVideoPlaylistUpdateComponent,
70 MyAccountVideoPlaylistsComponent, 78 MyAccountVideoPlaylistsComponent,
71 MyAccountVideoPlaylistElementsComponent 79 MyAccountVideoPlaylistElementsComponent,
80
81 TopMenuDropdownComponent
72 ], 82 ],
73 83
74 exports: [ 84 exports: [
diff --git a/client/src/app/+my-account/shared/actor-avatar-info.component.html b/client/src/app/+my-account/shared/actor-avatar-info.component.html
deleted file mode 100644
index d01b9ac7f..000000000
--- a/client/src/app/+my-account/shared/actor-avatar-info.component.html
+++ /dev/null
@@ -1,24 +0,0 @@
1<ng-container *ngIf="actor">
2 <div class="actor">
3 <div class="d-flex">
4 <img [src]="actor.avatarUrl" alt="Avatar" />
5
6 <div class="actor-img-edit-container">
7 <div class="actor-img-edit-button" [ngbTooltip]="'(extensions: '+ avatarExtensions +', '+ maxSizeText +': '+ maxAvatarSizeInBytes +')'" placement="right" container="body">
8 <my-global-icon iconName="edit"></my-global-icon>
9 <label for="avatarfile" i18n>Change your avatar</label>
10 <input #avatarfileInput type="file" title=" " name="avatarfile" id="avatarfile" [accept]="avatarExtensions" (change)="onAvatarChange()"/>
11 </div>
12 </div>
13 </div>
14
15
16 <div class="actor-info">
17 <div class="actor-info-names">
18 <div class="actor-info-display-name">{{ actor.displayName }}</div>
19 <div class="actor-info-username">{{ actor.name }}</div>
20 </div>
21 <div i18n class="actor-info-followers">{{ actor.followersCount }} subscribers</div>
22 </div>
23 </div>
24</ng-container> \ No newline at end of file
diff --git a/client/src/app/+my-account/shared/actor-avatar-info.component.scss b/client/src/app/+my-account/shared/actor-avatar-info.component.scss
deleted file mode 100644
index 5a66ecfd2..000000000
--- a/client/src/app/+my-account/shared/actor-avatar-info.component.scss
+++ /dev/null
@@ -1,71 +0,0 @@
1@import '_variables';
2@import '_mixins';
3
4.actor {
5 display: flex;
6
7 img {
8 @include avatar(100px);
9
10 margin-right: 15px;
11 }
12
13 .actor-img-edit-container {
14 position: relative;
15 width: 0;
16
17 .actor-img-edit-button {
18 @include peertube-button-file(21px);
19 @include button-with-icon(19px);
20
21 margin-top: 10px;
22 margin-bottom: 5px;
23 border-radius: 50%;
24 top: 55px;
25 right: 45px;
26 cursor: pointer;
27
28 input {
29 width: 30px;
30 height: 30px;
31 }
32
33 my-global-icon {
34 right: 7px;
35 }
36 }
37 }
38
39 .actor-info {
40 justify-content: center;
41 display: inline-flex;
42 flex-direction: column;
43
44 .actor-info-names {
45 display: flex;
46 align-items: center;
47
48 .actor-info-display-name {
49 font-size: 20px;
50 font-weight: $font-bold;
51
52 @media screen and (max-width: $small-view) {
53 font-size: 16px;
54 }
55 }
56
57 .actor-info-username {
58 margin-left: 7px;
59 position: relative;
60 top: 2px;
61 font-size: 14px;
62 color: $grey-actor-name;
63 }
64 }
65
66 .actor-info-followers {
67 font-size: 15px;
68 padding-bottom: .5rem;
69 }
70 }
71}
diff --git a/client/src/app/+my-account/shared/actor-avatar-info.component.ts b/client/src/app/+my-account/shared/actor-avatar-info.component.ts
deleted file mode 100644
index 8e4a7a602..000000000
--- a/client/src/app/+my-account/shared/actor-avatar-info.component.ts
+++ /dev/null
@@ -1,66 +0,0 @@
1import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
2import { ServerService } from '../../core/server'
3import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
4import { Account } from '@app/shared/account/account.model'
5import { Notifier } from '@app/core'
6import { ServerConfig } from '@shared/models'
7import { BytesPipe } from 'ngx-pipes'
8import { I18n } from '@ngx-translate/i18n-polyfill'
9
10@Component({
11 selector: 'my-actor-avatar-info',
12 templateUrl: './actor-avatar-info.component.html',
13 styleUrls: [ './actor-avatar-info.component.scss' ]
14})
15export class ActorAvatarInfoComponent implements OnInit {
16 @ViewChild('avatarfileInput') avatarfileInput: ElementRef<HTMLInputElement>
17
18 @Input() actor: VideoChannel | Account
19
20 @Output() avatarChange = new EventEmitter<FormData>()
21
22 maxSizeText: string
23
24 private serverConfig: ServerConfig
25 private bytesPipe: BytesPipe
26
27 constructor (
28 private serverService: ServerService,
29 private notifier: Notifier,
30 private i18n: I18n
31 ) {
32 this.bytesPipe = new BytesPipe()
33 this.maxSizeText = this.i18n('max size')
34 }
35
36 ngOnInit (): void {
37 this.serverConfig = this.serverService.getTmpConfig()
38 this.serverService.getConfig()
39 .subscribe(config => this.serverConfig = config)
40 }
41
42 onAvatarChange () {
43 const avatarfile = this.avatarfileInput.nativeElement.files[ 0 ]
44 if (avatarfile.size > this.maxAvatarSize) {
45 this.notifier.error('Error', 'This image is too large.')
46 return
47 }
48
49 const formData = new FormData()
50 formData.append('avatarfile', avatarfile)
51
52 this.avatarChange.emit(formData)
53 }
54
55 get maxAvatarSize () {
56 return this.serverConfig.avatar.file.size.max
57 }
58
59 get maxAvatarSizeInBytes () {
60 return this.bytesPipe.transform(this.maxAvatarSize)
61 }
62
63 get avatarExtensions () {
64 return this.serverConfig.avatar.file.extensions.join(', ')
65 }
66}
diff --git a/client/src/app/+my-account/top-menu-dropdown.component.html b/client/src/app/+my-account/top-menu-dropdown.component.html
new file mode 100644
index 000000000..aeaceb662
--- /dev/null
+++ b/client/src/app/+my-account/top-menu-dropdown.component.html
@@ -0,0 +1,50 @@
1<div class="sub-menu" [ngClass]="{ 'no-scroll': isModalOpened }">
2 <ng-container *ngFor="let menuEntry of menuEntries; index as id">
3
4 <a *ngIf="menuEntry.routerLink" [routerLink]="menuEntry.routerLink" routerLinkActive="active" class="title-page title-page-settings">{{ menuEntry.label }}</a>
5
6 <div *ngIf="!menuEntry.routerLink" ngbDropdown class="parent-entry"
7 #dropdown="ngbDropdown" (mouseleave)="closeDropdownIfHovered(dropdown)">
8 <span
9 *ngIf="isInSmallView"
10 [ngClass]="{ active: !!suffixLabels[menuEntry.label] }"
11 (click)="openModal(id)" role="button" class="title-page title-page-settings">
12 <ng-container i18n>{{ menuEntry.label }}</ng-container>
13 <ng-container *ngIf="!!suffixLabels[menuEntry.label]"> - {{ suffixLabels[menuEntry.label] }}</ng-container>
14 </span>
15
16 <span
17 *ngIf="!isInSmallView"
18 (mouseenter)="openDropdownOnHover(dropdown)" [ngClass]="{ active: !!suffixLabels[menuEntry.label] }" ngbDropdownAnchor
19 (click)="dropdownAnchorClicked(dropdown)" role="button" class="title-page title-page-settings"
20 >
21 <ng-container i18n>{{ menuEntry.label }}</ng-container>
22 <ng-container *ngIf="!!suffixLabels[menuEntry.label]"> - {{ suffixLabels[menuEntry.label] }}</ng-container>
23 </span>
24
25 <div ngbDropdownMenu>
26 <a *ngFor="let menuChild of menuEntry.children" class="dropdown-item" [ngClass]="{ icon: hasIcons }" [routerLink]="menuChild.routerLink">
27 <my-global-icon *ngIf="menuChild.iconName" [iconName]="menuChild.iconName" aria-hidden="true"></my-global-icon>
28
29 {{ menuChild.label }}
30 </a>
31 </div>
32 </div>
33 </ng-container>
34</div>
35
36<ng-template #modal let-close="close" let-dismiss="dismiss">
37 <div class="modal-body">
38 <ng-container *ngFor="let menuEntry of menuEntries; index as id">
39 <div [ngClass]="{ hidden: id !== currentMenuEntryIndex }">
40 <a *ngFor="let menuChild of menuEntry.children"
41 [ngClass]="{ icon: hasIcons }"
42 [routerLink]="menuChild.routerLink" routerLinkActive="active" (click)="dismissOtherModals()">
43 <my-global-icon *ngIf="menuChild.iconName" [iconName]="menuChild.iconName" aria-hidden="true"></my-global-icon>
44
45 {{ menuChild.label }}
46 </a>
47 </div>
48 </ng-container>
49 </div>
50</ng-template>
diff --git a/client/src/app/+my-account/top-menu-dropdown.component.scss b/client/src/app/+my-account/top-menu-dropdown.component.scss
new file mode 100644
index 000000000..84dd7dce3
--- /dev/null
+++ b/client/src/app/+my-account/top-menu-dropdown.component.scss
@@ -0,0 +1,56 @@
1@import '_variables';
2@import '_mixins';
3
4.parent-entry {
5 span[role=button] {
6 cursor: pointer;
7 }
8
9 a {
10 display: block;
11 }
12}
13
14::ng-deep .dropdown-toggle::after {
15 position: relative;
16 top: 2px;
17}
18
19::ng-deep .dropdown-menu {
20 margin-top: 0 !important;
21}
22
23.icon {
24 @include dropdown-with-icon-item;
25
26 top: -1px;
27}
28
29.sub-menu.no-scroll {
30 overflow-x: hidden;
31}
32
33.modal-body {
34 .hidden {
35 display: none;
36 }
37
38 a {
39 @include disable-default-a-behaviour;
40
41 color: currentColor;
42 box-sizing: border-box;
43 display: block;
44 font-size: 1.2rem;
45 padding: 9px 12px;
46 text-align: initial;
47 text-transform: unset;
48 width: 100%;
49
50 &.active {
51 color: pvar(--mainBackgroundColor) !important;
52 background-color: pvar(--mainHoverColor);
53 opacity: .9;
54 }
55 }
56}
diff --git a/client/src/app/+my-account/top-menu-dropdown.component.ts b/client/src/app/+my-account/top-menu-dropdown.component.ts
new file mode 100644
index 000000000..5909db0b5
--- /dev/null
+++ b/client/src/app/+my-account/top-menu-dropdown.component.ts
@@ -0,0 +1,131 @@
1import { Subscription } from 'rxjs'
2import { filter, take } from 'rxjs/operators'
3import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'
4import { NavigationEnd, Router } from '@angular/router'
5import { MenuService, ScreenService } from '@app/core'
6import { GlobalIconName } from '@app/shared/shared-icons'
7import { NgbDropdown, NgbModal } from '@ng-bootstrap/ng-bootstrap'
8
9export type TopMenuDropdownParam = {
10 label: string
11 routerLink?: string
12
13 children?: {
14 label: string
15 routerLink: string
16
17 iconName?: GlobalIconName
18 }[]
19}
20
21@Component({
22 selector: 'my-top-menu-dropdown',
23 templateUrl: './top-menu-dropdown.component.html',
24 styleUrls: [ './top-menu-dropdown.component.scss' ]
25})
26export class TopMenuDropdownComponent implements OnInit, OnDestroy {
27 @Input() menuEntries: TopMenuDropdownParam[] = []
28
29 @ViewChild('modal', { static: true }) modal: NgbModal
30
31 suffixLabels: { [ parentLabel: string ]: string }
32 hasIcons = false
33 isModalOpened = false
34 currentMenuEntryIndex: number
35
36 private openedOnHover = false
37 private routeSub: Subscription
38
39 constructor (
40 private router: Router,
41 private modalService: NgbModal,
42 private screen: ScreenService,
43 private menuService: MenuService
44 ) { }
45
46 get isInSmallView () {
47 let marginLeft = 0
48 if (this.menuService.isMenuDisplayed) {
49 marginLeft = this.menuService.menuWidth
50 }
51
52 return this.screen.isInSmallView(marginLeft)
53 }
54
55 ngOnInit () {
56 this.updateChildLabels(window.location.pathname)
57
58 this.routeSub = this.router.events
59 .pipe(filter(event => event instanceof NavigationEnd))
60 .subscribe(() => this.updateChildLabels(window.location.pathname))
61
62 this.hasIcons = this.menuEntries.some(
63 e => e.children && e.children.some(c => !!c.iconName)
64 )
65 }
66
67 ngOnDestroy () {
68 if (this.routeSub) this.routeSub.unsubscribe()
69 }
70
71 openDropdownOnHover (dropdown: NgbDropdown) {
72 this.openedOnHover = true
73 dropdown.open()
74
75 // Menu was closed
76 dropdown.openChange
77 .pipe(take(1))
78 .subscribe(() => this.openedOnHover = false)
79 }
80
81 dropdownAnchorClicked (dropdown: NgbDropdown) {
82 if (this.openedOnHover) {
83 this.openedOnHover = false
84 return
85 }
86
87 return dropdown.toggle()
88 }
89
90 closeDropdownIfHovered (dropdown: NgbDropdown) {
91 if (this.openedOnHover === false) return
92
93 dropdown.close()
94 this.openedOnHover = false
95 }
96
97 openModal (index: number) {
98 this.currentMenuEntryIndex = index
99 this.isModalOpened = true
100
101 this.modalService.open(this.modal, {
102 centered: true,
103 beforeDismiss: async () => {
104 this.onModalDismiss()
105 return true
106 }
107 })
108 }
109
110 onModalDismiss () {
111 this.isModalOpened = false
112 }
113
114 dismissOtherModals () {
115 this.modalService.dismissAll()
116 }
117
118 private updateChildLabels (path: string) {
119 this.suffixLabels = {}
120
121 for (const entry of this.menuEntries) {
122 if (!entry.children) continue
123
124 for (const child of entry.children) {
125 if (path.startsWith(child.routerLink)) {
126 this.suffixLabels[entry.label] = child.label
127 }
128 }
129 }
130 }
131}
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-03 13:14:53 +0000