1 <div class=
"video" [ngClass]=
"{ playing: playing }">
2 <a [routerLink]=
"buildRouterLink()" [queryParams]=
"buildRouterQuery()">
4 <my-global-icon *
ngIf=
"playing" iconName=
"play"></my-global-icon>
5 <ng-container *
ngIf=
"!playing">{{ position }}
</ng-container>
9 *
ngIf=
"playlistElement.video"
10 [video]=
"playlistElement.video" [nsfw]=
"isVideoBlur(playlistElement.video)"
11 [routerLink]=
"buildRouterLink()" [queryParams]=
"buildRouterQuery()"
12 ></my-video-thumbnail>
14 <div class=
"fake-thumbnail" *
ngIf=
"!playlistElement.video"></div>
16 <div class=
"video-info">
17 <ng-container *
ngIf=
"playlistElement.video">
18 <a tabindex=
"-1" class=
"video-info-name"
19 [routerLink]=
"buildRouterLink()" [queryParams]=
"buildRouterQuery()"
20 [attr.title]=
"playlistElement.video.name"
21 >{{ playlistElement.video.name }}
</a>
23 <a *
ngIf=
"accountLink" tabindex=
"-1" class=
"video-info-account" [routerLink]=
"[ '/accounts', playlistElement.video.byAccount ]">
24 {{ playlistElement.video.byAccount }}
26 <span *
ngIf=
"!accountLink" tabindex=
"-1" class=
"video-info-account">{{ playlistElement.video.byAccount }}
</span>
28 <span tabindex=
"-1" class=
"video-info-timestamp">{{ formatTimestamp(playlistElement) }}
</span>
31 <span *
ngIf=
"!playlistElement.video" class=
"video-info-name">
32 <ng-container i18n *
ngIf=
"isUnavailable(playlistElement)">Unavailable
</ng-container>
33 <ng-container i18n *
ngIf=
"isPrivate(playlistElement)">Private
</ng-container>
34 <ng-container i18n *
ngIf=
"isDeleted(playlistElement)">Deleted
</ng-container>
39 <div *
ngIf=
"owned" class=
"more" ngbDropdown #
moreDropdown=
"ngbDropdown" placement=
"bottom-right"
40 (openChange)=
"onDropdownOpenChange()" autoClose=
"outside"
42 <my-global-icon iconName=
"more-vertical" ngbDropdownToggle
role=
"button" class=
"icon-more" (click)=
"$event.preventDefault()"></my-global-icon>
45 <ng-container *
ngIf=
"playlistElement.video">
46 <div class=
"dropdown-item" (click)=
"toggleDisplayTimestampsOptions($event, playlistElement)">
47 <my-global-icon iconName=
"edit"></my-global-icon>
48 <ng-container i18n
>Edit starts/stops at
</ng-container>
51 <div class=
"timestamp-options" *
ngIf=
"displayTimestampOptions">
54 inputName=
"startAt" [(ngModel)]=
"timestampOptions.startTimestampEnabled"
55 i18n-labelText
labelText=
"Start at"
56 ></my-peertube-checkbox>
59 [timestamp]=
"timestampOptions.startTimestamp"
60 [maxTimestamp]=
"playlistElement.video.duration"
61 [disabled]=
"!timestampOptions.startTimestampEnabled"
62 [(ngModel)]=
"timestampOptions.startTimestamp"
63 ></my-timestamp-input>
68 inputName=
"stopAt" [(ngModel)]=
"timestampOptions.stopTimestampEnabled"
69 i18n-labelText
labelText=
"Stop at"
70 ></my-peertube-checkbox>
73 [timestamp]=
"timestampOptions.stopTimestamp"
74 [maxTimestamp]=
"playlistElement.video.duration"
75 [disabled]=
"!timestampOptions.stopTimestampEnabled"
76 [(ngModel)]=
"timestampOptions.stopTimestamp"
77 ></my-timestamp-input>
80 <input type=
"submit" i18n-value
value=
"Save" (click)=
"updateTimestamps(playlistElement)">
84 <span class=
"dropdown-item" (click)=
"removeFromPlaylist(playlistElement)">
85 <my-global-icon iconName=
"delete"></my-global-icon> <ng-container i18n
>Delete from {{ playlist?.displayName }}
</ng-container>