X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Baccounts%2Faccount-video-channels%2Faccount-video-channels.component.ts;h=f2beb6689cffe4b606e6c03a65ca7ddaae5fb45a;hb=67264e060b6068399dae9a67abae035a73b84af1;hp=44f5626bb810f3961329285190cc059fb49a2ed3;hpb=8a19bee1a1ee39f973bb37429e4f73c3f2873cdb;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts b/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts index 44f5626bb..f2beb6689 100644 --- a/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts +++ b/client/src/app/+accounts/account-video-channels/account-video-channels.component.ts @@ -1,11 +1,9 @@ +import { from, Subject, Subscription } from 'rxjs' +import { concatMap, map, switchMap, tap } from 'rxjs/operators' import { Component, OnDestroy, OnInit } from '@angular/core' -import { ActivatedRoute } from '@angular/router' -import { Account } from '@app/shared/account/account.model' -import { AccountService } from '@app/shared/account/account.service' -import { VideoChannelService } from '@app/shared/video-channel/video-channel.service' -import { flatMap, map, tap } from 'rxjs/operators' -import { Subscription } from 'rxjs' -import { VideoChannel } from '@app/shared/video-channel/video-channel.model' +import { ComponentPagination, hasMoreItems, ScreenService, User, UserService } from '@app/core' +import { Account, AccountService, Video, VideoChannel, VideoChannelService, VideoService } from '@app/shared/shared-main' +import { NSFWPolicyType, VideoSortField } from '@shared/models' @Component({ selector: 'my-account-video-channels', @@ -15,27 +13,99 @@ import { VideoChannel } from '@app/shared/video-channel/video-channel.model' export class AccountVideoChannelsComponent implements OnInit, OnDestroy { account: Account videoChannels: VideoChannel[] = [] + videos: { [id: number]: Video[] } = {} + + channelPagination: ComponentPagination = { + currentPage: 1, + itemsPerPage: 2, + totalItems: null + } + + videosPagination: ComponentPagination = { + currentPage: 1, + itemsPerPage: 12, + totalItems: null + } + videosSort: VideoSortField = '-publishedAt' + + onChannelDataSubject = new Subject() + + userMiniature: User + nsfwPolicy: NSFWPolicyType private accountSub: Subscription constructor ( - protected route: ActivatedRoute, private accountService: AccountService, - private videoChannelService: VideoChannelService + private videoChannelService: VideoChannelService, + private videoService: VideoService, + private screenService: ScreenService, + private userService: UserService ) { } ngOnInit () { // Parent get the account for us this.accountSub = this.accountService.accountLoaded - .pipe( - tap(account => this.account = account), - flatMap(account => this.videoChannelService.listAccountVideoChannels(account)), - map(res => res.data) - ) - .subscribe(videoChannels => this.videoChannels = videoChannels) + .subscribe(account => { + this.account = account + + this.loadMoreChannels() + }) + + this.userService.getAnonymousOrLoggedUser() + .subscribe(user => { + this.userMiniature = user + + this.nsfwPolicy = user.nsfwPolicy + }) } ngOnDestroy () { if (this.accountSub) this.accountSub.unsubscribe() } + + loadMoreChannels () { + this.videoChannelService.listAccountVideoChannels(this.account, this.channelPagination) + .pipe( + tap(res => this.channelPagination.totalItems = res.total), + switchMap(res => from(res.data)), + concatMap(videoChannel => { + const options = { + videoChannel, + videoPagination: this.videosPagination, + sort: this.videosSort, + nsfwPolicy: this.nsfwPolicy + } + + return this.videoService.getVideoChannelVideos(options) + .pipe(map(data => ({ videoChannel, videos: data.data }))) + }) + ) + .subscribe(({ videoChannel, videos }) => { + this.videoChannels.push(videoChannel) + + this.videos[videoChannel.id] = videos + + this.onChannelDataSubject.next([ videoChannel ]) + }) + } + + getVideosOf (videoChannel: VideoChannel) { + const numberOfVideos = this.screenService.getNumberOfAvailableMiniatures() + + // 2 rows + return this.videos[ videoChannel.id ].slice(0, numberOfVideos * 2) + } + + onNearOfBottom () { + if (!hasMoreItems(this.channelPagination)) return + + this.channelPagination.currentPage += 1 + + this.loadMoreChannels() + } + + getVideoChannelLink (videoChannel: VideoChannel) { + return [ '/video-channels', videoChannel.nameWithHost ] + } }