provide specific engine boundaries for nodejs and yarn

[github/Chocobozzz/PeerTube.git] / client / src / app / videos / video-list / video-overview.component.ts

diff --git a/client/src/app/videos/video-list/video-overview.component.ts b/client/src/app/videos/video-list/video-overview.component.ts
index c758e115c2478653d28a8589db0696e65a53c8df..8ff8400db14c33255a76e25d1b70f1e540d92360 100644 (file)
--- a/client/src/app/videos/video-list/video-overview.component.ts
+++ b/client/src/app/videos/video-list/video-overview.component.ts
@@ -1,9 +1,10 @@
+import { Subject } from 'rxjs'
 import { Component, OnInit } from '@angular/core'
-import { AuthService } from '@app/core'
-import { NotificationsService } from 'angular2-notifications'
-import { I18n } from '@ngx-translate/i18n-polyfill'
-import { VideosOverview } from '@app/shared/overview/videos-overview.model'
+import { Notifier } from '@app/core'
+import { User, UserService } from '@app/shared'
+import { ScreenService } from '@app/shared/misc/screen.service'
 import { OverviewService } from '@app/shared/overview'
+import { VideosOverview } from '@app/shared/overview/videos-overview.model'
 import { Video } from '@app/shared/video/video.model'
 
 @Component({
@@ -12,45 +13,84 @@ import { Video } from '@app/shared/video/video.model'
   styleUrls: [ './video-overview.component.scss' ]
 })
 export class VideoOverviewComponent implements OnInit {
-  overview: VideosOverview = {
-    categories: [],
-    channels: [],
-    tags: []
-  }
+  onDataSubject = new Subject<any>()
+
+  overviews: VideosOverview[] = []
   notResults = false
 
+  userMiniature: User
+
+  private loaded = false
+  private currentPage = 1
+  private maxPage = 20
+  private lastWasEmpty = false
+  private isLoading = false
+
   constructor (
-    private i18n: I18n,
-    private notificationsService: NotificationsService,
-    private authService: AuthService,
-    private overviewService: OverviewService
+    private notifier: Notifier,
+    private userService: UserService,
+    private overviewService: OverviewService,
+    private screenService: ScreenService
   ) { }
 
-  get user () {
-    return this.authService.getUser()
+  ngOnInit () {
+    this.loadMoreResults()
+
+    this.userService.getAnonymousOrLoggedUser()
+      .subscribe(user => this.userMiniature = user)
+
+    this.userService.listenAnonymousUpdate()
+      .subscribe(user => this.userMiniature = user)
   }
 
-  ngOnInit () {
-    this.overviewService.getVideosOverview()
+  buildVideoChannelBy (object: { videos: Video[] }) {
+    return object.videos[0].byVideoChannel
+  }
+
+  buildVideoChannelAvatarUrl (object: { videos: Video[] }) {
+    return object.videos[0].videoChannelAvatarUrl
+  }
+
+  buildVideos (videos: Video[]) {
+    const numberOfVideos = this.screenService.getNumberOfAvailableMiniatures()
+
+    return videos.slice(0, numberOfVideos * 2)
+  }
+
+  onNearOfBottom () {
+    if (this.currentPage >= this.maxPage) return
+    if (this.lastWasEmpty) return
+    if (this.isLoading) return
+
+    this.currentPage++
+    this.loadMoreResults()
+  }
+
+  private loadMoreResults () {
+    this.isLoading = true
+
+    this.overviewService.getVideosOverview(this.currentPage)
         .subscribe(
           overview => {
-            this.overview = overview
+            this.isLoading = false
 
-            if (
-              this.overview.categories.length === 0 &&
-              this.overview.channels.length === 0 &&
-              this.overview.tags.length === 0
-            ) this.notResults = true
+            if (overview.tags.length === 0 && overview.channels.length === 0 && overview.categories.length === 0) {
+              this.lastWasEmpty = true
+              if (this.loaded === false) this.notResults = true
+
+              return
+            }
+
+            this.loaded = true
+            this.onDataSubject.next(overview)
+
+            this.overviews.push(overview)
           },
 
           err => {
-            console.log(err)
-            this.notificationsService.error('Error', err.text)
+            this.notifier.error(err.message)
+            this.isLoading = false
           }
         )
   }
-
-  buildVideoChannelBy (object: { videos: Video[] }) {
-    return object.videos[0].byVideoChannel
-  }
 }