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