diff options
Diffstat (limited to 'client/src/app/videos/+video-watch/video-watch.component.html')
-rw-r--r-- | client/src/app/videos/+video-watch/video-watch.component.html | 34 |
1 files changed, 33 insertions, 1 deletions
diff --git a/client/src/app/videos/+video-watch/video-watch.component.html b/client/src/app/videos/+video-watch/video-watch.component.html index 394c31f23..7f3d1cc2e 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.html +++ b/client/src/app/videos/+video-watch/video-watch.component.html | |||
@@ -1,11 +1,39 @@ | |||
1 | <div class="root-row row"> | 1 | <div class="root-row row"> |
2 | <!-- We need the video container for videojs so we just hide it --> | 2 | <!-- We need the video container for videojs so we just hide it --> |
3 | <div id="video-element-wrapper"> | 3 | <div id="video-wrapper"> |
4 | <div *ngIf="remoteServerDown" class="remote-server-down"> | 4 | <div *ngIf="remoteServerDown" class="remote-server-down"> |
5 | Sorry, but this video is not available because the remote instance is not responding. | 5 | Sorry, but this video is not available because the remote instance is not responding. |
6 | <br /> | 6 | <br /> |
7 | Please try again later. | 7 | Please try again later. |
8 | </div> | 8 | </div> |
9 | |||
10 | <div id="videojs-wrapper"></div> | ||
11 | |||
12 | <div *ngIf="playlist && video" class="playlist"> | ||
13 | <div class="playlist-info"> | ||
14 | <div class="playlist-display-name"> | ||
15 | {{ playlist.displayName }} | ||
16 | |||
17 | <span *ngIf="isUnlistedPlaylist()" class="badge badge-warning" i18n>Unlisted</span> | ||
18 | <span *ngIf="isPrivatePlaylist()" class="badge badge-danger" i18n>Private</span> | ||
19 | <span *ngIf="isPublicPlaylist()" class="badge badge-info" i18n>Public</span> | ||
20 | </div> | ||
21 | |||
22 | <div class="playlist-by-index"> | ||
23 | <div class="playlist-by">{{ playlist.ownerBy }}</div> | ||
24 | <div class="playlist-index"> | ||
25 | <span>{{currentPlaylistPosition}}</span><span>{{playlistPagination.totalItems}}</span> | ||
26 | </div> | ||
27 | </div> | ||
28 | </div> | ||
29 | |||
30 | <div *ngFor="let playlistVideo of playlistVideos" myInfiniteScroller [autoInit]="true" #elem [container]="elem" (nearOfBottom)="onPlaylistVideosNearOfBottom()"> | ||
31 | <my-video-playlist-element-miniature | ||
32 | [video]="playlistVideo" [playlist]="playlist" [owned]="isPlaylistOwned()" (elementRemoved)="onElementRemoved($event)" | ||
33 | [playing]="currentPlaylistPosition === playlistVideo.playlistElement.position" [accountLink]="false" | ||
34 | ></my-video-playlist-element-miniature> | ||
35 | </div> | ||
36 | </div> | ||
9 | </div> | 37 | </div> |
10 | 38 | ||
11 | <div i18n class="alert alert-warning" *ngIf="isVideoToImport()"> | 39 | <div i18n class="alert alert-warning" *ngIf="isVideoToImport()"> |
@@ -20,6 +48,10 @@ | |||
20 | This video will be published on {{ video.scheduledUpdate.updateAt | date: 'full' }}. | 48 | This video will be published on {{ video.scheduledUpdate.updateAt | date: 'full' }}. |
21 | </div> | 49 | </div> |
22 | 50 | ||
51 | <div i18n class="alert alert-info" *ngIf="noPlaylistVideos"> | ||
52 | This playlist does not have videos. | ||
53 | </div> | ||
54 | |||
23 | <div class="alert alert-danger" *ngIf="video?.blacklisted"> | 55 | <div class="alert alert-danger" *ngIf="video?.blacklisted"> |
24 | <div class="blacklisted-label" i18n>This video is blacklisted.</div> | 56 | <div class="blacklisted-label" i18n>This video is blacklisted.</div> |
25 | {{ video.blacklistedReason }} | 57 | {{ video.blacklistedReason }} |