client/src/app/videos/video-list/video-overview.component.ts

   1 import { Component, OnInit } from '@angular/core'
   2 import { AuthService, Notifier } from '@app/core'
   3 import { I18n } from '@ngx-translate/i18n-polyfill'
   4 import { VideosOverview } from '@app/shared/overview/videos-overview.model'
   5 import { OverviewService } from '@app/shared/overview'
   6 import { Video } from '@app/shared/video/video.model'
   7 import { ScreenService } from '@app/shared/misc/screen.service'
   8 import { Subject } from 'rxjs'
   9
  10 @Component({
  11   selector: 'my-video-overview',
  12   templateUrl: './video-overview.component.html',
  13   styleUrls: [ './video-overview.component.scss' ]
  14 })
  15 export class VideoOverviewComponent implements OnInit {
  16   onDataSubject = new Subject<any>()
  17
  18   overviews: VideosOverview[] = []
  19   notResults = false
  20
  21   private loaded = false
  22   private currentPage = 1
  23   private maxPage = 20
  24   private lastWasEmpty = false
  25   private isLoading = false
  26
  27   constructor (
  28     private i18n: I18n,
  29     private notifier: Notifier,
  30     private authService: AuthService,
  31     private overviewService: OverviewService,
  32     private screenService: ScreenService
  33   ) { }
  34
  35   get user () {
  36     return this.authService.getUser()
  37   }
  38
  39   ngOnInit () {
  40     this.loadMoreResults()
  41   }
  42
  43   buildVideoChannelBy (object: { videos: Video[] }) {
  44     return object.videos[0].byVideoChannel
  45   }
  46
  47   buildVideoChannelAvatarUrl (object: { videos: Video[] }) {
  48     return object.videos[0].videoChannelAvatarUrl
  49   }
  50
  51   buildVideos (videos: Video[]) {
  52     const numberOfVideos = this.screenService.getNumberOfAvailableMiniatures()
  53
  54     return videos.slice(0, numberOfVideos * 2)
  55   }
  56
  57   onNearOfBottom () {
  58     if (this.currentPage >= this.maxPage) return
  59     if (this.lastWasEmpty) return
  60     if (this.isLoading) return
  61
  62     this.currentPage++
  63     this.loadMoreResults()
  64   }
  65
  66   private loadMoreResults () {
  67     this.isLoading = true
  68
  69     this.overviewService.getVideosOverview(this.currentPage)
  70         .subscribe(
  71           overview => {
  72             this.isLoading = false
  73
  74             if (overview.tags.length === 0 && overview.channels.length === 0 && overview.categories.length === 0) {
  75               this.lastWasEmpty = true
  76               if (this.loaded === false) this.notResults = true
  77
  78               return
  79             }
  80
  81             this.loaded = true
  82             this.onDataSubject.next(overview)
  83
  84             this.overviews.push(overview)
  85           },
  86
  87           err => {
  88             this.notifier.error(err.message)
  89             this.isLoading = false
  90           }
  91         )
  92   }
  93 }