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

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