diff options
author | Chocobozzz <me@florianbigard.com> | 2018-04-23 16:16:05 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2018-04-23 16:16:05 +0200 |
commit | 4bb6886d28cc5333bbe1523674bf5db141af456f (patch) | |
tree | 86276bfa11afdd4357ac45df2ead26a41f181069 /client/src/app/account | |
parent | 3186046d17cc09a3426d5ea67835f4c936cb18a3 (diff) | |
download | PeerTube-4bb6886d28cc5333bbe1523674bf5db141af456f.tar.gz PeerTube-4bb6886d28cc5333bbe1523674bf5db141af456f.tar.zst PeerTube-4bb6886d28cc5333bbe1523674bf5db141af456f.zip |
Rename account module to my-account
Diffstat (limited to 'client/src/app/account')
20 files changed, 0 insertions, 750 deletions
diff --git a/client/src/app/account/account-routing.module.ts b/client/src/app/account/account-routing.module.ts deleted file mode 100644 index 070b9b5c5..000000000 --- a/client/src/app/account/account-routing.module.ts +++ /dev/null | |||
@@ -1,43 +0,0 @@ | |||
1 | import { NgModule } from '@angular/core' | ||
2 | import { RouterModule, Routes } from '@angular/router' | ||
3 | |||
4 | import { MetaGuard } from '@ngx-meta/core' | ||
5 | |||
6 | import { LoginGuard } from '../core' | ||
7 | import { AccountComponent } from './account.component' | ||
8 | import { AccountSettingsComponent } from './account-settings/account-settings.component' | ||
9 | import { AccountVideosComponent } from './account-videos/account-videos.component' | ||
10 | |||
11 | const accountRoutes: Routes = [ | ||
12 | { | ||
13 | path: 'account', | ||
14 | component: AccountComponent, | ||
15 | canActivateChild: [ MetaGuard, LoginGuard ], | ||
16 | children: [ | ||
17 | { | ||
18 | path: 'settings', | ||
19 | component: AccountSettingsComponent, | ||
20 | data: { | ||
21 | meta: { | ||
22 | title: 'Account settings' | ||
23 | } | ||
24 | } | ||
25 | }, | ||
26 | { | ||
27 | path: 'videos', | ||
28 | component: AccountVideosComponent, | ||
29 | data: { | ||
30 | meta: { | ||
31 | title: 'Account videos' | ||
32 | } | ||
33 | } | ||
34 | } | ||
35 | ] | ||
36 | } | ||
37 | ] | ||
38 | |||
39 | @NgModule({ | ||
40 | imports: [ RouterModule.forChild(accountRoutes) ], | ||
41 | exports: [ RouterModule ] | ||
42 | }) | ||
43 | export class AccountRoutingModule {} | ||
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html b/client/src/app/account/account-settings/account-change-password/account-change-password.component.html deleted file mode 100644 index b0e3cada4..000000000 --- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html +++ /dev/null | |||
@@ -1,20 +0,0 @@ | |||
1 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> | ||
2 | |||
3 | <form role="form" (ngSubmit)="changePassword()" [formGroup]="form"> | ||
4 | |||
5 | <label for="new-password">Change password</label> | ||
6 | <input | ||
7 | type="password" id="new-password" placeholder="New password" | ||
8 | formControlName="new-password" [ngClass]="{ 'input-error': formErrors['new-password'] }" | ||
9 | > | ||
10 | <div *ngIf="formErrors['new-password']" class="form-error"> | ||
11 | {{ formErrors['new-password'] }} | ||
12 | </div> | ||
13 | |||
14 | <input | ||
15 | type="password" id="new-confirmed-password" placeholder="Confirm new password" | ||
16 | formControlName="new-confirmed-password" | ||
17 | > | ||
18 | |||
19 | <input type="submit" value="Change password" [disabled]="!form.valid"> | ||
20 | </form> | ||
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss b/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss deleted file mode 100644 index f8279ffd3..000000000 --- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss +++ /dev/null | |||
@@ -1,19 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | input[type=password] { | ||
5 | @include peertube-input-text(340px); | ||
6 | display: block; | ||
7 | |||
8 | &#new-confirmed-password { | ||
9 | margin-top: 15px; | ||
10 | } | ||
11 | } | ||
12 | |||
13 | input[type=submit] { | ||
14 | @include peertube-button; | ||
15 | @include orange-button; | ||
16 | |||
17 | margin-top: 15px; | ||
18 | } | ||
19 | |||
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts b/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts deleted file mode 100644 index 8979e1734..000000000 --- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts +++ /dev/null | |||
@@ -1,62 +0,0 @@ | |||
1 | import { Component, OnInit } from '@angular/core' | ||
2 | import { FormBuilder, FormGroup } from '@angular/forms' | ||
3 | import { NotificationsService } from 'angular2-notifications' | ||
4 | import { FormReactive, USER_PASSWORD, UserService } from '../../../shared' | ||
5 | |||
6 | @Component({ | ||
7 | selector: 'my-account-change-password', | ||
8 | templateUrl: './account-change-password.component.html', | ||
9 | styleUrls: [ './account-change-password.component.scss' ] | ||
10 | }) | ||
11 | export class AccountChangePasswordComponent extends FormReactive implements OnInit { | ||
12 | error: string = null | ||
13 | |||
14 | form: FormGroup | ||
15 | formErrors = { | ||
16 | 'new-password': '', | ||
17 | 'new-confirmed-password': '' | ||
18 | } | ||
19 | validationMessages = { | ||
20 | 'new-password': USER_PASSWORD.MESSAGES, | ||
21 | 'new-confirmed-password': USER_PASSWORD.MESSAGES | ||
22 | } | ||
23 | |||
24 | constructor ( | ||
25 | private formBuilder: FormBuilder, | ||
26 | private notificationsService: NotificationsService, | ||
27 | private userService: UserService | ||
28 | ) { | ||
29 | super() | ||
30 | } | ||
31 | |||
32 | buildForm () { | ||
33 | this.form = this.formBuilder.group({ | ||
34 | 'new-password': [ '', USER_PASSWORD.VALIDATORS ], | ||
35 | 'new-confirmed-password': [ '', USER_PASSWORD.VALIDATORS ] | ||
36 | }) | ||
37 | |||
38 | this.form.valueChanges.subscribe(data => this.onValueChanged(data)) | ||
39 | } | ||
40 | |||
41 | ngOnInit () { | ||
42 | this.buildForm() | ||
43 | } | ||
44 | |||
45 | changePassword () { | ||
46 | const newPassword = this.form.value['new-password'] | ||
47 | const newConfirmedPassword = this.form.value['new-confirmed-password'] | ||
48 | |||
49 | this.error = null | ||
50 | |||
51 | if (newPassword !== newConfirmedPassword) { | ||
52 | this.error = 'The new password and the confirmed password do not correspond.' | ||
53 | return | ||
54 | } | ||
55 | |||
56 | this.userService.changePassword(newPassword).subscribe( | ||
57 | () => this.notificationsService.success('Success', 'Password updated.'), | ||
58 | |||
59 | err => this.error = err.message | ||
60 | ) | ||
61 | } | ||
62 | } | ||
diff --git a/client/src/app/account/account-settings/account-change-password/index.ts b/client/src/app/account/account-settings/account-change-password/index.ts deleted file mode 100644 index 44c330b66..000000000 --- a/client/src/app/account/account-settings/account-change-password/index.ts +++ /dev/null | |||
@@ -1 +0,0 @@ | |||
1 | export * from './account-change-password.component' | ||
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.html b/client/src/app/account/account-settings/account-details/account-details.component.html deleted file mode 100644 index 0e8598e9e..000000000 --- a/client/src/app/account/account-settings/account-details/account-details.component.html +++ /dev/null | |||
@@ -1,25 +0,0 @@ | |||
1 | <form role="form" (ngSubmit)="updateDetails()" [formGroup]="form"> | ||
2 | <div class="form-group"> | ||
3 | <label for="nsfwPolicy">Default policy on videos containing sensitive content</label> | ||
4 | <my-help helpType="custom" customHtml="With <strong>Do not list</strong> or <strong>Blur thumbnails</strong>, a confirmation will be requested to watch the video."></my-help> | ||
5 | |||
6 | <div class="peertube-select-container"> | ||
7 | <select id="nsfwPolicy" formControlName="nsfwPolicy"> | ||
8 | <option value="do_not_list">Do not list</option> | ||
9 | <option value="blur">Blur thumbnails</option> | ||
10 | <option value="display">Display</option> | ||
11 | </select> | ||
12 | </div> | ||
13 | </div> | ||
14 | |||
15 | <div class="form-group"> | ||
16 | <input | ||
17 | type="checkbox" id="autoPlayVideo" | ||
18 | formControlName="autoPlayVideo" | ||
19 | > | ||
20 | <label for="autoPlayVideo"></label> | ||
21 | <label for="autoPlayVideo">Automatically plays video</label> | ||
22 | </div> | ||
23 | |||
24 | <input type="submit" value="Save" [disabled]="!form.valid"> | ||
25 | </form> | ||
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.scss b/client/src/app/account/account-settings/account-details/account-details.component.scss deleted file mode 100644 index ed59e4689..000000000 --- a/client/src/app/account/account-settings/account-details/account-details.component.scss +++ /dev/null | |||
@@ -1,20 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | input[type=checkbox] { | ||
5 | @include peertube-checkbox(1px); | ||
6 | } | ||
7 | |||
8 | input[type=submit] { | ||
9 | @include peertube-button; | ||
10 | @include orange-button; | ||
11 | |||
12 | display: block; | ||
13 | margin-top: 15px; | ||
14 | } | ||
15 | |||
16 | .peertube-select-container { | ||
17 | @include peertube-select-container(340px); | ||
18 | |||
19 | margin-bottom: 30px; | ||
20 | } \ No newline at end of file | ||
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.ts b/client/src/app/account/account-settings/account-details/account-details.component.ts deleted file mode 100644 index de213717e..000000000 --- a/client/src/app/account/account-settings/account-details/account-details.component.ts +++ /dev/null | |||
@@ -1,61 +0,0 @@ | |||
1 | import { Component, Input, OnInit } from '@angular/core' | ||
2 | import { FormBuilder, FormGroup } from '@angular/forms' | ||
3 | import { NotificationsService } from 'angular2-notifications' | ||
4 | import { UserUpdateMe } from '../../../../../../shared' | ||
5 | import { AuthService } from '../../../core' | ||
6 | import { FormReactive, User, UserService } from '../../../shared' | ||
7 | |||
8 | @Component({ | ||
9 | selector: 'my-account-details', | ||
10 | templateUrl: './account-details.component.html', | ||
11 | styleUrls: [ './account-details.component.scss' ] | ||
12 | }) | ||
13 | |||
14 | export class AccountDetailsComponent extends FormReactive implements OnInit { | ||
15 | @Input() user: User = null | ||
16 | |||
17 | form: FormGroup | ||
18 | formErrors = {} | ||
19 | validationMessages = {} | ||
20 | |||
21 | constructor ( | ||
22 | private authService: AuthService, | ||
23 | private formBuilder: FormBuilder, | ||
24 | private notificationsService: NotificationsService, | ||
25 | private userService: UserService | ||
26 | ) { | ||
27 | super() | ||
28 | } | ||
29 | |||
30 | buildForm () { | ||
31 | this.form = this.formBuilder.group({ | ||
32 | nsfwPolicy: [ this.user.nsfwPolicy ], | ||
33 | autoPlayVideo: [ this.user.autoPlayVideo ] | ||
34 | }) | ||
35 | |||
36 | this.form.valueChanges.subscribe(data => this.onValueChanged(data)) | ||
37 | } | ||
38 | |||
39 | ngOnInit () { | ||
40 | this.buildForm() | ||
41 | } | ||
42 | |||
43 | updateDetails () { | ||
44 | const nsfwPolicy = this.form.value['nsfwPolicy'] | ||
45 | const autoPlayVideo = this.form.value['autoPlayVideo'] | ||
46 | const details: UserUpdateMe = { | ||
47 | nsfwPolicy, | ||
48 | autoPlayVideo | ||
49 | } | ||
50 | |||
51 | this.userService.updateMyDetails(details).subscribe( | ||
52 | () => { | ||
53 | this.notificationsService.success('Success', 'Information updated.') | ||
54 | |||
55 | this.authService.refreshUserInformation() | ||
56 | }, | ||
57 | |||
58 | err => this.notificationsService.error('Error', err.message) | ||
59 | ) | ||
60 | } | ||
61 | } | ||
diff --git a/client/src/app/account/account-settings/account-details/index.ts b/client/src/app/account/account-settings/account-details/index.ts deleted file mode 100644 index 4829f608a..000000000 --- a/client/src/app/account/account-settings/account-details/index.ts +++ /dev/null | |||
@@ -1 +0,0 @@ | |||
1 | export * from './account-details.component' | ||
diff --git a/client/src/app/account/account-settings/account-settings.component.html b/client/src/app/account/account-settings/account-settings.component.html deleted file mode 100644 index 7ae27dc75..000000000 --- a/client/src/app/account/account-settings/account-settings.component.html +++ /dev/null | |||
@@ -1,24 +0,0 @@ | |||
1 | <div class="user"> | ||
2 | <img [src]="getAvatarUrl()" alt="Avatar" /> | ||
3 | |||
4 | <div class="user-info"> | ||
5 | <div class="user-info-username">{{ user.username }}</div> | ||
6 | <div class="user-info-followers">{{ user.account?.followersCount }} subscribers</div> | ||
7 | </div> | ||
8 | </div> | ||
9 | |||
10 | <div class="button-file"> | ||
11 | <span>Change your avatar</span> | ||
12 | <input #avatarfileInput type="file" name="avatarfile" id="avatarfile" [accept]="avatarExtensions" (change)="changeAvatar()" /> | ||
13 | </div> | ||
14 | <div class="file-max-size">(extensions: {{ avatarExtensions }}, max size: {{ maxAvatarSize | bytes }})</div> | ||
15 | |||
16 | <div class="user-quota"> | ||
17 | <span class="user-quota-label">Video quota:</span> {{ userVideoQuotaUsed | bytes: 0 }} / {{ userVideoQuota }} | ||
18 | </div> | ||
19 | |||
20 | <div class="account-title">Account settings</div> | ||
21 | <my-account-change-password></my-account-change-password> | ||
22 | |||
23 | <div class="account-title">Video settings</div> | ||
24 | <my-account-details [user]="user"></my-account-details> | ||
diff --git a/client/src/app/account/account-settings/account-settings.component.scss b/client/src/app/account/account-settings/account-settings.component.scss deleted file mode 100644 index 1cc00ca49..000000000 --- a/client/src/app/account/account-settings/account-settings.component.scss +++ /dev/null | |||
@@ -1,56 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | .user { | ||
5 | display: flex; | ||
6 | |||
7 | img { | ||
8 | @include avatar(50px); | ||
9 | |||
10 | margin-right: 15px; | ||
11 | } | ||
12 | |||
13 | .user-info { | ||
14 | .user-info-username { | ||
15 | font-size: 20px; | ||
16 | font-weight: $font-bold; | ||
17 | } | ||
18 | |||
19 | .user-info-followers { | ||
20 | font-size: 15px; | ||
21 | } | ||
22 | } | ||
23 | } | ||
24 | |||
25 | .button-file { | ||
26 | @include peertube-button-file(160px); | ||
27 | |||
28 | margin-top: 10px; | ||
29 | margin-bottom: 5px; | ||
30 | } | ||
31 | |||
32 | .file-max-size { | ||
33 | display: inline-block; | ||
34 | font-size: 13px; | ||
35 | |||
36 | position: relative; | ||
37 | top: -10px; | ||
38 | } | ||
39 | |||
40 | .user-quota { | ||
41 | font-size: 15px; | ||
42 | margin-top: 20px; | ||
43 | |||
44 | .user-quota-label { | ||
45 | font-weight: $font-semibold; | ||
46 | } | ||
47 | } | ||
48 | |||
49 | .account-title { | ||
50 | text-transform: uppercase; | ||
51 | color: $orange-color; | ||
52 | font-weight: $font-bold; | ||
53 | font-size: 13px; | ||
54 | margin-top: 55px; | ||
55 | margin-bottom: 30px; | ||
56 | } | ||
diff --git a/client/src/app/account/account-settings/account-settings.component.ts b/client/src/app/account/account-settings/account-settings.component.ts deleted file mode 100644 index 524607817..000000000 --- a/client/src/app/account/account-settings/account-settings.component.ts +++ /dev/null | |||
@@ -1,74 +0,0 @@ | |||
1 | import { Component, OnInit, ViewChild } from '@angular/core' | ||
2 | import { NotificationsService } from 'angular2-notifications' | ||
3 | import { BytesPipe } from 'ngx-pipes' | ||
4 | import { AuthService } from '../../core' | ||
5 | import { ServerService } from '../../core/server' | ||
6 | import { User } from '../../shared' | ||
7 | import { UserService } from '../../shared/users' | ||
8 | |||
9 | @Component({ | ||
10 | selector: 'my-account-settings', | ||
11 | templateUrl: './account-settings.component.html', | ||
12 | styleUrls: [ './account-settings.component.scss' ] | ||
13 | }) | ||
14 | export class AccountSettingsComponent implements OnInit { | ||
15 | @ViewChild('avatarfileInput') avatarfileInput | ||
16 | |||
17 | user: User = null | ||
18 | userVideoQuota = '0' | ||
19 | userVideoQuotaUsed = 0 | ||
20 | |||
21 | constructor ( | ||
22 | private userService: UserService, | ||
23 | private authService: AuthService, | ||
24 | private serverService: ServerService, | ||
25 | private notificationsService: NotificationsService | ||
26 | ) {} | ||
27 | |||
28 | ngOnInit () { | ||
29 | this.user = this.authService.getUser() | ||
30 | |||
31 | this.authService.userInformationLoaded.subscribe( | ||
32 | () => { | ||
33 | if (this.user.videoQuota !== -1) { | ||
34 | this.userVideoQuota = new BytesPipe().transform(this.user.videoQuota, 0).toString() | ||
35 | } else { | ||
36 | this.userVideoQuota = 'Unlimited' | ||
37 | } | ||
38 | } | ||
39 | ) | ||
40 | |||
41 | this.userService.getMyVideoQuotaUsed() | ||
42 | .subscribe(data => this.userVideoQuotaUsed = data.videoQuotaUsed) | ||
43 | } | ||
44 | |||
45 | getAvatarUrl () { | ||
46 | return this.user.getAvatarUrl() | ||
47 | } | ||
48 | |||
49 | changeAvatar () { | ||
50 | const avatarfile = this.avatarfileInput.nativeElement.files[ 0 ] | ||
51 | |||
52 | const formData = new FormData() | ||
53 | formData.append('avatarfile', avatarfile) | ||
54 | |||
55 | this.userService.changeAvatar(formData) | ||
56 | .subscribe( | ||
57 | data => { | ||
58 | this.notificationsService.success('Success', 'Avatar changed.') | ||
59 | |||
60 | this.user.account.avatar = data.avatar | ||
61 | }, | ||
62 | |||
63 | err => this.notificationsService.error('Error', err.message) | ||
64 | ) | ||
65 | } | ||
66 | |||
67 | get maxAvatarSize () { | ||
68 | return this.serverService.getConfig().avatar.file.size.max | ||
69 | } | ||
70 | |||
71 | get avatarExtensions () { | ||
72 | return this.serverService.getConfig().avatar.file.extensions.join(',') | ||
73 | } | ||
74 | } | ||
diff --git a/client/src/app/account/account-videos/account-videos.component.html b/client/src/app/account/account-videos/account-videos.component.html deleted file mode 100644 index 66ce3a77b..000000000 --- a/client/src/app/account/account-videos/account-videos.component.html +++ /dev/null | |||
@@ -1,45 +0,0 @@ | |||
1 | <div *ngIf="pagination.totalItems === 0">No results.</div> | ||
2 | |||
3 | <div | ||
4 | myInfiniteScroller | ||
5 | [pageHeight]="pageHeight" | ||
6 | (nearOfTop)="onNearOfTop()" (nearOfBottom)="onNearOfBottom()" (pageChanged)="onPageChanged($event)" | ||
7 | class="videos" #videosElement | ||
8 | > | ||
9 | <div *ngFor="let videos of videoPages; let i = index" class="videos-page"> | ||
10 | <div class="video" *ngFor="let video of videos; let j = index"> | ||
11 | <div class="checkbox-container"> | ||
12 | <input [id]="'video-check-' + video.id" type="checkbox" [(ngModel)]="checkedVideos[video.id]" /> | ||
13 | <label [for]="'video-check-' + video.id"></label> | ||
14 | </div> | ||
15 | |||
16 | <my-video-thumbnail [video]="video"></my-video-thumbnail> | ||
17 | |||
18 | <div class="video-info"> | ||
19 | <a class="video-info-name" [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name">{{ video.name }}</a> | ||
20 | <span class="video-info-date-views">{{ video.createdAt | myFromNow }} - {{ video.views | myNumberFormatter }} views</span> | ||
21 | <div class="video-info-private">{{ video.privacy.label }}</div> | ||
22 | </div> | ||
23 | |||
24 | <!-- Display only once --> | ||
25 | <div class="action-selection-mode" *ngIf="isInSelectionMode() === true && i === 0 && j === 0"> | ||
26 | <div class="action-selection-mode-child"> | ||
27 | <span class="action-button action-button-cancel-selection" (click)="abortSelectionMode()"> | ||
28 | Cancel | ||
29 | </span> | ||
30 | |||
31 | <span class="action-button action-button-delete-selection" (click)="deleteSelectedVideos()"> | ||
32 | <span class="icon icon-delete-white"></span> | ||
33 | Delete | ||
34 | </span> | ||
35 | </div> | ||
36 | </div> | ||
37 | |||
38 | <div class="video-buttons" *ngIf="isInSelectionMode() === false"> | ||
39 | <my-delete-button (click)="deleteVideo(video)"></my-delete-button> | ||
40 | |||
41 | <my-edit-button [routerLink]="[ '/videos', 'edit', video.uuid ]"></my-edit-button> | ||
42 | </div> | ||
43 | </div> | ||
44 | </div> | ||
45 | </div> | ||
diff --git a/client/src/app/account/account-videos/account-videos.component.scss b/client/src/app/account/account-videos/account-videos.component.scss deleted file mode 100644 index f276ea389..000000000 --- a/client/src/app/account/account-videos/account-videos.component.scss +++ /dev/null | |||
@@ -1,114 +0,0 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | .action-selection-mode { | ||
5 | width: 174px; | ||
6 | display: flex; | ||
7 | justify-content: flex-end; | ||
8 | |||
9 | .action-selection-mode-child { | ||
10 | position: fixed; | ||
11 | |||
12 | .action-button { | ||
13 | display: inline-block; | ||
14 | } | ||
15 | |||
16 | .action-button-cancel-selection { | ||
17 | @include peertube-button; | ||
18 | @include grey-button; | ||
19 | |||
20 | margin-right: 10px; | ||
21 | } | ||
22 | |||
23 | .action-button-delete-selection { | ||
24 | @include peertube-button; | ||
25 | @include orange-button; | ||
26 | } | ||
27 | |||
28 | .icon.icon-delete-white { | ||
29 | @include icon(21px); | ||
30 | |||
31 | position: relative; | ||
32 | top: -2px; | ||
33 | background-image: url('../../../assets/images/global/delete-white.svg'); | ||
34 | } | ||
35 | } | ||
36 | } | ||
37 | |||
38 | /deep/ .action-button { | ||
39 | &.action-button-delete { | ||
40 | margin-right: 10px; | ||
41 | } | ||
42 | } | ||
43 | |||
44 | .video { | ||
45 | display: flex; | ||
46 | min-height: 130px; | ||
47 | padding-bottom: 20px; | ||
48 | margin-bottom: 20px; | ||
49 | border-bottom: 1px solid #C6C6C6; | ||
50 | |||
51 | &:first-child { | ||
52 | margin-top: 47px; | ||
53 | } | ||
54 | |||
55 | .checkbox-container { | ||
56 | display: flex; | ||
57 | align-items: center; | ||
58 | margin-right: 20px; | ||
59 | margin-left: 12px; | ||
60 | |||
61 | input[type=checkbox] { | ||
62 | @include peertube-checkbox(2px); | ||
63 | } | ||
64 | } | ||
65 | |||
66 | my-video-thumbnail { | ||
67 | margin-right: 10px; | ||
68 | } | ||
69 | |||
70 | .video-info { | ||
71 | flex-grow: 1; | ||
72 | |||
73 | .video-info-name { | ||
74 | @include disable-default-a-behaviour; | ||
75 | |||
76 | color: #000; | ||
77 | display: block; | ||
78 | font-size: 16px; | ||
79 | font-weight: $font-semibold; | ||
80 | } | ||
81 | |||
82 | .video-info-date-views, .video-info-private { | ||
83 | font-size: 13px; | ||
84 | |||
85 | &.video-info-private { | ||
86 | font-weight: $font-semibold; | ||
87 | } | ||
88 | } | ||
89 | } | ||
90 | |||
91 | .video-buttons { | ||
92 | min-width: 190px; | ||
93 | } | ||
94 | } | ||
95 | |||
96 | @media screen and (max-width: 800px) { | ||
97 | .video { | ||
98 | flex-direction: column; | ||
99 | height: auto; | ||
100 | text-align: center; | ||
101 | |||
102 | input[type=checkbox] { | ||
103 | display: none; | ||
104 | } | ||
105 | |||
106 | my-video-thumbnail { | ||
107 | margin-right: 0; | ||
108 | } | ||
109 | |||
110 | .video-buttons { | ||
111 | margin-top: 10px; | ||
112 | } | ||
113 | } | ||
114 | } | ||
diff --git a/client/src/app/account/account-videos/account-videos.component.ts b/client/src/app/account/account-videos/account-videos.component.ts deleted file mode 100644 index 91bc1b695..000000000 --- a/client/src/app/account/account-videos/account-videos.component.ts +++ /dev/null | |||
@@ -1,133 +0,0 @@ | |||
1 | import { Component, OnInit, OnDestroy } from '@angular/core' | ||
2 | import { ActivatedRoute, Router } from '@angular/router' | ||
3 | import { Location } from '@angular/common' | ||
4 | import { immutableAssign } from '@app/shared/misc/utils' | ||
5 | import { ComponentPagination } from '@app/shared/rest/component-pagination.model' | ||
6 | import { NotificationsService } from 'angular2-notifications' | ||
7 | import 'rxjs/add/observable/from' | ||
8 | import 'rxjs/add/operator/concatAll' | ||
9 | import { Observable } from 'rxjs/Observable' | ||
10 | import { AuthService } from '../../core/auth' | ||
11 | import { ConfirmService } from '../../core/confirm' | ||
12 | import { AbstractVideoList } from '../../shared/video/abstract-video-list' | ||
13 | import { Video } from '../../shared/video/video.model' | ||
14 | import { VideoService } from '../../shared/video/video.service' | ||
15 | |||
16 | @Component({ | ||
17 | selector: 'my-account-videos', | ||
18 | templateUrl: './account-videos.component.html', | ||
19 | styleUrls: [ './account-videos.component.scss' ] | ||
20 | }) | ||
21 | export class AccountVideosComponent extends AbstractVideoList implements OnInit, OnDestroy { | ||
22 | titlePage = 'My videos' | ||
23 | currentRoute = '/account/videos' | ||
24 | checkedVideos: { [ id: number ]: boolean } = {} | ||
25 | pagination: ComponentPagination = { | ||
26 | currentPage: 1, | ||
27 | itemsPerPage: 5, | ||
28 | totalItems: null | ||
29 | } | ||
30 | |||
31 | protected baseVideoWidth = -1 | ||
32 | protected baseVideoHeight = 155 | ||
33 | |||
34 | constructor (protected router: Router, | ||
35 | protected route: ActivatedRoute, | ||
36 | protected authService: AuthService, | ||
37 | protected notificationsService: NotificationsService, | ||
38 | protected confirmService: ConfirmService, | ||
39 | protected location: Location, | ||
40 | private videoService: VideoService) { | ||
41 | super() | ||
42 | } | ||
43 | |||
44 | ngOnInit () { | ||
45 | super.ngOnInit() | ||
46 | |||
47 | // this.generateSyndicationList() | ||
48 | } | ||
49 | |||
50 | ngOnDestroy () { | ||
51 | super.ngOnDestroy() | ||
52 | } | ||
53 | |||
54 | abortSelectionMode () { | ||
55 | this.checkedVideos = {} | ||
56 | } | ||
57 | |||
58 | isInSelectionMode () { | ||
59 | return Object.keys(this.checkedVideos).some(k => this.checkedVideos[k] === true) | ||
60 | } | ||
61 | |||
62 | getVideosObservable (page: number) { | ||
63 | const newPagination = immutableAssign(this.pagination, { currentPage: page }) | ||
64 | |||
65 | return this.videoService.getMyVideos(newPagination, this.sort) | ||
66 | } | ||
67 | |||
68 | generateSyndicationList () { | ||
69 | throw new Error('Method not implemented.') | ||
70 | } | ||
71 | |||
72 | async deleteSelectedVideos () { | ||
73 | const toDeleteVideosIds = Object.keys(this.checkedVideos) | ||
74 | .filter(k => this.checkedVideos[k] === true) | ||
75 | .map(k => parseInt(k, 10)) | ||
76 | |||
77 | const res = await this.confirmService.confirm(`Do you really want to delete ${toDeleteVideosIds.length} videos?`, 'Delete') | ||
78 | if (res === false) return | ||
79 | |||
80 | const observables: Observable<any>[] = [] | ||
81 | for (const videoId of toDeleteVideosIds) { | ||
82 | const o = this.videoService | ||
83 | .removeVideo(videoId) | ||
84 | .do(() => this.spliceVideosById(videoId)) | ||
85 | |||
86 | observables.push(o) | ||
87 | } | ||
88 | |||
89 | Observable.from(observables) | ||
90 | .concatAll() | ||
91 | .subscribe( | ||
92 | res => { | ||
93 | this.notificationsService.success('Success', `${toDeleteVideosIds.length} videos deleted.`) | ||
94 | this.buildVideoPages() | ||
95 | }, | ||
96 | |||
97 | err => this.notificationsService.error('Error', err.message) | ||
98 | ) | ||
99 | } | ||
100 | |||
101 | async deleteVideo (video: Video) { | ||
102 | const res = await this.confirmService.confirm(`Do you really want to delete ${video.name}?`, 'Delete') | ||
103 | if (res === false) return | ||
104 | |||
105 | this.videoService.removeVideo(video.id) | ||
106 | .subscribe( | ||
107 | status => { | ||
108 | this.notificationsService.success('Success', `Video ${video.name} deleted.`) | ||
109 | this.spliceVideosById(video.id) | ||
110 | this.buildVideoPages() | ||
111 | }, | ||
112 | |||
113 | error => this.notificationsService.error('Error', error.message) | ||
114 | ) | ||
115 | } | ||
116 | |||
117 | protected buildVideoHeight () { | ||
118 | // In account videos, the video height is fixed | ||
119 | return this.baseVideoHeight | ||
120 | } | ||
121 | |||
122 | private spliceVideosById (id: number) { | ||
123 | for (const key of Object.keys(this.loadedPages)) { | ||
124 | const videos = this.loadedPages[key] | ||
125 | const index = videos.findIndex(v => v.id === id) | ||
126 | |||
127 | if (index !== -1) { | ||
128 | videos.splice(index, 1) | ||
129 | return | ||
130 | } | ||
131 | } | ||
132 | } | ||
133 | } | ||
diff --git a/client/src/app/account/account.component.html b/client/src/app/account/account.component.html deleted file mode 100644 index d82a4ca4d..000000000 --- a/client/src/app/account/account.component.html +++ /dev/null | |||
@@ -1,11 +0,0 @@ | |||
1 | <div class="row"> | ||
2 | <div class="sub-menu"> | ||
3 | <a routerLink="/account/settings" routerLinkActive="active" class="title-page">My account</a> | ||
4 | |||
5 | <a routerLink="/account/videos" routerLinkActive="active" class="title-page">My videos</a> | ||
6 | </div> | ||
7 | |||
8 | <div class="margin-content"> | ||
9 | <router-outlet></router-outlet> | ||
10 | </div> | ||
11 | </div> | ||
diff --git a/client/src/app/account/account.component.scss b/client/src/app/account/account.component.scss deleted file mode 100644 index e69de29bb..000000000 --- a/client/src/app/account/account.component.scss +++ /dev/null | |||
diff --git a/client/src/app/account/account.component.ts b/client/src/app/account/account.component.ts deleted file mode 100644 index 3d3677ab0..000000000 --- a/client/src/app/account/account.component.ts +++ /dev/null | |||
@@ -1,8 +0,0 @@ | |||
1 | import { Component } from '@angular/core' | ||
2 | |||
3 | @Component({ | ||
4 | selector: 'my-account', | ||
5 | templateUrl: './account.component.html', | ||
6 | styleUrls: [ './account.component.scss' ] | ||
7 | }) | ||
8 | export class AccountComponent {} | ||
diff --git a/client/src/app/account/account.module.ts b/client/src/app/account/account.module.ts deleted file mode 100644 index 2299c1919..000000000 --- a/client/src/app/account/account.module.ts +++ /dev/null | |||
@@ -1,30 +0,0 @@ | |||
1 | import { NgModule } from '@angular/core' | ||
2 | import { SharedModule } from '../shared' | ||
3 | import { AccountRoutingModule } from './account-routing.module' | ||
4 | import { AccountChangePasswordComponent } from './account-settings/account-change-password/account-change-password.component' | ||
5 | import { AccountDetailsComponent } from './account-settings/account-details/account-details.component' | ||
6 | import { AccountSettingsComponent } from './account-settings/account-settings.component' | ||
7 | import { AccountComponent } from './account.component' | ||
8 | import { AccountVideosComponent } from './account-videos/account-videos.component' | ||
9 | |||
10 | @NgModule({ | ||
11 | imports: [ | ||
12 | AccountRoutingModule, | ||
13 | SharedModule | ||
14 | ], | ||
15 | |||
16 | declarations: [ | ||
17 | AccountComponent, | ||
18 | AccountSettingsComponent, | ||
19 | AccountChangePasswordComponent, | ||
20 | AccountDetailsComponent, | ||
21 | AccountVideosComponent | ||
22 | ], | ||
23 | |||
24 | exports: [ | ||
25 | AccountComponent | ||
26 | ], | ||
27 | |||
28 | providers: [] | ||
29 | }) | ||
30 | export class AccountModule { } | ||
diff --git a/client/src/app/account/index.ts b/client/src/app/account/index.ts deleted file mode 100644 index dc56ffdbd..000000000 --- a/client/src/app/account/index.ts +++ /dev/null | |||
@@ -1,3 +0,0 @@ | |||
1 | export * from './account-routing.module' | ||
2 | export * from './account.component' | ||
3 | export * from './account.module' | ||