aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2019-08-22 13:59:54 +0200
committerChocobozzz <me@florianbigard.com>2019-08-22 13:59:54 +0200
commit6eb62c33908025d877a28f1cfbc527c511ae3103 (patch)
tree90544c222a721e878ee69f0a15a339d4dc67cb18 /client/src/app/videos
parenta3671f0709f3f423819fcfed47a4d4879cf82780 (diff)
downloadPeerTube-6eb62c33908025d877a28f1cfbc527c511ae3103.tar.gz
PeerTube-6eb62c33908025d877a28f1cfbc527c511ae3103.tar.zst
PeerTube-6eb62c33908025d877a28f1cfbc527c511ae3103.zip
Fix video rows overflow
In discover and account channel videos pages
Diffstat (limited to 'client/src/app/videos')
-rw-r--r--client/src/app/videos/video-list/video-overview.component.html9
-rw-r--r--client/src/app/videos/video-list/video-overview.component.ts10
2 files changed, 15 insertions, 4 deletions
diff --git a/client/src/app/videos/video-list/video-overview.component.html b/client/src/app/videos/video-list/video-overview.component.html
index f59de584a..5fe1f5c80 100644
--- a/client/src/app/videos/video-list/video-overview.component.html
+++ b/client/src/app/videos/video-list/video-overview.component.html
@@ -7,7 +7,8 @@
7 <a routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a> 7 <a routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a>
8 </div> 8 </div>
9 9
10 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user" [displayVideoActions]="false"></my-video-miniature> 10 <my-video-miniature *ngFor="let video of buildVideos(object.videos)" [video]="video" [user]="user" [displayVideoActions]="false">
11 </my-video-miniature>
11 </div> 12 </div>
12 13
13 <div class="section" *ngFor="let object of overview.tags"> 14 <div class="section" *ngFor="let object of overview.tags">
@@ -15,7 +16,8 @@
15 <a routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a> 16 <a routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a>
16 </div> 17 </div>
17 18
18 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user" [displayVideoActions]="false"></my-video-miniature> 19 <my-video-miniature *ngFor="let video of buildVideos(object.videos)" [video]="video" [user]="user" [displayVideoActions]="false">
20 </my-video-miniature>
19 </div> 21 </div>
20 22
21 <div class="section channel" *ngFor="let object of overview.channels"> 23 <div class="section channel" *ngFor="let object of overview.channels">
@@ -27,7 +29,8 @@
27 </a> 29 </a>
28 </div> 30 </div>
29 31
30 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user" [displayVideoActions]="false"></my-video-miniature> 32 <my-video-miniature *ngFor="let video of buildVideos(object.videos)" [video]="video" [user]="user" [displayVideoActions]="false">
33 </my-video-miniature>
31 </div> 34 </div>
32 35
33</div> 36</div>
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 7ff52b259..4fee92d54 100644
--- a/client/src/app/videos/video-list/video-overview.component.ts
+++ b/client/src/app/videos/video-list/video-overview.component.ts
@@ -4,6 +4,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
4import { VideosOverview } from '@app/shared/overview/videos-overview.model' 4import { VideosOverview } from '@app/shared/overview/videos-overview.model'
5import { OverviewService } from '@app/shared/overview' 5import { OverviewService } from '@app/shared/overview'
6import { Video } from '@app/shared/video/video.model' 6import { Video } from '@app/shared/video/video.model'
7import { ScreenService } from '@app/shared/misc/screen.service'
7 8
8@Component({ 9@Component({
9 selector: 'my-video-overview', 10 selector: 'my-video-overview',
@@ -22,7 +23,8 @@ export class VideoOverviewComponent implements OnInit {
22 private i18n: I18n, 23 private i18n: I18n,
23 private notifier: Notifier, 24 private notifier: Notifier,
24 private authService: AuthService, 25 private authService: AuthService,
25 private overviewService: OverviewService 26 private overviewService: OverviewService,
27 private screenService: ScreenService
26 ) { } 28 ) { }
27 29
28 get user () { 30 get user () {
@@ -53,4 +55,10 @@ export class VideoOverviewComponent implements OnInit {
53 buildVideoChannelAvatarUrl (object: { videos: Video[] }) { 55 buildVideoChannelAvatarUrl (object: { videos: Video[] }) {
54 return object.videos[0].videoChannelAvatarUrl 56 return object.videos[0].videoChannelAvatarUrl
55 } 57 }
58
59 buildVideos (videos: Video[]) {
60 const numberOfVideos = this.screenService.getNumberOfAvailableMiniatures()
61
62 return videos.slice(0, numberOfVideos * 2)
63 }
56} 64}