aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/video-list/video-list.component.ts
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/videos/video-list/video-list.component.ts')
-rw-r--r--client/src/app/videos/video-list/video-list.component.ts102
1 files changed, 21 insertions, 81 deletions
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 bf6f60215..784162679 100644
--- a/client/src/app/videos/video-list/video-list.component.ts
+++ b/client/src/app/videos/video-list/video-list.component.ts
@@ -1,51 +1,33 @@
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 { Subscription } from 'rxjs/Subscription' 3import { Subscription } from 'rxjs/Subscription'
4import { BehaviorSubject } from 'rxjs/BehaviorSubject'
5 4
6import { NotificationsService } from 'angular2-notifications' 5import { NotificationsService } from 'angular2-notifications'
7 6
8import { AuthService } from '../../core' 7import { VideoService } from '../shared'
9import { 8import { Search, SearchField, SearchService } from '../../shared'
10 SortField, 9import { AbstractVideoList } from './shared'
11 Video,
12 VideoService,
13 VideoPagination
14} from '../shared'
15import { Search, SearchField, SearchService, User } from '../../shared'
16 10
17@Component({ 11@Component({
18 selector: 'my-videos-list', 12 selector: 'my-videos-list',
19 styleUrls: [ './video-list.component.scss' ], 13 styleUrls: [ './shared/abstract-video-list.scss' ],
20 templateUrl: './video-list.component.html' 14 templateUrl: './shared/abstract-video-list.html'
21}) 15})
22export class VideoListComponent implements OnInit, OnDestroy { 16export class VideoListComponent extends AbstractVideoList implements OnInit, OnDestroy {
23 loading: BehaviorSubject<boolean> = new BehaviorSubject(false)
24 pagination: VideoPagination = {
25 currentPage: 1,
26 itemsPerPage: 25,
27 totalItems: null
28 }
29 sort: SortField
30 user: User
31 videos: Video[] = []
32
33 private search: Search 17 private search: Search
34 private subActivatedRoute: Subscription
35 private subSearch: Subscription 18 private subSearch: Subscription
36 19
37 constructor ( 20 constructor (
38 private authService: AuthService, 21 protected router: Router,
39 private notificationsService: NotificationsService, 22 protected route: ActivatedRoute,
40 private router: Router, 23 protected notificationsService: NotificationsService,
41 private route: ActivatedRoute,
42 private videoService: VideoService, 24 private videoService: VideoService,
43 private searchService: SearchService 25 private searchService: SearchService
44 ) {} 26 ) {
27 super()
28 }
45 29
46 ngOnInit () { 30 ngOnInit () {
47 this.user = this.authService.getUser()
48
49 // Subscribe to route changes 31 // Subscribe to route changes
50 this.subActivatedRoute = this.route.params.subscribe(routeParams => { 32 this.subActivatedRoute = this.route.params.subscribe(routeParams => {
51 this.loadRouteParams(routeParams) 33 this.loadRouteParams(routeParams)
@@ -66,14 +48,12 @@ export class VideoListComponent implements OnInit, OnDestroy {
66 } 48 }
67 49
68 ngOnDestroy () { 50 ngOnDestroy () {
69 this.subActivatedRoute.unsubscribe() 51 super.ngOnDestroy()
52
70 this.subSearch.unsubscribe() 53 this.subSearch.unsubscribe()
71 } 54 }
72 55
73 getVideos () { 56 getVideosObservable () {
74 this.loading.next(true)
75 this.videos = []
76
77 let observable = null 57 let observable = null
78 if (this.search.value) { 58 if (this.search.value) {
79 observable = this.videoService.searchVideos(this.search, this.pagination, this.sort) 59 observable = this.videoService.searchVideos(this.search, this.pagination, this.sort)
@@ -81,40 +61,11 @@ export class VideoListComponent implements OnInit, OnDestroy {
81 observable = this.videoService.getVideos(this.pagination, this.sort) 61 observable = this.videoService.getVideos(this.pagination, this.sort)
82 } 62 }
83 63
84 observable.subscribe( 64 return observable
85 ({ videos, totalVideos }) => {
86 this.videos = videos
87 this.pagination.totalItems = totalVideos
88
89 this.loading.next(false)
90 },
91 error => this.notificationsService.error('Error', error.text)
92 )
93 }
94
95 isThereNoVideo () {
96 return !this.loading.getValue() && this.videos.length === 0
97 }
98
99 onPageChanged (event: { page: number }) {
100 // Be sure the current page is set
101 this.pagination.currentPage = event.page
102
103 this.navigateToNewParams()
104 } 65 }
105 66
106 onSort (sort: SortField) { 67 protected buildRouteParams () {
107 this.sort = sort 68 const params = super.buildRouteParams()
108
109 this.navigateToNewParams()
110 }
111
112 private buildRouteParams () {
113 // There is always a sort and a current page
114 const params = {
115 sort: this.sort,
116 page: this.pagination.currentPage
117 }
118 69
119 // Maybe there is a search 70 // Maybe there is a search
120 if (this.search.value) { 71 if (this.search.value) {
@@ -125,7 +76,9 @@ export class VideoListComponent implements OnInit, OnDestroy {
125 return params 76 return params
126 } 77 }
127 78
128 private loadRouteParams (routeParams: { [ key: string ]: any }) { 79 protected loadRouteParams (routeParams: { [ key: string ]: any }) {
80 super.loadRouteParams(routeParams)
81
129 if (routeParams['search'] !== undefined) { 82 if (routeParams['search'] !== undefined) {
130 this.search = { 83 this.search = {
131 value: routeParams['search'], 84 value: routeParams['search'],
@@ -137,18 +90,5 @@ export class VideoListComponent implements OnInit, OnDestroy {
137 field: 'name' 90 field: 'name'
138 } 91 }
139 } 92 }
140
141 this.sort = routeParams['sort'] as SortField || '-createdAt'
142
143 if (routeParams['page'] !== undefined) {
144 this.pagination.currentPage = parseInt(routeParams['page'], 10)
145 } else {
146 this.pagination.currentPage = 1
147 }
148 }
149
150 private navigateToNewParams () {
151 const routeParams = this.buildRouteParams()
152 this.router.navigate([ '/videos/list', routeParams ])
153 } 93 }
154} 94}