1 <div class=
"video-edit" [formGroup]=
"form">
2 <div ngbNav #
nav=
"ngbNav" class=
"nav-tabs">
4 <ng-container ngbNavItem
>
5 <a ngbNavLink i18n
>Basic info
</a>
7 <ng-template ngbNavContent
>
9 <div class=
"col-video-edit">
10 <div class=
"form-group">
11 <label i18n
for=
"name">Title
</label>
12 <input type=
"text" id=
"name" class=
"form-control" formControlName=
"name" />
13 <div *
ngIf=
"formErrors.name" class=
"form-error">
18 <div class=
"form-group">
19 <label i18n
class=
"label-tags">Tags
</label>
22 <ng-template ptTemplate=
"customHtml">
24 Tags could be used to suggest relevant recommendations.
<br />
25 There is a maximum of
5 tags.
<br />
26 Press
<kbd>Enter
</kbd> to add a new tag.
31 <my-select-tags labelForId=
"label-tags" formControlName=
"tags"></my-select-tags>
32 <div *
ngIf=
"formErrors.tags" class=
"form-error">
37 <div class=
"form-group">
38 <label i18n
for=
"description">Description
</label>
40 <my-help helpType=
"markdownText">
41 <ng-template ptTemplate=
"preHtml">
43 Video descriptions are truncated by default and require manual action to expand them.
48 <my-markdown-textarea [truncate]=
"250" formControlName=
"description" [markdownVideo]=
"true"></my-markdown-textarea>
50 <div *
ngIf=
"formErrors.description" class=
"form-error">
51 {{ formErrors.description }}
56 <div class=
"col-video-edit">
57 <div class=
"form-group">
58 <label i18n
for=
"channel">Channel
</label>
59 <my-select-channel labelForId=
"channel" [items]=
"userVideoChannels" formControlName=
"channelId"></my-select-channel>
62 <div class=
"form-group">
63 <label i18n
for=
"category">Category
</label>
65 labelForId=
"category" [items]=
"videoCategories" formControlName=
"category" [clearable]=
"true"
68 <div *
ngIf=
"formErrors.category" class=
"form-error">
69 {{ formErrors.category }}
73 <div class=
"form-group">
74 <label i18n
for=
"licence">Licence
</label>
77 <ng-template ptTemplate=
"customHtml">
79 <a href=
"https://chooser-beta.creativecommons.org/" target=
"_blank" rel=
"noopener noreferrer">Choose
</a> the appropriate license for your work.
85 labelForId=
"licence" [items]=
"videoLicences" formControlName=
"licence" [clearable]=
"true"
88 <div *
ngIf=
"formErrors.licence" class=
"form-error">
89 {{ formErrors.licence }}
93 <div class=
"form-group">
94 <label i18n
for=
"language">Language
</label>
96 labelForId=
"language" [items]=
"videoLanguages" formControlName=
"language"
97 [clearable]=
"true" [searchable]=
"true" [groupBy]=
"'group'"
100 <div *
ngIf=
"formErrors.language" class=
"form-error">
101 {{ formErrors.language }}
105 <div class=
"form-group">
106 <label i18n
for=
"privacy">Privacy
</label>
108 labelForId=
"privacy" [items]=
"videoPrivacies" formControlName=
"privacy" [clearable]=
"false"
109 ></my-select-options>
111 <div *
ngIf=
"formErrors.privacy" class=
"form-error">
112 {{ formErrors.privacy }}
116 <div *
ngIf=
"schedulePublicationEnabled" class=
"form-group">
117 <label i18n
for=
"schedulePublicationAt">Schedule publication ({{ calendarTimezone }})
</label>
119 id=
"schedulePublicationAt" formControlName=
"schedulePublicationAt" [dateFormat]=
"calendarDateFormat"
120 [locale]=
"calendarLocale" [minDate]=
"minScheduledDate" [showTime]=
"true" [hideOnDateTimeSelect]=
"true"
124 <div *
ngIf=
"formErrors.schedulePublicationAt" class=
"form-error">
125 {{ formErrors.schedulePublicationAt }}
129 <my-peertube-checkbox inputName=
"nsfw" formControlName=
"nsfw" helpPlacement=
"bottom-right">
130 <ng-template ptTemplate=
"label">
131 <ng-container i18n
>Contains sensitive content
</ng-container>
134 <ng-template ptTemplate=
"help">
135 <ng-container i18n
>Some instances do not list videos containing mature or explicit content by default.
</ng-container>
137 </my-peertube-checkbox>
139 <my-peertube-checkbox *
ngIf=
"isWaitTranscodingDisplayed()" inputName=
"waitTranscoding" formControlName=
"waitTranscoding" helpPlacement=
"bottom-right">
140 <ng-template ptTemplate=
"label">
141 <ng-container i18n
>Publish after transcoding
</ng-container>
144 <ng-template ptTemplate=
"help">
145 <ng-container i18n
>If you decide not to wait for transcoding before publishing the video, it could be unplayable until transcoding ends.
</ng-container>
147 </my-peertube-checkbox>
154 <ng-container ngbNavItem *
ngIf=
"!liveVideo">
155 <a ngbNavLink i18n
>Captions
</a>
157 <ng-template ngbNavContent
>
158 <div class=
"captions">
160 <div class=
"captions-header">
161 <a (click)=
"openAddCaptionModal()" class=
"create-caption">
162 <my-global-icon iconName=
"add" aria-hidden=
"true"></my-global-icon>
163 <ng-container i18n
>Add another caption
</ng-container>
167 <div class=
"form-group" *
ngFor=
"let videoCaption of videoCaptions">
169 <div class=
"caption-entry">
170 <ng-container *
ngIf=
"!videoCaption.action">
172 i18n-title
title=
"See the subtitle file" class=
"caption-entry-label" target=
"_blank" rel=
"noopener noreferrer"
173 [href]=
"videoCaption.captionPath"
174 >{{ videoCaption.language.label }}
</a>
176 <div i18n
class=
"caption-entry-state">Already uploaded
✔</div>
178 <span i18n
class=
"caption-entry-delete" (click)=
"deleteCaption(videoCaption)">Delete
</span>
181 <ng-container *
ngIf=
"videoCaption.action === 'CREATE'">
182 <span class=
"caption-entry-label">{{ videoCaption.language.label }}
</span>
184 <div i18n
class=
"caption-entry-state caption-entry-state-create">Will be created on update
</div>
186 <span i18n
class=
"caption-entry-delete" (click)=
"deleteCaption(videoCaption)">Cancel create
</span>
189 <ng-container *
ngIf=
"videoCaption.action === 'REMOVE'">
190 <span class=
"caption-entry-label">{{ videoCaption.language.label }}
</span>
192 <div i18n
class=
"caption-entry-state caption-entry-state-delete">Will be deleted on update
</div>
194 <span i18n
class=
"caption-entry-delete" (click)=
"deleteCaption(videoCaption)">Cancel deletion
</span>
199 <div i18n
class=
"no-caption" *
ngIf=
"videoCaptions?.length === 0">
207 <ng-container ngbNavItem *
ngIf=
"liveVideo">
208 <a ngbNavLink i18n
>Live settings
</a>
210 <ng-template ngbNavContent
>
211 <div class=
"row live-settings">
212 <div class=
"col-md-12">
214 <div class=
"form-group">
215 <label for=
"liveVideoRTMPUrl" i18n
>Live RTMP Url
</label>
216 <my-input-readonly-copy id=
"liveVideoRTMPUrl" [value]=
"liveVideo.rtmpUrl"></my-input-readonly-copy>
219 <div class=
"form-group">
220 <label for=
"liveVideoStreamKey" i18n
>Live stream key
</label>
221 <my-input-readonly-copy id=
"liveVideoStreamKey" [value]=
"liveVideo.streamKey"></my-input-readonly-copy>
223 <div class=
"form-group-description" i18n
>⚠️ Never share your stream key with anyone.
</div>
226 <div class=
"form-group" *
ngIf=
"isSaveReplayEnabled()">
227 <my-peertube-checkbox inputName=
"liveVideoSaveReplay" formControlName=
"saveReplay">
228 <ng-template ptTemplate=
"label">
229 <ng-container i18n
>Automatically publish a replay when your live ends
</ng-container>
232 <ng-container ngProjectAs=
"description">
233 <span i18n
>⚠️ If you enable this option, your live will be terminated if you exceed your video quota
</span>
235 </my-peertube-checkbox>
244 <ng-container ngbNavItem
>
245 <a ngbNavLink i18n
>Advanced settings
</a>
247 <ng-template ngbNavContent
>
248 <div class=
"row advanced-settings">
249 <div class=
"col-md-12 col-xl-8">
251 <div class=
"form-group">
252 <label i18n
for=
"previewfile">Video preview
</label>
255 i18n-inputLabel
inputLabel=
"Edit" inputName=
"previewfile" formControlName=
"previewfile"
256 previewWidth=
"360px" previewHeight=
"200px"
257 ></my-preview-upload>
260 <div class=
"form-group">
261 <label i18n
for=
"support">Support
</label>
262 <my-help helpType=
"markdownEnhanced">
263 <ng-template ptTemplate=
"preHtml">
265 Short text to tell people how they can support you (membership platform...).
269 <my-markdown-textarea
270 id=
"support" formControlName=
"support" markdownType=
"enhanced"
271 [classes]=
"{ 'input-error': formErrors['support'] }"
272 ></my-markdown-textarea>
273 <div *
ngIf=
"formErrors.support" class=
"form-error">
274 {{ formErrors.support }}
279 <div class=
"col-md-12 col-xl-4">
280 <div class=
"form-group originally-published-at">
281 <label i18n
for=
"originallyPublishedAt">Original publication date
</label>
283 <ng-template ptTemplate=
"preHtml">
285 This is the date when the content was originally published (e.g. the release date for a film)
290 id=
"originallyPublishedAt" formControlName=
"originallyPublishedAt" [dateFormat]=
"calendarDateFormat"
291 [locale]=
"calendarLocale" [showTime]=
"true" [hideOnDateTimeSelect]=
"true" [monthNavigator]=
"true" [yearNavigator]=
"true" [yearRange]=
"myYearRange"
295 <div *
ngIf=
"formErrors.originallyPublishedAt" class=
"form-error">
296 {{ formErrors.originallyPublishedAt }}
300 <my-peertube-checkbox
301 inputName=
"commentsEnabled" formControlName=
"commentsEnabled"
302 i18n-labelText
labelText=
"Enable video comments"
303 ></my-peertube-checkbox>
305 <my-peertube-checkbox
306 inputName=
"downloadEnabled" formControlName=
"downloadEnabled"
307 i18n-labelText
labelText=
"Enable download"
308 ></my-peertube-checkbox>
314 <ng-container ngbNavItem *
ngIf=
"pluginFields.length !== 0">
315 <a ngbNavLink i18n
>Plugin settings
</a>
317 <ng-template ngbNavContent
>
318 <div class=
"row plugin-settings">
320 <div class=
"col-md-12 col-xl-8">
321 <div *
ngFor=
"let pluginSetting of pluginFields" class=
"form-group">
322 <my-dynamic-form-field [form]=
"pluginDataFormGroup" [formErrors]=
"formErrors" [setting]=
"pluginSetting.commonOptions"></my-dynamic-form-field>
331 <div [ngbNavOutlet]=
"nav"></div>
334 <my-video-caption-add-modal
335 #videoCaptionAddModal [existingCaptions]=
"existingCaptions" [serverConfig]=
"serverConfig" (captionAdded)=
"onCaptionAdded($event)"
336 ></my-video-caption-add-modal>