1 <ng-template #modal
let-hide=
"close">
2 <div class=
"modal-header">
3 <h4 i18n
class=
"modal-title">Share
</h4>
4 <my-global-icon iconName=
"cross" aria-label=
"Close" role=
"button" (click)=
"hide()"></my-global-icon>
8 <div class=
"modal-body">
10 <div class=
"playlist" *
ngIf=
"playlist">
11 <div class=
"title-page title-page-single" i18n *
ngIf=
"video">Share the playlist
</div>
13 <div *
ngIf=
"isPrivatePlaylist()" class=
"alert-private alert alert-warning">
14 <div i18n
>This playlist is private so you won't be able to share it with external users
</div>
16 <a i18n
class=
"peertube-button-link orange-button" [routerLink]=
"[ '/my-library/video-playlists/update', playlist.uuid ]" target=
"_blank" rel=
"noopener noreferrer">
17 Update playlist privacy
21 <div ngbNav #
nav=
"ngbNav" class=
"nav-tabs" [(activeId)]=
"activePlaylistId">
23 <ng-container ngbNavItem=
"url">
24 <a ngbNavLink i18n
>URL
</a>
26 <ng-template ngbNavContent
>
27 <div class=
"nav-content">
29 <my-input-toggle-hidden [value]=
"getPlaylistUrl()" [withToggle]=
"false" [withCopy]=
"true" [show]=
"true" [readonly]=
"true"></my-input-toggle-hidden>
34 <ng-container ngbNavItem=
"qrcode">
35 <a ngbNavLink i18n
>QR-Code
</a>
37 <ng-template ngbNavContent
>
38 <div class=
"nav-content">
39 <qrcode [qrdata]=
"getPlaylistUrl()" [width]=
"256" level=
"Q"></qrcode>
44 <ng-container ngbNavItem=
"embed">
45 <a ngbNavLink i18n
>Embed
</a>
47 <ng-template ngbNavContent
>
48 <div class=
"nav-content">
49 <my-input-toggle-hidden
50 [value]=
"getPlaylistIframeCode()" (change)=
"updateEmbedCode()"
51 [withToggle]=
"false" [withCopy]=
"true" [show]=
"true" [readonly]=
"true"
52 ></my-input-toggle-hidden>
54 <div i18n *
ngIf=
"notSecure()" class=
"alert alert-warning">
55 The url is not secured (no HTTPS), so the embed video won't work on HTTPS websites (web browsers block non secured HTTP requests on HTTPS websites).
58 <div [innerHTML]=
"playlistEmbedHTML"></div>
65 <div [ngbNavOutlet]=
"nav"></div>
69 <div class=
"form-group" *
ngIf=
"video">
70 <my-peertube-checkbox inputName=
"includeVideoInPlaylist" [(ngModel)]=
"includeVideoInPlaylist" i18n-labelText
71 labelText=
"Share the playlist at this video position"></my-peertube-checkbox>
78 <div class=
"video" *
ngIf=
"video">
79 <div class=
"title-page title-page-single" *
ngIf=
"playlist" i18n
>Share the video
</div>
81 <div *
ngIf=
"isPrivateVideo()" class=
"alert-private alert alert-warning">
82 <div i18n
>This video is private so you won't be able to share it with external users
</div>
84 <a i18n
class=
"peertube-button-link orange-button" [routerLink]=
"[ '/videos/', 'update', video.shortUUID ]" target=
"_blank" rel=
"noopener noreferrer">
89 <div ngbNav #
nav=
"ngbNav" class=
"nav-tabs" [(activeId)]=
"activeVideoId">
91 <ng-container ngbNavItem=
"url">
92 <a ngbNavLink i18n
>URL
</a>
94 <ng-template ngbNavContent
>
95 <div class=
"nav-content">
96 <my-input-toggle-hidden [value]=
"getVideoUrl()" [withToggle]=
"false" [withCopy]=
"true" [show]=
"true" [readonly]=
"true"></my-input-toggle-hidden>
101 <ng-container ngbNavItem=
"qrcode">
102 <a ngbNavLink i18n
>QR-Code
</a>
104 <ng-template ngbNavContent
>
105 <div class=
"nav-content">
106 <qrcode [qrdata]=
"getVideoUrl()" [width]=
"256" level=
"Q"></qrcode>
111 <ng-container ngbNavItem=
"embed">
112 <a ngbNavLink i18n
>Embed
</a>
114 <ng-template ngbNavContent
>
115 <div class=
"nav-content">
116 <my-input-toggle-hidden
117 [value]=
"getVideoIframeCode()" (ngModelChange)=
"updateEmbedCode()"
118 [withToggle]=
"false" [withCopy]=
"true" [show]=
"true" [readonly]=
"true"
119 ></my-input-toggle-hidden>
121 <div i18n *
ngIf=
"notSecure()" class=
"alert alert-warning">
122 The url is not secured (no HTTPS), so the embed video won't work on HTTPS websites (web browsers block non secured HTTP requests on HTTPS websites).
125 <div [innerHTML]=
"videoEmbedHTML"></div>
132 <div [ngbNavOutlet]=
"nav"></div>
134 <div class=
"filters">
136 <div class=
"form-group start-at" *
ngIf=
"!video.isLive">
137 <my-peertube-checkbox
138 inputName=
"startAt" [(ngModel)]=
"customizations.startAtCheckbox"
139 i18n-labelText
labelText=
"Start at"
140 ></my-peertube-checkbox>
143 [timestamp]=
"customizations.startAt"
144 [maxTimestamp]=
"video.duration"
145 [disabled]=
"!customizations.startAtCheckbox"
146 [(ngModel)]=
"customizations.startAt"
148 </my-timestamp-input>
151 <div *
ngIf=
"videoCaptions.length !== 0" class=
"form-group video-caption-block">
152 <my-peertube-checkbox
153 inputName=
"subtitleCheckbox" [(ngModel)]=
"customizations.subtitleCheckbox"
154 i18n-labelText
labelText=
"Auto select subtitle"
155 ></my-peertube-checkbox>
157 <div class=
"peertube-select-container" [ngClass]=
"{ disabled: !customizations.subtitleCheckbox }">
158 <select [(ngModel)]=
"customizations.subtitle" [disabled]=
"!customizations.subtitleCheckbox" class=
"form-control">
159 <option *
ngFor=
"let caption of videoCaptions" [value]=
"caption.language.id">{{ caption.language.label }}
</option>
165 <div class=
"advanced-filters collapse-transition" [ngbCollapse]=
"isAdvancedCustomizationCollapsed">
167 <div class=
"form-group stop-at" *
ngIf=
"!video.isLive">
168 <my-peertube-checkbox
169 inputName=
"stopAt" [(ngModel)]=
"customizations.stopAtCheckbox"
170 i18n-labelText
labelText=
"Stop at"
171 ></my-peertube-checkbox>
174 [timestamp]=
"customizations.stopAt"
175 [maxTimestamp]=
"video.duration"
176 [disabled]=
"!customizations.stopAtCheckbox"
177 [(ngModel)]=
"customizations.stopAt"
179 </my-timestamp-input>
182 <div class=
"form-group">
183 <my-peertube-checkbox
184 inputName=
"autoplay" [(ngModel)]=
"customizations.autoplay"
185 i18n-labelText
labelText=
"Autoplay"
186 ></my-peertube-checkbox>
189 <div class=
"form-group">
190 <my-peertube-checkbox
191 inputName=
"muted" [(ngModel)]=
"customizations.muted"
192 i18n-labelText
labelText=
"Muted"
193 ></my-peertube-checkbox>
196 <div class=
"form-group" *
ngIf=
"!video.isLive">
197 <my-peertube-checkbox
198 inputName=
"loop" [(ngModel)]=
"customizations.loop"
199 i18n-labelText
labelText=
"Loop"
200 ></my-peertube-checkbox>
203 <div *
ngIf=
"!isLocalVideo() && !isVideoInEmbedTab()" class=
"form-group">
204 <my-peertube-checkbox
205 inputName=
"originUrl" [(ngModel)]=
"customizations.originUrl"
206 i18n-labelText
labelText=
"Use origin instance URL"
207 ></my-peertube-checkbox>
211 <ng-container *
ngIf=
"isVideoInEmbedTab()">
212 <div class=
"form-group">
213 <my-peertube-checkbox
214 inputName=
"title" [(ngModel)]=
"customizations.title"
215 i18n-labelText
labelText=
"Display video title"
216 ></my-peertube-checkbox>
219 <div class=
"form-group">
220 <my-peertube-checkbox
221 inputName=
"embedP2P" [(ngModel)]=
"customizations.embedP2P"
222 i18n-labelText
labelText=
"P2P"
223 ></my-peertube-checkbox>
226 <div class=
"form-group">
227 <my-peertube-checkbox
228 inputName=
"warningTitle" [(ngModel)]=
"customizations.warningTitle"
229 i18n-labelText
labelText=
"Display privacy warning" [disabled]=
"!customizations.embedP2P"
230 ></my-peertube-checkbox>
233 <div class=
"form-group">
234 <my-peertube-checkbox
235 inputName=
"controls" [(ngModel)]=
"customizations.controls"
236 i18n-labelText
labelText=
"Display player controls"
237 ></my-peertube-checkbox>
240 <div class=
"form-group">
241 <my-peertube-checkbox
242 inputName=
"peertubeLink" [(ngModel)]=
"customizations.peertubeLink"
243 i18n-labelText
labelText=
"Display PeerTube button link"
244 ></my-peertube-checkbox>
249 <div (click)=
"isAdvancedCustomizationCollapsed = !isAdvancedCustomizationCollapsed" role=
"button" class=
"advanced-filters-button"
250 [attr.aria-expanded]=
"!isAdvancedCustomizationCollapsed" aria-controls=
"collapseBasic">
252 <ng-container *
ngIf=
"isAdvancedCustomizationCollapsed">
253 <span class=
"glyphicon glyphicon-menu-down"></span>
260 <ng-container *
ngIf=
"!isAdvancedCustomizationCollapsed">
261 <span class=
"glyphicon glyphicon-menu-up"></span>