client/src/app/videos/video-list/video-overview.component.html

   1 <h1 class="sr-only" i18n>Discover</h1>
   2 <div class="margin-content">
   3
   4   <div class="no-results" i18n *ngIf="notResults">No results.</div>
   5
   6   <div
   7     myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true" [dataObservable]="onDataSubject.asObservable()"
   8   >
   9     <ng-container *ngFor="let overview of overviews">
  10
  11       <div class="section videos" *ngFor="let object of overview.categories">
  12         <h1 class="section-title">
  13           <a routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a>
  14         </h1>
  15
  16         <div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
  17           <my-video-miniature [video]="video" [fitWidth]="true" [user]="userMiniature" [displayVideoActions]="true">
  18           </my-video-miniature>
  19         </div>
  20       </div>
  21
  22       <div class="section videos" *ngFor="let object of overview.tags">
  23         <h2 class="section-title">
  24           <a routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a>
  25         </h2>
  26
  27         <div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
  28           <my-video-miniature [video]="video" [fitWidth]="true" [user]="userMiniature" [displayVideoActions]="true">
  29           </my-video-miniature>
  30         </div>
  31       </div>
  32
  33       <div class="section channel videos" *ngFor="let object of overview.channels">
  34         <div class="section-title">
  35           <a [routerLink]="[ '/video-channels', buildVideoChannelBy(object) ]">
  36             <img [src]="buildVideoChannelAvatarUrl(object)" alt="Avatar" />
  37
  38             <h2 class="section-title">{{ object.channel.displayName }}</h2>
  39           </a>
  40         </div>
  41
  42         <div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
  43           <my-video-miniature [video]="video" [fitWidth]="true" [user]="userMiniature" [displayVideoActions]="true">
  44           </my-video-miniature>
  45         </div>
  46       </div>
  47
  48     </ng-container>
  49
  50   </div>
  51
  52 </div>