X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fangular%2Fvideos%2Fcomponents%2Flist%2Fvideos-list.component.ts;h=94b064e163aa7654a6ccb4b9863a4518abd117b2;hb=a99593ed9f3244e75f7db793ba6716754d664573;hp=e5af87448ac2a50fca4387416816ea48ee137a6f;hpb=dc8bc31be517a53e8fbe7100cfe45cd73f596de0;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/angular/videos/components/list/videos-list.component.ts b/client/angular/videos/components/list/videos-list.component.ts index e5af87448..94b064e16 100644 --- a/client/angular/videos/components/list/videos-list.component.ts +++ b/client/angular/videos/components/list/videos-list.component.ts @@ -1,39 +1,94 @@ -import {Component, OnInit} from 'angular2/core'; -import {ROUTER_DIRECTIVES} from 'angular2/router'; +import { Component, OnInit } from '@angular/core'; +import { ROUTER_DIRECTIVES, RouteParams, Router } from '@angular/router-deprecated'; -import {VideosService} from '../../services/videos.service'; -import {Video} from '../../models/video'; +import { PAGINATION_DIRECTIVES } from 'ng2-bootstrap/components/pagination'; + +import { AuthService } from '../../../users/services/auth.service'; +import { Pagination } from '../../pagination'; +import { User } from '../../../users/models/user'; +import { VideosService } from '../../videos.service'; +import { Video } from '../../video'; +import { VideoMiniatureComponent } from './video-miniature.component'; +import { Search, SearchField } from '../../../app/search'; +import { VideoSortComponent } from './video-sort.component'; +import { SortField } from './sort'; @Component({ selector: 'my-videos-list', styleUrls: [ 'app/angular/videos/components/list/videos-list.component.css' ], templateUrl: 'app/angular/videos/components/list/videos-list.component.html', - directives: [ ROUTER_DIRECTIVES ] + directives: [ ROUTER_DIRECTIVES, PAGINATION_DIRECTIVES, VideoMiniatureComponent, VideoSortComponent ] }) export class VideosListComponent implements OnInit { - videos: Video[]; + user: User = null; + videos: Video[] = []; + pagination: Pagination = { + currentPage: 1, + itemsPerPage: 9, + total: 0 + }; + sort: SortField; + + private search: Search; constructor( - private _videosService: VideosService - ) { } + private _authService: AuthService, + private _videosService: VideosService, + private _routeParams: RouteParams, + private _router: Router + ) { + this.search = { + value: this._routeParams.get('search'), + field: this._routeParams.get('field') + }; + + this.sort = this._routeParams.get('sort') || '-createdDate'; + } ngOnInit() { + if (this._authService.isLoggedIn()) { + this.user = User.load(); + } + this.getVideos(); } getVideos() { - this._videosService.getVideos().subscribe( - videos => this.videos = videos, + let observable = null; + + if (this.search.value !== null) { + observable = this._videosService.searchVideos(this.search, this.pagination, this.sort); + } else { + observable = this._videosService.getVideos(this.pagination, this.sort); + } + + observable.subscribe( + ({ videos, totalVideos }) => { + this.videos = videos; + this.pagination.total = totalVideos; + }, error => alert(error) ); } - removeVideo(id: string) { - this._videosService.removeVideo(id).subscribe( - status => this.getVideos(), - error => alert(error) - ) + onRemoved(video: Video): void { + this.videos.splice(this.videos.indexOf(video), 1); } + onSort(sort: SortField) { + this.sort = sort; + + const params: any = { + sort: this.sort + }; + + if (this.search.value) { + params.search = this.search.value; + params.field = this.search.field; + } + + this._router.navigate(['VideosList', params]); + this.getVideos(); + } }