aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared/video/video-thumbnail.component.ts
blob: 6f9292d52fd00355dc4783d6580415e58e9bc372 (plain) (blame)
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
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',
  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
    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 () {
    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
      }
    )
  }
}