blob: 40c58166d20ce408d10d45fa44552b9f80ebf16d (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
<div class="video" [ngClass]="{ playing: playing }">
<a [routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()">
<div class="position">
<my-global-icon *ngIf="playing" iconName="play"></my-global-icon>
<ng-container *ngIf="!playing">{{ position }}</ng-container>
</div>
<my-video-thumbnail
*ngIf="playlistElement.video"
[video]="playlistElement.video" [nsfw]="isVideoBlur(playlistElement.video)"
[videoRouterLink]="buildRouterLink()" [queryParams]="buildRouterQuery()"
></my-video-thumbnail>
<div class="fake-thumbnail" *ngIf="!playlistElement.video"></div>
<div class="video-info">
<ng-container *ngIf="playlistElement.video">
<div class="video-info-header">
<a tabindex="-1" class="video-info-name"
[routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()"
[attr.title]="playlistElement.video.name"
>{{ playlistElement.video.name }}</a>
<span *ngIf="isVideoPrivate()" class="pt-badge badge-yellow">Private</span>
</div>
<span class="video-miniature-created-at-views">
<my-date-toggle [date]="playlistElement.video.publishedAt"></my-date-toggle>
<span class="views" [title]="playlistElement.video.getExactNumberOfViews()">
• <my-video-views-counter [video]="playlistElement.video"></my-video-views-counter>
</span>
</span>
<a *ngIf="accountLink" tabindex="-1" class="video-info-owner" [routerLink]="[ '/c', playlistElement.video.byVideoChannel ]">
<ng-container *ngIf="getVideoOwnerDisplayType(playlistElement) === 'account'">{{ playlistElement.video.byAccount }}</ng-container>
<ng-container *ngIf="getVideoOwnerDisplayType(playlistElement) === 'videoChannel'">{{ playlistElement.video.byVideoChannel }}</ng-container>
</a>
<span *ngIf="!accountLink" tabindex="-1" class="video-info-account">{{ playlistElement.video.byAccount }}</span>
<span tabindex="-1" class="video-info-timestamp">{{ formatTimestamp(playlistElement) }}</span>
</ng-container>
<span *ngIf="!playlistElement.video" class="video-info-name">
<ng-container i18n *ngIf="isUnavailable(playlistElement)">Unavailable</ng-container>
<ng-container i18n *ngIf="isPrivate(playlistElement)">Private</ng-container>
<ng-container i18n *ngIf="isDeleted(playlistElement)">Deleted</ng-container>
</span>
</div>
</a>
<my-edit-button *ngIf="owned && touchScreenEditButton" [routerLink]="[ '/my-library', 'video-playlists', playlist.uuid ]"></my-edit-button>
<div *ngIf="owned" class="more dropdown-root" ngbDropdown #moreDropdown="ngbDropdown" placement="left auto"
(openChange)="onDropdownOpenChange()" autoClose="outside" container="body"
>
<my-global-icon iconName="more-vertical" ngbDropdownToggle role="button" class="icon-more" (click)="$event.preventDefault()"></my-global-icon>
<div ngbDropdownMenu>
<ng-container *ngIf="playlistElement.video">
<div class="dropdown-item" (click)="toggleDisplayTimestampsOptions($event, playlistElement)">
<my-global-icon iconName="edit" aria-hidden="true"></my-global-icon>
<ng-container i18n>Edit starts/stops at</ng-container>
</div>
<div class="timestamp-options" *ngIf="displayTimestampOptions">
<div>
<my-peertube-checkbox
inputName="startAt" [(ngModel)]="timestampOptions.startTimestampEnabled"
i18n-labelText labelText="Start at"
></my-peertube-checkbox>
<my-timestamp-input
[timestamp]="timestampOptions.startTimestamp"
[maxTimestamp]="playlistElement.video.duration"
[disabled]="!timestampOptions.startTimestampEnabled"
[(ngModel)]="timestampOptions.startTimestamp"
></my-timestamp-input>
</div>
<div>
<my-peertube-checkbox
inputName="stopAt" [(ngModel)]="timestampOptions.stopTimestampEnabled"
i18n-labelText labelText="Stop at"
></my-peertube-checkbox>
<my-timestamp-input
[timestamp]="timestampOptions.stopTimestamp"
[maxTimestamp]="playlistElement.video.duration"
[disabled]="!timestampOptions.stopTimestampEnabled"
[(ngModel)]="timestampOptions.stopTimestamp"
></my-timestamp-input>
</div>
<input type="submit" i18n-value value="Save" (click)="updateTimestamps(playlistElement)">
</div>
</ng-container>
<span class="dropdown-item" (click)="removeFromPlaylist(playlistElement)">
<my-global-icon iconName="delete" aria-hidden="true"></my-global-icon>
<ng-container i18n>Delete from {{ playlist?.displayName }}</ng-container>
</span>
</div>
</div>
</div>
|
