diff options
author | Chocobozzz <me@florianbigard.com> | 2020-06-23 14:49:20 +0200 |
---|---|---|
committer | Chocobozzz <chocobozzz@cpy.re> | 2020-06-23 16:00:49 +0200 |
commit | 1942f11d5ee6926ad93dc1b79fae18325ba5de18 (patch) | |
tree | 3f2a3cd9466a56c419d197ac832a3e9cbc86bec4 /client/src/app/+videos/video-list/overview/video-overview.component.ts | |
parent | 67ed6552b831df66713bac9e672738796128d33f (diff) | |
download | PeerTube-1942f11d5ee6926ad93dc1b79fae18325ba5de18.tar.gz PeerTube-1942f11d5ee6926ad93dc1b79fae18325ba5de18.tar.zst PeerTube-1942f11d5ee6926ad93dc1b79fae18325ba5de18.zip |
Lazy load all routes
Diffstat (limited to 'client/src/app/+videos/video-list/overview/video-overview.component.ts')
-rw-r--r-- | client/src/app/+videos/video-list/overview/video-overview.component.ts | 94 |
1 files changed, 94 insertions, 0 deletions
diff --git a/client/src/app/+videos/video-list/overview/video-overview.component.ts b/client/src/app/+videos/video-list/overview/video-overview.component.ts new file mode 100644 index 000000000..b3be1d7b5 --- /dev/null +++ b/client/src/app/+videos/video-list/overview/video-overview.component.ts | |||
@@ -0,0 +1,94 @@ | |||
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 | } | ||