blob: 6c9a8b91cb5ff459474022eb2d1e1fe1f60b34ed (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
<a *ngIf="!videoHref" [routerLink]="getVideoRouterLink()" [queryParams]="queryParams" class="video-thumbnail" tabindex="-1">
<ng-container *ngTemplateOutlet="aContent"></ng-container>
</a>
<a *ngIf="videoHref" [href]="videoHref" [target]="videoTarget" class="video-thumbnail" tabindex="-1">
<ng-container *ngTemplateOutlet="aContent"></ng-container>
</a>
<ng-template #aContent>
<img alt="" [attr.aria-label]="video.name" [attr.src]="getImageUrl()" [ngClass]="{ 'blur-filter': nsfw }" />
<div *ngIf="displayWatchLaterPlaylist" class="video-thumbnail-actions-overlay">
<ng-container *ngIf="inWatchLaterPlaylist !== true">
<button class="video-thumbnail-watch-later-overlay button-unstyle" placement="left" [ngbTooltip]="addToWatchLaterText" container="body" (click)="onWatchLaterClick($event)">
<my-global-icon iconName="clock" [attr.aria-label]="addToWatchLaterText" role="button"></my-global-icon>
</button>
</ng-container>
<ng-container *ngIf="inWatchLaterPlaylist === true">
<button class="video-thumbnail-watch-later-overlay button-unstyle" placement="left" [ngbTooltip]="addedToWatchLaterText" container="body" (click)="onWatchLaterClick($event)">
<my-global-icon iconName="tick" [attr.aria-label]="addedToWatchLaterText" role="button"></my-global-icon>
</button>
</ng-container>
</div>
<div class="video-thumbnail-label-overlay warning"><ng-content select="label-warning"></ng-content></div>
<div class="video-thumbnail-label-overlay danger"><ng-content select="label-danger"></ng-content></div>
<div class="video-thumbnail-duration-overlay" *ngIf="!video.isLive">{{ video.durationLabel }}</div>
<div class="video-thumbnail-live-overlay" [ngClass]="{ 'live-ended': isLiveEnded() }" *ngIf="video.isLive">
<ng-container i18n *ngIf="!isLiveEnded()">LIVE</ng-container>
<ng-container i18n *ngIf="isLiveEnded()">LIVE ENDED</ng-container>
</div>
<div class="play-overlay">
<div class="icon"></div>
</div>
<div class="progress-bar" *ngIf="video.userHistory?.currentTime">
<div [ngStyle]="{ 'width.%': getProgressPercent() }"></div>
</div>
</ng-template>
|
