aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/video-list
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-06-16 14:32:15 +0200
committerChocobozzz <florian.bigard@gmail.com>2017-06-16 14:32:15 +0200
commitdf98563e2104b82b119c00a3cd83cd0dc1242d25 (patch)
treea9720bf01bac9ad5646bd3d3c9bc7653617afdad /client/src/app/videos/video-list
parent46757b477c1adb5f98060d15998a3852e18902a6 (diff)
downloadPeerTube-df98563e2104b82b119c00a3cd83cd0dc1242d25.tar.gz
PeerTube-df98563e2104b82b119c00a3cd83cd0dc1242d25.tar.zst
PeerTube-df98563e2104b82b119c00a3cd83cd0dc1242d25.zip
Use typescript standard and lint all files
Diffstat (limited to 'client/src/app/videos/video-list')
-rw-r--r--client/src/app/videos/video-list/index.ts8
-rw-r--r--client/src/app/videos/video-list/loader.component.ts4
-rw-r--r--client/src/app/videos/video-list/video-list.component.html2
-rw-r--r--client/src/app/videos/video-list/video-list.component.ts126
-rw-r--r--client/src/app/videos/video-list/video-miniature.component.ts31
-rw-r--r--client/src/app/videos/video-list/video-sort.component.ts22
6 files changed, 97 insertions, 96 deletions
diff --git a/client/src/app/videos/video-list/index.ts b/client/src/app/videos/video-list/index.ts
index 71d3b78e6..a490e6bb5 100644
--- a/client/src/app/videos/video-list/index.ts
+++ b/client/src/app/videos/video-list/index.ts
@@ -1,4 +1,4 @@
1export * from './loader.component'; 1export * from './loader.component'
2export * from './video-list.component'; 2export * from './video-list.component'
3export * from './video-miniature.component'; 3export * from './video-miniature.component'
4export * from './video-sort.component'; 4export * from './video-sort.component'
diff --git a/client/src/app/videos/video-list/loader.component.ts b/client/src/app/videos/video-list/loader.component.ts
index e72d2f3f3..e5780e0fa 100644
--- a/client/src/app/videos/video-list/loader.component.ts
+++ b/client/src/app/videos/video-list/loader.component.ts
@@ -1,4 +1,4 @@
1import { Component, Input } from '@angular/core'; 1import { Component, Input } from '@angular/core'
2 2
3@Component({ 3@Component({
4 selector: 'my-loader', 4 selector: 'my-loader',
@@ -7,5 +7,5 @@ import { Component, Input } from '@angular/core';
7}) 7})
8 8
9export class LoaderComponent { 9export class LoaderComponent {
10 @Input() loading: boolean; 10 @Input() loading: boolean
11} 11}
diff --git a/client/src/app/videos/video-list/video-list.component.html b/client/src/app/videos/video-list/video-list.component.html
index f80592279..680fba3f5 100644
--- a/client/src/app/videos/video-list/video-list.component.html
+++ b/client/src/app/videos/video-list/video-list.component.html
@@ -17,7 +17,7 @@
17 17
18 <my-video-miniature 18 <my-video-miniature
19 class="ng-animate" 19 class="ng-animate"
20 *ngFor="let video of videos" [video]="video" [user]="user" [currentSort]="sort" (removed)="onRemoved(video)" 20 *ngFor="let video of videos" [video]="video" [user]="user" [currentSort]="sort"
21 > 21 >
22 </my-video-miniature> 22 </my-video-miniature>
23</div> 23</div>
diff --git a/client/src/app/videos/video-list/video-list.component.ts b/client/src/app/videos/video-list/video-list.component.ts
index 16a40bdc4..0c36e5b08 100644
--- a/client/src/app/videos/video-list/video-list.component.ts
+++ b/client/src/app/videos/video-list/video-list.component.ts
@@ -1,17 +1,17 @@
1import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core'; 1import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router'; 2import { ActivatedRoute, Router } from '@angular/router'
3import { BehaviorSubject } from 'rxjs/BehaviorSubject'; 3import { BehaviorSubject } from 'rxjs/BehaviorSubject'
4 4
5import { NotificationsService } from 'angular2-notifications'; 5import { NotificationsService } from 'angular2-notifications'
6 6
7import { 7import {
8 SortField, 8 SortField,
9 Video, 9 Video,
10 VideoService 10 VideoService
11} from '../shared'; 11} from '../shared'
12import { AuthService, AuthUser } from '../../core'; 12import { AuthService, AuthUser } from '../../core'
13import { RestPagination, Search, SearchField } from '../../shared'; 13import { RestPagination, Search, SearchField } from '../../shared'
14import { SearchService } from '../../shared'; 14import { SearchService } from '../../shared'
15 15
16@Component({ 16@Component({
17 selector: 'my-videos-list', 17 selector: 'my-videos-list',
@@ -19,21 +19,21 @@ import { SearchService } from '../../shared';
19 templateUrl: './video-list.component.html' 19 templateUrl: './video-list.component.html'
20}) 20})
21export class VideoListComponent implements OnInit, OnDestroy { 21export class VideoListComponent implements OnInit, OnDestroy {
22 loading: BehaviorSubject<boolean> = new BehaviorSubject(false); 22 loading: BehaviorSubject<boolean> = new BehaviorSubject(false)
23 pagination: RestPagination = { 23 pagination: RestPagination = {
24 currentPage: 1, 24 currentPage: 1,
25 itemsPerPage: 25, 25 itemsPerPage: 25,
26 totalItems: null 26 totalItems: null
27 }; 27 }
28 sort: SortField; 28 sort: SortField
29 user: AuthUser = null; 29 user: AuthUser = null
30 videos: Video[] = []; 30 videos: Video[] = []
31 31
32 private search: Search; 32 private search: Search
33 private subActivatedRoute: any; 33 private subActivatedRoute: any
34 private subSearch: any; 34 private subSearch: any
35 35
36 constructor( 36 constructor (
37 private notificationsService: NotificationsService, 37 private notificationsService: NotificationsService,
38 private authService: AuthService, 38 private authService: AuthService,
39 private changeDetector: ChangeDetectorRef, 39 private changeDetector: ChangeDetectorRef,
@@ -43,114 +43,114 @@ export class VideoListComponent implements OnInit, OnDestroy {
43 private searchService: SearchService 43 private searchService: SearchService
44 ) {} 44 ) {}
45 45
46 ngOnInit() { 46 ngOnInit () {
47 if (this.authService.isLoggedIn()) { 47 if (this.authService.isLoggedIn()) {
48 this.user = AuthUser.load(); 48 this.user = AuthUser.load()
49 } 49 }
50 50
51 // Subscribe to route changes 51 // Subscribe to route changes
52 this.subActivatedRoute = this.route.params.subscribe(routeParams => { 52 this.subActivatedRoute = this.route.params.subscribe(routeParams => {
53 this.loadRouteParams(routeParams); 53 this.loadRouteParams(routeParams)
54 54
55 // Update the search service component 55 // Update the search service component
56 this.searchService.updateSearch.next(this.search); 56 this.searchService.updateSearch.next(this.search)
57 this.getVideos(); 57 this.getVideos()
58 }); 58 })
59 59
60 // Subscribe to search changes 60 // Subscribe to search changes
61 this.subSearch = this.searchService.searchUpdated.subscribe(search => { 61 this.subSearch = this.searchService.searchUpdated.subscribe(search => {
62 this.search = search; 62 this.search = search
63 // Reset pagination 63 // Reset pagination
64 this.pagination.currentPage = 1; 64 this.pagination.currentPage = 1
65 65
66 this.navigateToNewParams(); 66 this.navigateToNewParams()
67 }); 67 })
68 } 68 }
69 69
70 ngOnDestroy() { 70 ngOnDestroy () {
71 this.subActivatedRoute.unsubscribe(); 71 this.subActivatedRoute.unsubscribe()
72 this.subSearch.unsubscribe(); 72 this.subSearch.unsubscribe()
73 } 73 }
74 74
75 getVideos() { 75 getVideos () {
76 this.loading.next(true); 76 this.loading.next(true)
77 this.videos = []; 77 this.videos = []
78 78
79 let observable = null; 79 let observable = null
80 if (this.search.value) { 80 if (this.search.value) {
81 observable = this.videoService.searchVideos(this.search, this.pagination, this.sort); 81 observable = this.videoService.searchVideos(this.search, this.pagination, this.sort)
82 } else { 82 } else {
83 observable = this.videoService.getVideos(this.pagination, this.sort); 83 observable = this.videoService.getVideos(this.pagination, this.sort)
84 } 84 }
85 85
86 observable.subscribe( 86 observable.subscribe(
87 ({ videos, totalVideos }) => { 87 ({ videos, totalVideos }) => {
88 this.videos = videos; 88 this.videos = videos
89 this.pagination.totalItems = totalVideos; 89 this.pagination.totalItems = totalVideos
90 90
91 this.loading.next(false); 91 this.loading.next(false)
92 }, 92 },
93 error => this.notificationsService.error('Error', error.text) 93 error => this.notificationsService.error('Error', error.text)
94 ); 94 )
95 } 95 }
96 96
97 isThereNoVideo() { 97 isThereNoVideo () {
98 return !this.loading.getValue() && this.videos.length === 0; 98 return !this.loading.getValue() && this.videos.length === 0
99 } 99 }
100 100
101 onPageChanged(event: any) { 101 onPageChanged (event: any) {
102 // Be sure the current page is set 102 // Be sure the current page is set
103 this.pagination.currentPage = event.page; 103 this.pagination.currentPage = event.page
104 104
105 this.navigateToNewParams(); 105 this.navigateToNewParams()
106 } 106 }
107 107
108 onSort(sort: SortField) { 108 onSort (sort: SortField) {
109 this.sort = sort; 109 this.sort = sort
110 110
111 this.navigateToNewParams(); 111 this.navigateToNewParams()
112 } 112 }
113 113
114 private buildRouteParams() { 114 private buildRouteParams () {
115 // There is always a sort and a current page 115 // There is always a sort and a current page
116 const params: any = { 116 const params: any = {
117 sort: this.sort, 117 sort: this.sort,
118 page: this.pagination.currentPage 118 page: this.pagination.currentPage
119 }; 119 }
120 120
121 // Maybe there is a search 121 // Maybe there is a search
122 if (this.search.value) { 122 if (this.search.value) {
123 params.field = this.search.field; 123 params.field = this.search.field
124 params.search = this.search.value; 124 params.search = this.search.value
125 } 125 }
126 126
127 return params; 127 return params
128 } 128 }
129 129
130 private loadRouteParams(routeParams) { 130 private loadRouteParams (routeParams) {
131 if (routeParams['search'] !== undefined) { 131 if (routeParams['search'] !== undefined) {
132 this.search = { 132 this.search = {
133 value: routeParams['search'], 133 value: routeParams['search'],
134 field: <SearchField>routeParams['field'] 134 field: routeParams['field'] as SearchField
135 }; 135 }
136 } else { 136 } else {
137 this.search = { 137 this.search = {
138 value: '', 138 value: '',
139 field: 'name' 139 field: 'name'
140 }; 140 }
141 } 141 }
142 142
143 this.sort = <SortField>routeParams['sort'] || '-createdAt'; 143 this.sort = routeParams['sort'] as SortField || '-createdAt'
144 144
145 if (routeParams['page'] !== undefined) { 145 if (routeParams['page'] !== undefined) {
146 this.pagination.currentPage = parseInt(routeParams['page']); 146 this.pagination.currentPage = parseInt(routeParams['page'], 10)
147 } else { 147 } else {
148 this.pagination.currentPage = 1; 148 this.pagination.currentPage = 1
149 } 149 }
150 } 150 }
151 151
152 private navigateToNewParams() { 152 private navigateToNewParams () {
153 const routeParams = this.buildRouteParams(); 153 const routeParams = this.buildRouteParams()
154 this.router.navigate(['/videos/list', routeParams]); 154 this.router.navigate(['/videos/list', routeParams])
155 } 155 }
156} 156}
diff --git a/client/src/app/videos/video-list/video-miniature.component.ts b/client/src/app/videos/video-list/video-miniature.component.ts
index 28601ca7f..1cfeacf36 100644
--- a/client/src/app/videos/video-list/video-miniature.component.ts
+++ b/client/src/app/videos/video-list/video-miniature.component.ts
@@ -1,10 +1,10 @@
1import { Component, Input, Output, EventEmitter } from '@angular/core'; 1import { Component, Input, Output, EventEmitter } from '@angular/core'
2 2
3import { NotificationsService } from 'angular2-notifications'; 3import { NotificationsService } from 'angular2-notifications'
4 4
5import { ConfirmService, ConfigService } from '../../core'; 5import { ConfirmService, ConfigService } from '../../core'
6import { SortField, Video, VideoService } from '../shared'; 6import { SortField, Video, VideoService } from '../shared'
7import { User } from '../../shared'; 7import { User } from '../../shared'
8 8
9@Component({ 9@Component({
10 selector: 'my-video-miniature', 10 selector: 'my-video-miniature',
@@ -13,25 +13,26 @@ import { User } from '../../shared';
13}) 13})
14 14
15export class VideoMiniatureComponent { 15export class VideoMiniatureComponent {
16 @Input() currentSort: SortField; 16 @Input() currentSort: SortField
17 @Input() user: User; 17 @Input() user: User
18 @Input() video: Video; 18 @Input() video: Video
19 19
20 constructor( 20 constructor (
21 private notificationsService: NotificationsService, 21 private notificationsService: NotificationsService,
22 private confirmService: ConfirmService, 22 private confirmService: ConfirmService,
23 private configService: ConfigService, 23 private configService: ConfigService,
24 private videoService: VideoService 24 private videoService: VideoService
25 ) {} 25 ) {}
26 26
27 getVideoName() { 27 getVideoName () {
28 if (this.isVideoNSFWForThisUser()) 28 if (this.isVideoNSFWForThisUser()) {
29 return 'NSFW'; 29 return 'NSFW'
30 }
30 31
31 return this.video.name; 32 return this.video.name
32 } 33 }
33 34
34 isVideoNSFWForThisUser() { 35 isVideoNSFWForThisUser () {
35 return this.video.isVideoNSFWForUser(this.user); 36 return this.video.isVideoNSFWForUser(this.user)
36 } 37 }
37} 38}
diff --git a/client/src/app/videos/video-list/video-sort.component.ts b/client/src/app/videos/video-list/video-sort.component.ts
index 20979a395..64916bf16 100644
--- a/client/src/app/videos/video-list/video-sort.component.ts
+++ b/client/src/app/videos/video-list/video-sort.component.ts
@@ -1,6 +1,6 @@
1import { Component, EventEmitter, Input, Output } from '@angular/core'; 1import { Component, EventEmitter, Input, Output } from '@angular/core'
2 2
3import { SortField } from '../shared'; 3import { SortField } from '../shared'
4 4
5@Component({ 5@Component({
6 selector: 'my-video-sort', 6 selector: 'my-video-sort',
@@ -8,9 +8,9 @@ import { SortField } from '../shared';
8}) 8})
9 9
10export class VideoSortComponent { 10export class VideoSortComponent {
11 @Output() sort = new EventEmitter<any>(); 11 @Output() sort = new EventEmitter<any>()
12 12
13 @Input() currentSort: SortField; 13 @Input() currentSort: SortField
14 14
15 sortChoices: { [ P in SortField ]: string } = { 15 sortChoices: { [ P in SortField ]: string } = {
16 'name': 'Name - Asc', 16 'name': 'Name - Asc',
@@ -23,17 +23,17 @@ export class VideoSortComponent {
23 '-views': 'Views - Desc', 23 '-views': 'Views - Desc',
24 'likes': 'Likes - Asc', 24 'likes': 'Likes - Asc',
25 '-likes': 'Likes - Desc' 25 '-likes': 'Likes - Desc'
26 }; 26 }
27 27
28 get choiceKeys() { 28 get choiceKeys () {
29 return Object.keys(this.sortChoices); 29 return Object.keys(this.sortChoices)
30 } 30 }
31 31
32 getStringChoice(choiceKey: SortField) { 32 getStringChoice (choiceKey: SortField) {
33 return this.sortChoices[choiceKey]; 33 return this.sortChoices[choiceKey]
34 } 34 }
35 35
36 onSortChange() { 36 onSortChange () {
37 this.sort.emit(this.currentSort); 37 this.sort.emit(this.currentSort)
38 } 38 }
39} 39}