]>
Commit | Line | Data |
---|---|---|
230809ef | 1 | import { Component, OnInit } from '@angular/core'; |
cf20596c | 2 | import { ROUTER_DIRECTIVES, RouteParams, Router } from '@angular/router-deprecated'; |
dc8bc31b | 3 | |
32294074 C |
4 | import { PAGINATION_DIRECTIVES } from 'ng2-bootstrap/components/pagination'; |
5 | ||
1553e15d | 6 | import { AuthService } from '../../../users/services/auth.service'; |
32294074 | 7 | import { Pagination } from '../../pagination'; |
1553e15d | 8 | import { User } from '../../../users/models/user'; |
501bc6c2 C |
9 | import { VideosService } from '../../videos.service'; |
10 | import { Video } from '../../video'; | |
11 | import { VideoMiniatureComponent } from './video-miniature.component'; | |
471bc22f | 12 | import { Search, SearchField } from '../../../app/search'; |
cf20596c C |
13 | import { VideoSortComponent } from './video-sort.component'; |
14 | import { SortField } from './sort'; | |
dc8bc31b C |
15 | |
16 | @Component({ | |
17 | selector: 'my-videos-list', | |
18 | styleUrls: [ 'app/angular/videos/components/list/videos-list.component.css' ], | |
19 | templateUrl: 'app/angular/videos/components/list/videos-list.component.html', | |
cf20596c | 20 | directives: [ ROUTER_DIRECTIVES, PAGINATION_DIRECTIVES, VideoMiniatureComponent, VideoSortComponent ] |
dc8bc31b C |
21 | }) |
22 | ||
23 | export class VideosListComponent implements OnInit { | |
1553e15d | 24 | user: User = null; |
d908a155 | 25 | videos: Video[] = []; |
32294074 C |
26 | pagination: Pagination = { |
27 | currentPage: 1, | |
28 | itemsPerPage: 9, | |
29 | total: 0 | |
aff038cd | 30 | }; |
cf20596c | 31 | sort: SortField; |
dc8bc31b | 32 | |
471bc22f | 33 | private search: Search; |
98b01bac | 34 | |
dc8bc31b | 35 | constructor( |
1553e15d | 36 | private _authService: AuthService, |
98b01bac | 37 | private _videosService: VideosService, |
cf20596c C |
38 | private _routeParams: RouteParams, |
39 | private _router: Router | |
98b01bac | 40 | ) { |
471bc22f C |
41 | this.search = { |
42 | value: this._routeParams.get('search'), | |
43 | field: <SearchField>this._routeParams.get('field') | |
aff038cd | 44 | }; |
cf20596c C |
45 | |
46 | this.sort = <SortField>this._routeParams.get('sort') || '-createdDate'; | |
98b01bac | 47 | } |
dc8bc31b C |
48 | |
49 | ngOnInit() { | |
1553e15d C |
50 | if (this._authService.isLoggedIn()) { |
51 | this.user = User.load(); | |
52 | } | |
53 | ||
dc8bc31b C |
54 | this.getVideos(); |
55 | } | |
56 | ||
57 | getVideos() { | |
98b01bac C |
58 | let observable = null; |
59 | ||
471bc22f | 60 | if (this.search.value !== null) { |
cf20596c | 61 | observable = this._videosService.searchVideos(this.search, this.pagination, this.sort); |
98b01bac | 62 | } else { |
cf20596c | 63 | observable = this._videosService.getVideos(this.pagination, this.sort); |
98b01bac C |
64 | } |
65 | ||
66 | observable.subscribe( | |
32294074 C |
67 | ({ videos, totalVideos }) => { |
68 | this.videos = videos; | |
69 | this.pagination.total = totalVideos; | |
70 | }, | |
dc8bc31b C |
71 | error => alert(error) |
72 | ); | |
73 | } | |
74 | ||
501bc6c2 C |
75 | onRemoved(video: Video): void { |
76 | this.videos.splice(this.videos.indexOf(video), 1); | |
dc8bc31b C |
77 | } |
78 | ||
cf20596c C |
79 | onSort(sort: SortField) { |
80 | this.sort = sort; | |
81 | this._router.navigate(['VideosList', { sort: this.sort }]); | |
82 | this.getVideos(); | |
83 | } | |
dc8bc31b | 84 | } |