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/account-videos | |
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/account-videos')
3 files changed, 0 insertions, 292 deletions
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 | } | ||