X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fvideo%2Fvideo-thumbnail.component.ts;h=6f9292d52fd00355dc4783d6580415e58e9bc372;hb=ac0868bcc0259d4ff14265d9ae403e10869a13aa;hp=fe65ade9442a1b5da0beedaab65b269fa699d0fd;hpb=97567dd81f508dd6295ac4d73d849aa2ce0a6549;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/shared/video/video-thumbnail.component.ts b/client/src/app/shared/video/video-thumbnail.component.ts index fe65ade94..6f9292d52 100644 --- a/client/src/app/shared/video/video-thumbnail.component.ts +++ b/client/src/app/shared/video/video-thumbnail.component.ts @@ -1,6 +1,9 @@ -import { Component, Input } from '@angular/core' +import { Component, Input, OnInit, ChangeDetectorRef } from '@angular/core' import { Video } from './video.model' import { ScreenService } from '@app/shared/misc/screen.service' +import { AuthService, ThemeService } from '@app/core' +import { VideoPlaylistService } from '../video-playlist/video-playlist.service' +import { VideoPlaylistElementCreate } from '../../../../../shared' @Component({ selector: 'my-video-thumbnail', @@ -13,7 +16,45 @@ export class VideoThumbnailComponent { @Input() routerLink: any[] @Input() queryParams: any[] - constructor (private screenService: ScreenService) { + addToWatchLaterText = 'Add to watch later' + addedToWatchLaterText = 'Added to watch later' + addedToWatchLater: boolean + + watchLaterPlaylist: any + + constructor ( + private screenService: ScreenService, + private authService: AuthService, + private videoPlaylistService: VideoPlaylistService, + private cd: ChangeDetectorRef + ) {} + + load () { + if (this.addedToWatchLater !== undefined) return + if (!this.isUserLoggedIn()) return + + this.videoPlaylistService.doesVideoExistInPlaylist(this.video.id) + .subscribe( + existResult => { + for (const playlist of this.authService.getUser().specialPlaylists) { + const existingPlaylist = existResult[ this.video.id ].find(p => p.playlistId === playlist.id) + this.addedToWatchLater = !!existingPlaylist + + if (existingPlaylist) { + this.watchLaterPlaylist = { + playlistId: existingPlaylist.playlistId, + playlistElementId: existingPlaylist.playlistElementId + } + } else { + this.watchLaterPlaylist = { + playlistId: playlist.id + } + } + + this.cd.markForCheck() + } + } + ) } getImageUrl () { @@ -39,4 +80,37 @@ export class VideoThumbnailComponent { return [ '/videos/watch', this.video.uuid ] } + + isUserLoggedIn () { + return this.authService.isLoggedIn() + } + + addToWatchLater () { + if (this.addedToWatchLater === undefined) return + this.addedToWatchLater = true + + this.videoPlaylistService.addVideoInPlaylist( + this.watchLaterPlaylist.playlistId, + { videoId: this.video.id } as VideoPlaylistElementCreate + ).subscribe( + res => { + this.addedToWatchLater = true + this.watchLaterPlaylist.playlistElementId = res.videoPlaylistElement.id + } + ) + } + + removeFromWatchLater () { + if (this.addedToWatchLater === undefined) return + this.addedToWatchLater = false + + this.videoPlaylistService.removeVideoFromPlaylist( + this.watchLaterPlaylist.playlistId, + this.watchLaterPlaylist.playlistElementId + ).subscribe( + _ => { + this.addedToWatchLater = false + } + ) + } }