548370843b484e0e81fd4724a3334bb91683c5f9
[oweals/peertube.git] / client / src / app / shared / video / abstract-video-list.html
1 <div class="margin-content">
2   <div class="videos-header">
3     <h1 *ngIf="titlePage" class="title-page title-page-single">
4       <div placement="bottom" [ngbTooltip]="titleTooltip" container="body">
5         {{ titlePage }}
6       </div>
7       <my-feed *ngIf="titlePage" [syndicationItems]="syndicationItems"></my-feed>
8     </h1>
9
10     <div class="action-block" *ngIf="actions.length > 0">
11       <a [routerLink]="action.routerLink" routerLinkActive="active" *ngFor="let action of actions">
12         <button class="btn">
13           <my-global-icon [iconName]="action.iconName" aria-hidden="true"></my-global-icon>
14           <span>{{ action.label }}</span>
15         </button>
16       </a>
17     </div>
18
19     <div class="moderation-block" *ngIf="displayModerationBlock">
20       <my-peertube-checkbox
21         (change)="toggleModerationDisplay()"
22         inputName="display-unlisted-private" i18n-labelText labelText="Display unlisted and private videos"
23       >
24       </my-peertube-checkbox>
25     </div>
26   </div>
27
28   <div class="no-results" i18n *ngIf="hasDoneFirstQuery && videos.length === 0">No results.</div>
29   <div
30     myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true" [dataObservable]="onDataSubject.asObservable()"
31     class="videos"
32   >
33     <ng-container *ngFor="let video of videos; trackBy: videoById;">
34       <h2 class="date-title" *ngIf="getCurrentGroupedDateLabel(video)">
35         {{ getCurrentGroupedDateLabel(video) }}
36       </h2>
37
38       <div class="video-wrapper">
39         <my-video-miniature
40           [fitWidth]="true"
41           [video]="video" [user]="user" [ownerDisplayType]="ownerDisplayType"
42           [displayVideoActions]="displayVideoActions" [displayOptions]="displayOptions"
43           (videoBlocked)="removeVideoFromArray(video)" (videoRemoved)="removeVideoFromArray(video)"
44         >
45         </my-video-miniature>
46       </div>
47     </ng-container>
48   </div>
49 </div>