client/src/app/+my-library/my-video-playlists/my-video-playlists.component.ts

   1 import { Subject } from 'rxjs'
   2 import { debounceTime, mergeMap } from 'rxjs/operators'
   3 import { Component, OnInit } from '@angular/core'
   4 import { AuthService, ComponentPagination, ConfirmService, Notifier, User } from '@app/core'
   5 import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist'
   6 import { VideoPlaylistType } from '@shared/models'
   7
   8 @Component({
   9   templateUrl: './my-video-playlists.component.html',
  10   styleUrls: [ './my-video-playlists.component.scss' ]
  11 })
  12 export class MyVideoPlaylistsComponent implements OnInit {
  13   videoPlaylistsSearch: string
  14   videoPlaylists: VideoPlaylist[] = []
  15   videoPlaylistSearchChanged = new Subject<string>()
  16
  17   pagination: ComponentPagination = {
  18     currentPage: 1,
  19     itemsPerPage: 5,
  20     totalItems: null
  21   }
  22
  23   onDataSubject = new Subject<any[]>()
  24
  25   private user: User
  26
  27   constructor (
  28     private authService: AuthService,
  29     private notifier: Notifier,
  30     private confirmService: ConfirmService,
  31     private videoPlaylistService: VideoPlaylistService
  32     ) {}
  33
  34   ngOnInit () {
  35     this.user = this.authService.getUser()
  36
  37     this.loadVideoPlaylists()
  38
  39     this.videoPlaylistSearchChanged
  40       .pipe(
  41         debounceTime(500))
  42       .subscribe(() => {
  43         this.loadVideoPlaylists(true)
  44       })
  45   }
  46
  47   async deleteVideoPlaylist (videoPlaylist: VideoPlaylist) {
  48     const res = await this.confirmService.confirm(
  49       $localize`Do you really want to delete ${videoPlaylist.displayName}?`,
  50       $localize`Delete`
  51     )
  52     if (res === false) return
  53
  54     this.videoPlaylistService.removeVideoPlaylist(videoPlaylist)
  55       .subscribe(
  56         () => {
  57           this.videoPlaylists = this.videoPlaylists
  58                                     .filter(p => p.id !== videoPlaylist.id)
  59
  60           this.notifier.success($localize`Playlist ${videoPlaylist.displayName}} deleted.`)
  61         },
  62
  63         error => this.notifier.error(error.message)
  64       )
  65   }
  66
  67   isRegularPlaylist (playlist: VideoPlaylist) {
  68     return playlist.type.id === VideoPlaylistType.REGULAR
  69   }
  70
  71   onNearOfBottom () {
  72     // Last page
  73     if (this.pagination.totalItems <= (this.pagination.currentPage * this.pagination.itemsPerPage)) return
  74
  75     this.pagination.currentPage += 1
  76     this.loadVideoPlaylists()
  77   }
  78
  79   resetSearch () {
  80     this.videoPlaylistsSearch = ''
  81     this.onVideoPlaylistSearchChanged()
  82   }
  83
  84   onVideoPlaylistSearchChanged () {
  85     this.videoPlaylistSearchChanged.next()
  86   }
  87
  88   private loadVideoPlaylists (reset = false) {
  89     this.authService.userInformationLoaded
  90         .pipe(mergeMap(() => {
  91           return this.videoPlaylistService.listAccountPlaylists(this.user.account, this.pagination, '-updatedAt', this.videoPlaylistsSearch)
  92         }))
  93         .subscribe(res => {
  94           if (reset) this.videoPlaylists = []
  95           this.videoPlaylists = this.videoPlaylists.concat(res.data)
  96           this.pagination.totalItems = res.total
  97
  98           this.onDataSubject.next(res.data)
  99         })
 100   }
 101 }