1 import { Component, EventEmitter, Input, Output } from '@angular/core'
2 import { ScreenService } from '@app/core'
3 import { VideoState } from '@shared/models'
4 import { Video } from '../shared-main'
7 selector: 'my-video-thumbnail',
8 styleUrls: [ './video-thumbnail.component.scss' ],
9 templateUrl: './video-thumbnail.component.html'
11 export class VideoThumbnailComponent {
15 @Input() videoRouterLink: any[]
16 @Input() queryParams: { [ p: string ]: any }
17 @Input() videoHref: string
18 @Input() videoTarget: string
20 @Input() displayWatchLaterPlaylist: boolean
21 @Input() inWatchLaterPlaylist: boolean
23 @Output() watchLaterClick = new EventEmitter<boolean>()
25 addToWatchLaterText: string
26 addedToWatchLaterText: string
28 constructor (private screenService: ScreenService) {
29 this.addToWatchLaterText = $localize`Add to watch later`
30 this.addedToWatchLaterText = $localize`Remove from watch later`
34 if (!this.video.state) return
36 return this.video.state.id === VideoState.LIVE_ENDED
40 if (!this.video) return ''
42 if (this.screenService.isInMobileView()) {
43 return this.video.previewUrl
46 return this.video.thumbnailUrl
49 getProgressPercent () {
50 if (!this.video.userHistory) return 0
52 const currentTime = this.video.userHistory.currentTime
54 return (currentTime / this.video.duration) * 100
57 getVideoRouterLink () {
58 if (this.videoRouterLink) return this.videoRouterLink
60 return [ '/videos/watch', this.video.uuid ]
63 onWatchLaterClick (event: Event) {
64 this.watchLaterClick.emit(this.inWatchLaterPlaylist)
66 event.stopPropagation()