2018-08-09 12:55:06 +00:00
< div class = "video-edit" [ formGroup ] = " form " >
2020-04-01 14:52:59 +00:00
< div ngbNav # nav = "ngbNav" class = "nav-tabs" >
2018-08-09 12:55:06 +00:00
2021-12-29 09:20:33 +00:00
< ng-template # pluginSettingTemplate let-pluginSetting >
< div class = "form-group" [ hidden ] = " isPluginFieldHidden ( pluginSetting ) " >
< my-dynamic-form-field [ form ] = " pluginDataFormGroup " [ formErrors ] = " formErrors [ ' pluginData ' ] " [ setting ] = " pluginSetting . commonOptions " > < / my-dynamic-form-field >
< / div >
< / ng-template >
2020-04-01 14:52:59 +00:00
< ng-container ngbNavItem >
< a ngbNavLink i18n > Basic info< / a >
< ng-template ngbNavContent >
2021-05-07 12:08:35 +00:00
< div class = "form-columns" >
2020-04-02 15:55:03 +00:00
< div class = "col-video-edit" >
2018-08-09 12:55:06 +00:00
< div class = "form-group" >
< label i18n for = "name" > Title< / label >
2020-04-02 09:39:14 +00:00
< input type = "text" id = "name" class = "form-control" formControlName = "name" / >
2018-08-09 12:55:06 +00:00
< div * ngIf = "formErrors.name" class = "form-error" >
{{ formErrors.name }}
< / div >
< / div >
< div class = "form-group" >
2018-09-04 09:01:54 +00:00
< label i18n class = "label-tags" > Tags< / label >
2019-08-27 15:09:43 +00:00
< my-help >
< ng-template ptTemplate = "customHtml" >
< ng-container i18n >
Tags could be used to suggest relevant recommendations. < br / >
2019-12-03 12:15:54 +00:00
There is a maximum of 5 tags. < br / >
2020-08-05 09:23:37 +00:00
Press < kbd > Enter< / kbd > to add a new tag.
2019-08-27 15:09:43 +00:00
< / ng-container >
< / ng-template >
< / my-help >
2020-08-04 22:50:07 +00:00
< my-select-tags labelForId = "label-tags" formControlName = "tags" > < / my-select-tags >
< div * ngIf = "formErrors.tags" class = "form-error" >
{{ formErrors.tags }}
< / div >
2018-08-09 12:55:06 +00:00
< / div >
< div class = "form-group" >
< label i18n for = "description" > Description< / label >
2019-08-27 15:09:43 +00:00
< my-help helpType = "markdownText" >
< ng-template ptTemplate = "preHtml" >
2023-03-07 10:59:31 +00:00
< ng-container i18n > Video descriptions are truncated by default and require manual action to expand them.< / ng-container >
< br / >
< ng-container i18n > A timestamp (< i > 00:05< / i > for example) is automatically converted into a link to a part of the video.< / ng-container >
2019-08-27 15:09:43 +00:00
< / ng-template >
< / my-help >
2022-06-20 13:56:16 +00:00
< my-markdown-textarea
formControlName="description" [markdownVideo]="videoToUpdate"
[formError]="formErrors.description" [truncate]="250"
>< / my-markdown-textarea >
2018-08-09 12:55:06 +00:00
< / div >
2018-02-16 15:35:32 +00:00
< / div >
2020-04-02 15:55:03 +00:00
< div class = "col-video-edit" >
2018-08-09 12:55:06 +00:00
< div class = "form-group" >
2020-08-04 22:50:07 +00:00
< label i18n for = "channel" > Channel< / label >
< my-select-channel labelForId = "channel" [ items ] = " userVideoChannels " formControlName = "channelId" > < / my-select-channel >
2018-08-09 12:55:06 +00:00
< / div >
< div class = "form-group" >
< label i18n for = "category" > Category< / label >
2020-08-04 22:50:07 +00:00
< my-select-options
labelForId="category" [items]="videoCategories" formControlName="category" [clearable]="true"
>< / my-select-options >
2018-08-09 12:55:06 +00:00
< div * ngIf = "formErrors.category" class = "form-error" >
{{ formErrors.category }}
< / div >
< / div >
< div class = "form-group" >
< label i18n for = "licence" > Licence< / label >
2020-11-15 10:57:13 +00:00
< my-help >
< ng-template ptTemplate = "customHtml" >
< ng-container i18n >
2021-05-20 10:52:51 +00:00
< a href = "https://chooser-beta.creativecommons.org/" target = "_blank" rel = "noopener noreferrer" > Choose< / a > the appropriate licence for your work.
2020-11-15 10:57:13 +00:00
< / ng-container >
< / ng-template >
< / my-help >
2020-08-04 22:50:07 +00:00
< my-select-options
labelForId="licence" [items]="videoLicences" formControlName="licence" [clearable]="true"
>< / my-select-options >
2018-08-09 12:55:06 +00:00
< div * ngIf = "formErrors.licence" class = "form-error" >
{{ formErrors.licence }}
< / div >
< / div >
< div class = "form-group" >
< label i18n for = "language" > Language< / label >
2020-08-04 22:50:07 +00:00
< my-select-options
labelForId="language" [items]="videoLanguages" formControlName="language"
[clearable]="true" [searchable]="true" [groupBy]="'group'"
>< / my-select-options >
2018-08-09 12:55:06 +00:00
< div * ngIf = "formErrors.language" class = "form-error" >
{{ formErrors.language }}
< / div >
< / div >
< div class = "form-group" >
< label i18n for = "privacy" > Privacy< / label >
2020-08-04 22:50:07 +00:00
< my-select-options
labelForId="privacy" [items]="videoPrivacies" formControlName="privacy" [clearable]="false"
>< / my-select-options >
2018-08-09 12:55:06 +00:00
< div * ngIf = "formErrors.privacy" class = "form-error" >
{{ formErrors.privacy }}
< / div >
< / div >
< div * ngIf = "schedulePublicationEnabled" class = "form-group" >
< label i18n for = "schedulePublicationAt" > Schedule publication ({{ calendarTimezone }})< / label >
< p-calendar
id="schedulePublicationAt" formControlName="schedulePublicationAt" [dateFormat]="calendarDateFormat"
2020-12-07 14:05:16 +00:00
[firstDayOfWeek]="0" [minDate]="minScheduledDate" [showTime]="true" [hideOnDateTimeSelect]="true"
2018-08-09 12:55:06 +00:00
>
< / p-calendar >
< div * ngIf = "formErrors.schedulePublicationAt" class = "form-error" >
{{ formErrors.schedulePublicationAt }}
< / div >
< / div >
2019-08-27 15:09:43 +00:00
< my-peertube-checkbox inputName = "nsfw" formControlName = "nsfw" helpPlacement = "bottom-right" >
< ng-template ptTemplate = "label" >
2020-08-04 22:50:07 +00:00
< ng-container i18n > Contains sensitive content< / ng-container >
2019-08-27 15:09:43 +00:00
< / ng-template >
< ng-template ptTemplate = "help" >
2021-04-27 14:23:32 +00:00
< ng-container i18n > Some instances hide videos containing mature or explicit content by default.< / ng-container >
2019-08-27 15:09:43 +00:00
< / ng-template >
< / my-peertube-checkbox >
2022-10-11 12:16:15 +00:00
< my-peertube-checkbox * ngIf = "!hideWaitTranscoding" inputName = "waitTranscoding" formControlName = "waitTranscoding" helpPlacement = "bottom-right" >
2019-08-27 15:09:43 +00:00
< ng-template ptTemplate = "label" >
2020-08-04 22:50:07 +00:00
< ng-container i18n > Publish after transcoding< / ng-container >
2019-08-27 15:09:43 +00:00
< / ng-template >
< ng-template ptTemplate = "help" >
2022-08-12 08:20:09 +00:00
< ng-container i18n > The video may be unplayable during the transcoding process. It's the reason why we prefer to publish publicly the video after transcoding.< / ng-container >
2019-08-27 15:09:43 +00:00
< / ng-template >
< / my-peertube-checkbox >
2018-02-16 15:35:32 +00:00
2021-12-29 09:20:33 +00:00
< ng-container
*ngFor="let pluginSetting of getPluginsFields('main')"
[ngTemplateOutlet]="pluginSettingTemplate" [ngTemplateOutletContext]="{ $implicit: pluginSetting }"
>
2021-12-22 17:02:36 +00:00
< / ng-container >
2018-02-16 15:35:32 +00:00
< / div >
< / div >
2018-08-09 12:55:06 +00:00
< / ng-template >
2020-04-01 14:52:59 +00:00
< / ng-container >
2020-10-26 15:44:23 +00:00
< ng-container ngbNavItem * ngIf = "!liveVideo" >
2020-04-01 14:52:59 +00:00
< a ngbNavLink i18n > Captions< / a >
2018-08-09 12:55:06 +00:00
2020-04-01 14:52:59 +00:00
< ng-template ngbNavContent >
2018-08-09 12:55:06 +00:00
< div class = "captions" >
< div class = "captions-header" >
< a ( click ) = " openAddCaptionModal ( ) " class = "create-caption" >
2020-06-08 17:42:51 +00:00
< my-global-icon iconName = "add" aria-hidden = "true" > < / my-global-icon >
2018-08-09 12:55:06 +00:00
< ng-container i18n > Add another caption< / ng-container >
< / a >
2018-02-16 15:35:32 +00:00
< / div >
2018-08-09 12:55:06 +00:00
< div class = "form-group" * ngFor = "let videoCaption of videoCaptions" >
2018-02-16 15:35:32 +00:00
2018-08-09 12:55:06 +00:00
< div class = "caption-entry" >
< ng-container * ngIf = "!videoCaption.action" >
< a
i18n-title title="See the subtitle file" class="caption-entry-label" target="_blank" rel="noopener noreferrer"
[href]="videoCaption.captionPath"
>{{ videoCaption.language.label }}< / a >
2018-02-16 15:35:32 +00:00
2022-07-25 08:45:22 +00:00
< div i18n class = "caption-entry-state" > Already uploaded on {{ videoCaption.updatedAt | date }} ✔ < / div >
2018-02-16 15:35:32 +00:00
2022-08-30 15:13:26 +00:00
< span i18n class = "caption-entry-edit" ( click ) = " openEditCaptionModal ( videoCaption ) " > Edit< / span >
2018-08-09 12:55:06 +00:00
< span i18n class = "caption-entry-delete" ( click ) = " deleteCaption ( videoCaption ) " > Delete< / span >
< / ng-container >
2018-02-16 15:35:32 +00:00
2018-08-09 12:55:06 +00:00
< ng-container * ngIf = "videoCaption.action === 'CREATE'" >
< span class = "caption-entry-label" > {{ videoCaption.language.label }}< / span >
2018-02-16 15:35:32 +00:00
2018-09-21 14:48:42 +00:00
< div i18n class = "caption-entry-state caption-entry-state-create" > Will be created on update< / div >
2018-02-16 15:35:32 +00:00
2018-08-09 12:55:06 +00:00
< span i18n class = "caption-entry-delete" ( click ) = " deleteCaption ( videoCaption ) " > Cancel create< / span >
< / ng-container >
2018-02-16 15:35:32 +00:00
2021-12-22 17:36:56 +00:00
< ng-container * ngIf = "videoCaption.action === 'UPDATE'" >
< span class = "caption-entry-label" > {{ videoCaption.language.label }}< / span >
< div i18n class = "caption-entry-state caption-entry-state-create" > Will be edited on update< / div >
< span i18n class = "caption-entry-delete" ( click ) = " deleteCaption ( videoCaption ) " > Cancel edition< / span >
< / ng-container >
2018-08-09 12:55:06 +00:00
< ng-container * ngIf = "videoCaption.action === 'REMOVE'" >
< span class = "caption-entry-label" > {{ videoCaption.language.label }}< / span >
2018-02-16 15:35:32 +00:00
2018-09-21 14:48:42 +00:00
< div i18n class = "caption-entry-state caption-entry-state-delete" > Will be deleted on update< / div >
2018-06-15 14:52:15 +00:00
2018-08-09 12:55:06 +00:00
< span i18n class = "caption-entry-delete" ( click ) = " deleteCaption ( videoCaption ) " > Cancel deletion< / span >
< / ng-container >
< / div >
2018-06-15 14:52:15 +00:00
< / div >
2018-09-21 14:48:42 +00:00
< div i18n class = "no-caption" * ngIf = "videoCaptions?.length === 0" >
2018-08-09 12:55:06 +00:00
No captions for now.
2018-07-12 17:02:00 +00:00
< / div >
2018-02-16 15:35:32 +00:00
< / div >
2018-08-09 12:55:06 +00:00
< / ng-template >
2020-04-01 14:52:59 +00:00
< / ng-container >
2020-09-25 08:04:21 +00:00
< ng-container ngbNavItem * ngIf = "liveVideo" >
2020-09-17 07:20:52 +00:00
< a ngbNavLink i18n > Live settings< / a >
< ng-template ngbNavContent >
< div class = "row live-settings" >
< div class = "col-md-12" >
2022-06-15 12:43:33 +00:00
< div class = "alert pt-alert-primary" >
2020-12-14 11:21:07 +00:00
< my-live-documentation-link > < / my-live-documentation-link >
< / div >
2020-09-17 07:20:52 +00:00
2021-11-05 10:36:03 +00:00
< div * ngIf = "liveVideo.rtmpUrl" class = "form-group" >
2020-09-25 08:04:21 +00:00
< label for = "liveVideoRTMPUrl" i18n > Live RTMP Url< / label >
2022-06-10 13:58:38 +00:00
< my-input-text inputId = "liveVideoRTMPUrl" [ value ] = " liveVideo . rtmpUrl " [ withToggle ] = " false " [ withCopy ] = " true " [ show ] = " true " [ readonly ] = " true " > < / my-input-text >
2020-09-17 07:20:52 +00:00
< / div >
2021-11-05 10:36:03 +00:00
< div * ngIf = "liveVideo.rtmpsUrl" class = "form-group" >
< label for = "liveVideoRTMPSUrl" i18n > Live RTMPS Url< / label >
2022-06-10 13:58:38 +00:00
< my-input-text inputId = "liveVideoRTMPSUrl" [ value ] = " liveVideo . rtmpsUrl " [ withToggle ] = " false " [ withCopy ] = " true " [ show ] = " true " [ readonly ] = " true " > < / my-input-text >
2021-11-05 10:36:03 +00:00
< / div >
2020-09-17 07:20:52 +00:00
< div class = "form-group" >
2020-09-25 08:04:21 +00:00
< label for = "liveVideoStreamKey" i18n > Live stream key< / label >
2022-06-10 13:58:38 +00:00
< my-input-text inputId = "liveVideoStreamKey" [ value ] = " liveVideo . streamKey " [ withCopy ] = " true " [ readonly ] = " true " > < / my-input-text >
2020-10-29 14:03:46 +00:00
< div class = "form-group-description" i18n > ⚠️ Never share your stream key with anyone.< / div >
2020-09-17 07:20:52 +00:00
< / div >
2020-10-26 15:44:23 +00:00
2020-12-03 13:10:54 +00:00
< div class = "form-group" >
2021-10-15 08:54:12 +00:00
< div class = "peertube-radio-container" >
< input type = "radio" formControlName = "permanentLive" id = "permanentLiveFalse" [ value ] = " false " >
< label i18n for = "permanentLiveFalse" class = "radio" > This is a normal live< / label >
< span class = "form-group-description" i18n >
2022-05-18 12:28:46 +00:00
You can stream only once in a normal live. If you enable replay, it will be saved under the same URL as your live
2021-10-15 08:54:12 +00:00
< / span >
< / div >
< div class = "peertube-radio-container" >
< input type = "radio" formControlName = "permanentLive" id = "permanentLiveTrue" [ value ] = " true " >
< label i18n for = "permanentLiveTrue" class = "radio" > This is a permanent/recurring live< / label >
2020-12-03 13:10:54 +00:00
2021-10-15 08:54:12 +00:00
< span class = "form-group-description" i18n >
2022-05-18 12:28:46 +00:00
You can stream multiple times in a permanent/recurring live. If you enable replays, they will be saved as separate videos
2021-10-15 08:54:12 +00:00
< / span >
< / div >
2020-12-03 13:10:54 +00:00
< / div >
2020-10-26 15:44:23 +00:00
< div class = "form-group" * ngIf = "isSaveReplayEnabled()" >
< my-peertube-checkbox inputName = "liveVideoSaveReplay" formControlName = "saveReplay" >
< ng-template ptTemplate = "label" >
< ng-container i18n > Automatically publish a replay when your live ends< / ng-container >
< / ng-template >
< ng-container ngProjectAs = "description" >
< span i18n > ⚠️ If you enable this option, your live will be terminated if you exceed your video quota< / span >
< / ng-container >
< / my-peertube-checkbox >
< / div >
2022-03-04 12:40:02 +00:00
< div class = "form-group" * ngIf = "isLatencyModeEnabled()" >
< label i18n for = "latencyMode" > Latency mode< / label >
< my-select-options
labelForId="latencyMode" [items]="latencyModes" formControlName="latencyMode" [clearable]="true"
>< / my-select-options >
< div * ngIf = "formErrors.latencyMode" class = "form-error" >
{{ formErrors.latencyMode }}
< / div >
< / div >
2020-09-17 07:20:52 +00:00
< / div >
< / div >
< / ng-template >
< / ng-container >
2020-04-01 14:52:59 +00:00
< ng-container ngbNavItem >
< a ngbNavLink i18n > Advanced settings< / a >
2018-08-09 12:55:06 +00:00
2020-04-01 14:52:59 +00:00
< ng-template ngbNavContent >
2019-02-11 13:33:47 +00:00
< div class = "row advanced-settings" >
< div class = "col-md-12 col-xl-8" >
2018-02-16 15:35:32 +00:00
2019-02-11 13:33:47 +00:00
< div class = "form-group" >
2022-08-12 08:15:45 +00:00
< label i18n for = "previewfile" > Video thumbnail< / label >
2019-05-17 08:45:53 +00:00
< my-preview-upload
i18n-inputLabel inputLabel="Edit" inputName="previewfile" formControlName="previewfile"
2019-02-11 13:33:47 +00:00
previewWidth="360px" previewHeight="200px"
2019-05-17 08:45:53 +00:00
>< / my-preview-upload >
2019-02-11 13:33:47 +00:00
< / div >
2018-02-20 15:13:05 +00:00
2019-02-11 13:33:47 +00:00
< div class = "form-group" >
< label i18n for = "support" > Support< / label >
2020-08-05 09:23:37 +00:00
< my-help helpType = "markdownEnhanced" >
< ng-template ptTemplate = "preHtml" >
< ng-container i18n >
Short text to tell people how they can support you (membership platform...).
< / ng-container >
< / ng-template >
< / my-help >
2022-06-20 13:56:16 +00:00
2019-02-11 13:33:47 +00:00
< my-markdown-textarea
2020-04-28 12:53:43 +00:00
id="support" formControlName="support" markdownType="enhanced"
2022-06-20 13:56:16 +00:00
[formError]="formErrors['support']"
2019-02-11 13:33:47 +00:00
>< / my-markdown-textarea >
2018-08-09 12:55:06 +00:00
< / div >
2018-02-20 15:13:05 +00:00
< / div >
2019-02-11 11:00:19 +00:00
2019-02-11 13:33:47 +00:00
< div class = "col-md-12 col-xl-4" >
2022-06-21 13:31:25 +00:00
< div * ngIf = "videoSource" class = "form-group" >
< label i18n for = "filename" > Filename< / label >
< my-help >
< ng-template ptTemplate = "preHtml" >
< ng-container i18n >
Name of the uploaded file
< / ng-container >
< / ng-template >
< / my-help >
< input type = "text" [ disabled ] = " true " id = "filename" class = "form-control" [ value ] = " videoSource . filename " / >
< / div >
2023-05-26 07:44:21 +00:00
< div class = "form-group imported-from" >
< label i18n for = "importedFrom" > Imported from< / label >
< my-help >
< ng-template ptTemplate = "preHtml" >
< ng-container i18n >
The URL where this video is imported from
< / ng-container >
< / ng-template >
< / my-help >
< input
id="importedFrom"
formControlName="importedFrom"
type="text"
class="form-control"
/>
< div * ngIf = "formErrors.importedFrom" class = "form-error" >
{{ formErrors.importedFrom }}
< / div >
< / div >
2019-02-11 13:33:47 +00:00
< div class = "form-group originally-published-at" >
< label i18n for = "originallyPublishedAt" > Original publication date< / label >
2020-08-05 09:23:37 +00:00
< my-help >
< ng-template ptTemplate = "preHtml" >
< ng-container i18n >
This is the date when the content was originally published (e.g. the release date for a film)
< / ng-container >
< / ng-template >
< / my-help >
2019-02-11 13:33:47 +00:00
< p-calendar
2020-12-07 14:05:16 +00:00
id="originallyPublishedAt" formControlName="originallyPublishedAt" [dateFormat]="calendarDateFormat" [firstDayOfWeek]="0"
[showTime]="true" [hideOnDateTimeSelect]="true" [monthNavigator]="true" [yearNavigator]="true" [yearRange]="myYearRange"
2019-02-11 13:33:47 +00:00
>
< / p-calendar >
< div * ngIf = "formErrors.originallyPublishedAt" class = "form-error" >
{{ formErrors.originallyPublishedAt }}
< / div >
< / div >
< my-peertube-checkbox
inputName="commentsEnabled" formControlName="commentsEnabled"
i18n-labelText labelText="Enable video comments"
>< / my-peertube-checkbox >
2019-02-11 11:00:19 +00:00
2019-02-11 13:33:47 +00:00
< my-peertube-checkbox
inputName="downloadEnabled" formControlName="downloadEnabled"
i18n-labelText labelText="Enable download"
>< / my-peertube-checkbox >
< / div >
2018-02-20 15:13:05 +00:00
< / div >
2018-08-09 12:55:06 +00:00
< / ng-template >
2020-04-01 14:52:59 +00:00
< / ng-container >
2017-12-07 10:15:19 +00:00
2021-12-22 17:02:36 +00:00
< ng-container ngbNavItem * ngIf = "getPluginsFields('plugin-settings').length !== 0" >
2020-08-20 14:18:16 +00:00
< a ngbNavLink i18n > Plugin settings< / a >
< ng-template ngbNavContent >
< div class = "row plugin-settings" >
< div class = "col-md-12 col-xl-8" >
2021-12-29 09:20:33 +00:00
< ng-container
*ngFor="let pluginSetting of getPluginsFields('plugin-settings')"
[ngTemplateOutlet]="pluginSettingTemplate" [ngTemplateOutletContext]="{ $implicit: pluginSetting }"
>
< / ng-container >
2020-08-20 14:18:16 +00:00
< / div >
< / div >
< / ng-template >
< / ng-container >
2020-04-01 14:52:59 +00:00
< / div >
2018-01-03 09:12:36 +00:00
2020-04-01 14:52:59 +00:00
< div [ ngbNavOutlet ] = " nav " > < / div >
2017-12-07 10:15:19 +00:00
< / div >
2018-07-12 17:02:00 +00:00
< my-video-caption-add-modal
2021-12-22 17:36:56 +00:00
#videoCaptionAddModal [existingCaptions]="getExistingCaptions()" [serverConfig]="serverConfig" (captionAdded)="onCaptionEdited($event)"
2018-09-04 09:01:54 +00:00
>< / my-video-caption-add-modal >