client/src/app/shared/shared-video-miniature/abstract-video-list.html

   1 <div class="margin-content">
   2   <div class="videos-header">
   3     <ng-template #videoListHeader></ng-template>
   4
   5     <div class="action-block">
   6       <my-feed *ngIf="syndicationItems" [syndicationItems]="syndicationItems"></my-feed>
   7
   8       <ng-container *ngFor="let action of actions">
   9         <a *ngIf="action.routerLink" class="ml-2" [routerLink]="action.routerLink" routerLinkActive="active">
  10           <ng-container *ngTemplateOutlet="actionContent; context:{ $implicit: action }"></ng-container>
  11         </a>
  12
  13         <a *ngIf="!action.routerLink && !action.href && action.click" class="ml-2" (click)="action.click($event)" (key.enter)="action.click($event)">
  14           <ng-container *ngTemplateOutlet="actionContent; context:{ $implicit: action }"></ng-container>
  15         </a>
  16
  17         <a *ngIf="!action.routerLink && action.href && action.click" class="ml-2" (click)="action.click($event)" (key.enter)="action.click($event)" [href]="action.href">
  18           <ng-container *ngTemplateOutlet="actionContent; context:{ $implicit: action }"></ng-container>
  19         </a>
  20
  21         <ng-template #actionContent let-action>
  22           <my-button *ngIf="!action.justIcon" [icon]="action.iconName" [label]="action.label"></my-button>
  23           <my-button *ngIf="action.justIcon" [icon]="action.iconName" [ngbTooltip]="action.label"></my-button>
  24         </ng-template>
  25       </ng-container>
  26     </div>
  27
  28     <div class="moderation-block" *ngIf="displayModerationBlock">
  29       <div class="c-hand" ngbDropdown placement="bottom-right auto">
  30         <my-global-icon iconName="cog" ngbDropdownToggle></my-global-icon>
  31
  32         <div role="menu" class="dropdown-menu" ngbDropdownMenu>
  33           <div class="dropdown-item">
  34             <my-peertube-checkbox
  35               (change)="toggleModerationDisplay()"
  36               inputName="display-unlisted-private" i18n-labelText labelText="Display all videos (private, unlisted or not yet published)"
  37             ></my-peertube-checkbox>
  38           </div>
  39         </div>
  40       </div>
  41     </div>
  42   </div>
  43
  44   <div class="no-results" i18n *ngIf="hasDoneFirstQuery && videos.length === 0">No results.</div>
  45   <div
  46     myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true" [dataObservable]="onDataSubject.asObservable()"
  47     class="videos" [ngClass]="{ 'display-as-row': displayAsRow() }"
  48   >
  49     <ng-container *ngFor="let video of videos; trackBy: videoById;">
  50       <h2 class="date-title" *ngIf="getCurrentGroupedDateLabel(video)">
  51         {{ getCurrentGroupedDateLabel(video) }}
  52       </h2>
  53
  54       <div class="video-wrapper">
  55         <my-video-miniature
  56           [video]="video" [user]="userMiniature" [displayAsRow]="displayAsRow()"
  57           [displayVideoActions]="displayVideoActions" [displayOptions]="displayOptions"
  58           (videoBlocked)="removeVideoFromArray(video)" (videoRemoved)="removeVideoFromArray(video)"
  59         >
  60         </my-video-miniature>
  61       </div>
  62     </ng-container>
  63   </div>
  64 </div>