diff options
Diffstat (limited to 'client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.html')
-rw-r--r-- | client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.html | 57 |
1 files changed, 51 insertions, 6 deletions
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.html b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.html index 28ea7a857..e2d09a36d 100644 --- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.html +++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.html | |||
@@ -1,16 +1,61 @@ | |||
1 | <div class="no-results">No videos in this playlist.</div> | 1 | <div i18n class="no-results" *ngIf="pagination.totalItems === 0">No videos in this playlist.</div> |
2 | 2 | ||
3 | <div class="videos" myInfiniteScroller (nearOfBottom)="onNearOfBottom()"> | 3 | <div class="videos" myInfiniteScroller (nearOfBottom)="onNearOfBottom()"> |
4 | <div *ngFor="let video of videos" class="video"> | 4 | <div *ngFor="let video of videos" class="video"> |
5 | <my-video-thumbnail [video]="video"></my-video-thumbnail> | 5 | <div class="position">{{ video.playlistElement.position }}</div> |
6 | 6 | ||
7 | <div class="video-info"> | 7 | <my-video-thumbnail [video]="video" [nsfw]="isVideoBlur(video)"></my-video-thumbnail> |
8 | <div class="position">{{ video.playlistElement.position }}</div> | ||
9 | |||
10 | <a class="video-info-name" [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name">{{ video.name }}</a> | ||
11 | 8 | ||
9 | <div class="video-info"> | ||
12 | <a tabindex="-1" class="video-info-name" [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name">{{ video.name }}</a> | 10 | <a tabindex="-1" class="video-info-name" [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name">{{ video.name }}</a> |
13 | <a tabindex="-1" class="video-info-account" [routerLink]="[ '/accounts', video.byAccount ]">{{ video.byAccount }}</a> | 11 | <a tabindex="-1" class="video-info-account" [routerLink]="[ '/accounts', video.byAccount ]">{{ video.byAccount }}</a> |
12 | <span tabindex="-1" class="video-info-timestamp">{{ formatTimestamp(video)}}</span> | ||
13 | </div> | ||
14 | |||
15 | <div class="more" ngbDropdown #moreDropdown="ngbDropdown" placement="bottom-right" (openChange)="onDropdownOpenChange()" autoClose="outside"> | ||
16 | <my-global-icon iconName="more-vertical" ngbDropdownToggle role="button" class="icon-more"></my-global-icon> | ||
17 | |||
18 | <div ngbDropdownMenu> | ||
19 | <div class="dropdown-item" (click)="toggleDisplayTimestampsOptions($event, video)"> | ||
20 | <my-global-icon iconName="edit"></my-global-icon> <ng-container i18n>Edit starts/stops at</ng-container> | ||
21 | </div> | ||
22 | |||
23 | <div class="timestamp-options" *ngIf="displayTimestampOptions"> | ||
24 | <div> | ||
25 | <my-peertube-checkbox | ||
26 | inputName="startAt" [(ngModel)]="timestampOptions.startTimestampEnabled" | ||
27 | i18n-labelText labelText="Start at" | ||
28 | ></my-peertube-checkbox> | ||
29 | |||
30 | <my-timestamp-input | ||
31 | [timestamp]="timestampOptions.startTimestamp" | ||
32 | [maxTimestamp]="video.duration" | ||
33 | [disabled]="!timestampOptions.startTimestampEnabled" | ||
34 | [(ngModel)]="timestampOptions.startTimestamp" | ||
35 | ></my-timestamp-input> | ||
36 | </div> | ||
37 | |||
38 | <div> | ||
39 | <my-peertube-checkbox | ||
40 | inputName="stopAt" [(ngModel)]="timestampOptions.stopTimestampEnabled" | ||
41 | i18n-labelText labelText="Stop at" | ||
42 | ></my-peertube-checkbox> | ||
43 | |||
44 | <my-timestamp-input | ||
45 | [timestamp]="timestampOptions.stopTimestamp" | ||
46 | [maxTimestamp]="video.duration" | ||
47 | [disabled]="!timestampOptions.stopTimestampEnabled" | ||
48 | [(ngModel)]="timestampOptions.stopTimestamp" | ||
49 | ></my-timestamp-input> | ||
50 | </div> | ||
51 | |||
52 | <input type="submit" i18n-value value="Save" (click)="updateTimestamps(video)"> | ||
53 | </div> | ||
54 | |||
55 | <span class="dropdown-item" (click)="removeFromPlaylist(video)"> | ||
56 | <my-global-icon iconName="delete"></my-global-icon> <ng-container i18n>Delete from {{playlist?.displayName}}</ng-container> | ||
57 | </span> | ||
58 | </div> | ||
14 | </div> | 59 | </div> |
15 | </div> | 60 | </div> |
16 | </div> | 61 | </div> |