1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
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 { VideoPlaylistType } from '@shared/models'
import { forkJoin } from 'rxjs'
import { VideoPlaylistElement } from '@app/shared/video-playlist/video-playlist-element.model'
import { VideoPlaylist } from '../video-playlist/video-playlist.model'
import { VideoPlaylistElementCreate } from '../../../../../shared'
import { VideoExistInPlaylist } from '@shared/models/videos/playlist/video-exist-in-playlist.model'
@Component({
selector: 'my-video-thumbnail',
styleUrls: [ './video-thumbnail.component.scss' ],
templateUrl: './video-thumbnail.component.html'
})
export class VideoThumbnailComponent {
@Input() video: Video
@Input() nsfw = false
@Input() routerLink: any[]
@Input() queryParams: any[]
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
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 () {
if (!this.video) return ''
if (this.screenService.isInMobileView()) {
return this.video.previewUrl
}
return this.video.thumbnailUrl
}
getProgressPercent () {
if (!this.video.userHistory) return 0
const currentTime = this.video.userHistory.currentTime
return (currentTime / this.video.duration) * 100
}
getVideoRouterLink () {
if (this.routerLink) return this.routerLink
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
}
)
}
}
|