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