diff options
author | Chocobozzz <me@florianbigard.com> | 2019-07-31 15:57:32 +0200 |
---|---|---|
committer | Chocobozzz <chocobozzz@cpy.re> | 2019-08-01 09:11:04 +0200 |
commit | bfbd912886eba17b4aa9a40dcef2fddc685d85bf (patch) | |
tree | 85e0f22980210a8ccd0888eb5e1790b152074677 /client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html | |
parent | 85394ba22a07bde1dfccebf3f591a5d6dbe9df56 (diff) | |
download | PeerTube-bfbd912886eba17b4aa9a40dcef2fddc685d85bf.tar.gz PeerTube-bfbd912886eba17b4aa9a40dcef2fddc685d85bf.tar.zst PeerTube-bfbd912886eba17b4aa9a40dcef2fddc685d85bf.zip |
Fix broken playlist api
Diffstat (limited to 'client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html')
-rw-r--r-- | client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html | 100 |
1 files changed, 58 insertions, 42 deletions
diff --git a/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html b/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html index ab5a78928..25d4783fb 100644 --- a/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html +++ b/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.html | |||
@@ -6,66 +6,82 @@ | |||
6 | </div> | 6 | </div> |
7 | 7 | ||
8 | <my-video-thumbnail | 8 | <my-video-thumbnail |
9 | [video]="video" [nsfw]="isVideoBlur(video)" | 9 | *ngIf="playlistElement.video" |
10 | [video]="playlistElement.video" [nsfw]="isVideoBlur(playlistElement.video)" | ||
10 | [routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()" | 11 | [routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()" |
11 | ></my-video-thumbnail> | 12 | ></my-video-thumbnail> |
12 | 13 | ||
14 | <div class="fake-thumbnail" *ngIf="!playlistElement.video"></div> | ||
15 | |||
13 | <div class="video-info"> | 16 | <div class="video-info"> |
14 | <a tabindex="-1" class="video-info-name" | 17 | <ng-container *ngIf="playlistElement.video"> |
15 | [routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()" | 18 | <a tabindex="-1" class="video-info-name" |
16 | [attr.title]="video.name" | 19 | [routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()" |
17 | >{{ video.name }}</a> | 20 | [attr.title]="playlistElement.video.name" |
21 | >{{ playlistElement.video.name }}</a> | ||
22 | |||
23 | <a *ngIf="accountLink" tabindex="-1" class="video-info-account" [routerLink]="[ '/accounts', playlistElement.video.byAccount ]"> | ||
24 | {{ playlistElement.video.byAccount }} | ||
25 | </a> | ||
26 | <span *ngIf="!accountLink" tabindex="-1" class="video-info-account">{{ playlistElement.video.byAccount }}</span> | ||
18 | 27 | ||
19 | <a *ngIf="accountLink" tabindex="-1" class="video-info-account" [routerLink]="[ '/accounts', video.byAccount ]">{{ video.byAccount }}</a> | 28 | <span tabindex="-1" class="video-info-timestamp">{{ formatTimestamp(playlistElement) }}</span> |
20 | <span *ngIf="!accountLink" tabindex="-1" class="video-info-account">{{ video.byAccount }}</span> | 29 | </ng-container> |
21 | 30 | ||
22 | <span tabindex="-1" class="video-info-timestamp">{{ formatTimestamp(video) }}</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> | ||
35 | </span> | ||
23 | </div> | 36 | </div> |
24 | </a> | 37 | </a> |
25 | 38 | ||
26 | <div *ngIf="owned" class="more" ngbDropdown #moreDropdown="ngbDropdown" placement="bottom-right" (openChange)="onDropdownOpenChange()" | 39 | <div *ngIf="owned" class="more" ngbDropdown #moreDropdown="ngbDropdown" placement="bottom-right" |
27 | autoClose="outside"> | 40 | (openChange)="onDropdownOpenChange()" autoClose="outside" |
41 | > | ||
28 | <my-global-icon iconName="more-vertical" ngbDropdownToggle role="button" class="icon-more" (click)="$event.preventDefault()"></my-global-icon> | 42 | <my-global-icon iconName="more-vertical" ngbDropdownToggle role="button" class="icon-more" (click)="$event.preventDefault()"></my-global-icon> |
29 | 43 | ||
30 | <div ngbDropdownMenu> | 44 | <div ngbDropdownMenu> |
31 | <div class="dropdown-item" (click)="toggleDisplayTimestampsOptions($event, video)"> | 45 | <ng-container *ngIf="playlistElement.video"> |
32 | <my-global-icon iconName="edit"></my-global-icon> | 46 | <div class="dropdown-item" (click)="toggleDisplayTimestampsOptions($event, playlistElement)"> |
33 | <ng-container i18n>Edit starts/stops at</ng-container> | 47 | <my-global-icon iconName="edit"></my-global-icon> |
34 | </div> | 48 | <ng-container i18n>Edit starts/stops at</ng-container> |
49 | </div> | ||
35 | 50 | ||
36 | <div class="timestamp-options" *ngIf="displayTimestampOptions"> | 51 | <div class="timestamp-options" *ngIf="displayTimestampOptions"> |
37 | <div> | 52 | <div> |
38 | <my-peertube-checkbox | 53 | <my-peertube-checkbox |
39 | inputName="startAt" [(ngModel)]="timestampOptions.startTimestampEnabled" | 54 | inputName="startAt" [(ngModel)]="timestampOptions.startTimestampEnabled" |
40 | i18n-labelText labelText="Start at" | 55 | i18n-labelText labelText="Start at" |
41 | ></my-peertube-checkbox> | 56 | ></my-peertube-checkbox> |
42 | 57 | ||
43 | <my-timestamp-input | 58 | <my-timestamp-input |
44 | [timestamp]="timestampOptions.startTimestamp" | 59 | [timestamp]="timestampOptions.startTimestamp" |
45 | [maxTimestamp]="video.duration" | 60 | [maxTimestamp]="playlistElement.video.duration" |
46 | [disabled]="!timestampOptions.startTimestampEnabled" | 61 | [disabled]="!timestampOptions.startTimestampEnabled" |
47 | [(ngModel)]="timestampOptions.startTimestamp" | 62 | [(ngModel)]="timestampOptions.startTimestamp" |
48 | ></my-timestamp-input> | 63 | ></my-timestamp-input> |
49 | </div> | 64 | </div> |
50 | 65 | ||
51 | <div> | 66 | <div> |
52 | <my-peertube-checkbox | 67 | <my-peertube-checkbox |
53 | inputName="stopAt" [(ngModel)]="timestampOptions.stopTimestampEnabled" | 68 | inputName="stopAt" [(ngModel)]="timestampOptions.stopTimestampEnabled" |
54 | i18n-labelText labelText="Stop at" | 69 | i18n-labelText labelText="Stop at" |
55 | ></my-peertube-checkbox> | 70 | ></my-peertube-checkbox> |
56 | 71 | ||
57 | <my-timestamp-input | 72 | <my-timestamp-input |
58 | [timestamp]="timestampOptions.stopTimestamp" | 73 | [timestamp]="timestampOptions.stopTimestamp" |
59 | [maxTimestamp]="video.duration" | 74 | [maxTimestamp]="playlistElement.video.duration" |
60 | [disabled]="!timestampOptions.stopTimestampEnabled" | 75 | [disabled]="!timestampOptions.stopTimestampEnabled" |
61 | [(ngModel)]="timestampOptions.stopTimestamp" | 76 | [(ngModel)]="timestampOptions.stopTimestamp" |
62 | ></my-timestamp-input> | 77 | ></my-timestamp-input> |
63 | </div> | 78 | </div> |
64 | 79 | ||
65 | <input type="submit" i18n-value value="Save" (click)="updateTimestamps(video)"> | 80 | <input type="submit" i18n-value value="Save" (click)="updateTimestamps(playlistElement)"> |
66 | </div> | 81 | </div> |
82 | </ng-container> | ||
67 | 83 | ||
68 | <span class="dropdown-item" (click)="removeFromPlaylist(video)"> | 84 | <span class="dropdown-item" (click)="removeFromPlaylist(playlistElement)"> |
69 | <my-global-icon iconName="delete"></my-global-icon> <ng-container i18n>Delete from {{ playlist?.displayName }}</ng-container> | 85 | <my-global-icon iconName="delete"></my-global-icon> <ng-container i18n>Delete from {{ playlist?.displayName }}</ng-container> |
70 | </span> | 86 | </span> |
71 | </div> | 87 | </div> |