1 import { forkJoin } from 'rxjs'
2 import { map } from 'rxjs/operators'
3 import { Component, Input, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core'
4 import { FormArray, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms'
5 import { ServerService } from '@app/core'
6 import { removeElementFromArray } from '@app/helpers'
7 import { FormReactiveValidationMessages, FormValidatorService, SelectChannelItem, VideoValidatorsService } from '@app/shared/shared-forms'
8 import { InstanceService } from '@app/shared/shared-instance'
9 import { VideoCaptionEdit, VideoEdit, VideoService } from '@app/shared/shared-main'
10 import { I18n } from '@ngx-translate/i18n-polyfill'
11 import { ServerConfig, VideoConstant, VideoPrivacy } from '@shared/models'
12 import { I18nPrimengCalendarService } from './i18n-primeng-calendar.service'
13 import { VideoCaptionAddModalComponent } from './video-caption-add-modal.component'
15 type VideoLanguages = VideoConstant<string> & { group?: string }
18 selector: 'my-video-edit',
19 styleUrls: [ './video-edit.component.scss' ],
20 templateUrl: './video-edit.component.html'
22 export class VideoEditComponent implements OnInit, OnDestroy {
23 @Input() form: FormGroup
24 @Input() formErrors: { [ id: string ]: string } = {}
25 @Input() validationMessages: FormReactiveValidationMessages = {}
26 @Input() userVideoChannels: SelectChannelItem[] = []
27 @Input() schedulePublicationPossible = true
28 @Input() videoCaptions: (VideoCaptionEdit & { captionPath?: string })[] = []
29 @Input() waitTranscodingEnabled = true
31 @ViewChild('videoCaptionAddModal', { static: true }) videoCaptionAddModal: VideoCaptionAddModalComponent
33 // So that it can be accessed in the template
34 readonly SPECIAL_SCHEDULED_PRIVACY = VideoEdit.SPECIAL_SCHEDULED_PRIVACY
36 videoPrivacies: VideoConstant<VideoPrivacy>[] = []
37 videoCategories: VideoConstant<number>[] = []
38 videoLicences: VideoConstant<number>[] = []
39 videoLanguages: VideoLanguages[] = []
41 tagValidators: ValidatorFn[]
42 tagValidatorsMessages: { [ name: string ]: string }
44 schedulePublicationEnabled = false
46 calendarLocale: any = {}
47 minScheduledDate = new Date()
48 myYearRange = '1880:' + (new Date()).getFullYear()
50 calendarTimezone: string
51 calendarDateFormat: string
53 serverConfig: ServerConfig
55 private schedulerInterval: any
56 private firstPatchDone = false
57 private initialVideoCaptions: string[] = []
60 private formValidatorService: FormValidatorService,
61 private videoValidatorsService: VideoValidatorsService,
62 private videoService: VideoService,
63 private serverService: ServerService,
64 private instanceService: InstanceService,
65 private i18nPrimengCalendarService: I18nPrimengCalendarService,
67 private ngZone: NgZone
69 this.calendarLocale = this.i18nPrimengCalendarService.getCalendarLocale()
70 this.calendarTimezone = this.i18nPrimengCalendarService.getTimezone()
71 this.calendarDateFormat = this.i18nPrimengCalendarService.getDateFormat()
74 get existingCaptions () {
75 return this.videoCaptions
76 .filter(c => c.action !== 'REMOVE')
77 .map(c => c.language.id)
81 const defaultValues: any = {
83 commentsEnabled: 'true',
84 downloadEnabled: 'true',
85 waitTranscoding: 'true',
89 name: this.videoValidatorsService.VIDEO_NAME,
90 privacy: this.videoValidatorsService.VIDEO_PRIVACY,
91 channelId: this.videoValidatorsService.VIDEO_CHANNEL,
93 commentsEnabled: null,
94 downloadEnabled: null,
95 waitTranscoding: null,
96 category: this.videoValidatorsService.VIDEO_CATEGORY,
97 licence: this.videoValidatorsService.VIDEO_LICENCE,
98 language: this.videoValidatorsService.VIDEO_LANGUAGE,
99 description: this.videoValidatorsService.VIDEO_DESCRIPTION,
100 tags: this.videoValidatorsService.VIDEO_TAGS_ARRAY,
102 support: this.videoValidatorsService.VIDEO_SUPPORT,
103 schedulePublicationAt: this.videoValidatorsService.VIDEO_SCHEDULE_PUBLICATION_AT,
104 originallyPublishedAt: this.videoValidatorsService.VIDEO_ORIGINALLY_PUBLISHED_AT
107 this.formValidatorService.updateForm(
110 this.validationMessages,
115 this.form.addControl('captions', new FormArray([
117 language: new FormControl(),
118 captionfile: new FormControl()
122 this.trackChannelChange()
123 this.trackPrivacyChange()
129 this.serverService.getVideoCategories()
130 .subscribe(res => this.videoCategories = res)
131 this.serverService.getVideoLicences()
132 .subscribe(res => this.videoLicences = res)
134 this.instanceService.getAbout(),
135 this.serverService.getVideoLanguages()
136 ]).pipe(map(([ about, languages ]) => ({ about, languages })))
138 this.videoLanguages = res.languages
139 .map(l => res.about.instance.languages.includes(l.id)
140 ? { ...l, group: this.i18n('Instance languages'), groupOrder: 0 }
141 : { ...l, group: this.i18n('All languages'), groupOrder: 1 })
142 .sort((a, b) => a.groupOrder - b.groupOrder)
145 this.serverService.getVideoPrivacies()
146 .subscribe(privacies => {
147 this.videoPrivacies = this.videoService.explainedPrivacyLabels(privacies)
148 if (this.schedulePublicationPossible) {
149 this.videoPrivacies.push({
150 id: this.SPECIAL_SCHEDULED_PRIVACY,
151 label: this.i18n('Scheduled'),
152 description: this.i18n('Hide the video until a specific date')
157 this.serverConfig = this.serverService.getTmpConfig()
158 this.serverService.getConfig()
159 .subscribe(config => this.serverConfig = config)
161 this.initialVideoCaptions = this.videoCaptions.map(c => c.language.id)
163 this.ngZone.runOutsideAngular(() => {
164 this.schedulerInterval = setInterval(() => this.minScheduledDate = new Date(), 1000 * 60) // Update every minute
169 if (this.schedulerInterval) clearInterval(this.schedulerInterval)
172 onCaptionAdded (caption: VideoCaptionEdit) {
173 const existingCaption = this.videoCaptions.find(c => c.language.id === caption.language.id)
175 // Replace existing caption?
176 if (existingCaption) {
177 Object.assign(existingCaption, caption, { action: 'CREATE' as 'CREATE' })
179 this.videoCaptions.push(
180 Object.assign(caption, { action: 'CREATE' as 'CREATE' })
184 this.sortVideoCaptions()
187 async deleteCaption (caption: VideoCaptionEdit) {
188 // Caption recovers his former state
189 if (caption.action && this.initialVideoCaptions.indexOf(caption.language.id) !== -1) {
190 caption.action = undefined
194 // This caption is not on the server, just remove it from our array
195 if (caption.action === 'CREATE') {
196 removeElementFromArray(this.videoCaptions, caption)
200 caption.action = 'REMOVE' as 'REMOVE'
203 openAddCaptionModal () {
204 this.videoCaptionAddModal.show()
207 private sortVideoCaptions () {
208 this.videoCaptions.sort((v1, v2) => {
209 if (v1.language.label < v2.language.label) return -1
210 if (v1.language.label === v2.language.label) return 0
216 private trackPrivacyChange () {
217 // We will update the schedule input and the wait transcoding checkbox validators
218 this.form.controls[ 'privacy' ]
220 .pipe(map(res => parseInt(res.toString(), 10)))
224 this.schedulePublicationEnabled = newPrivacyId === this.SPECIAL_SCHEDULED_PRIVACY
227 const scheduleControl = this.form.get('schedulePublicationAt')
228 const waitTranscodingControl = this.form.get('waitTranscoding')
230 if (this.schedulePublicationEnabled) {
231 scheduleControl.setValidators([ Validators.required ])
233 waitTranscodingControl.disable()
234 waitTranscodingControl.setValue(false)
236 scheduleControl.clearValidators()
238 waitTranscodingControl.enable()
240 // Do not update the control value on first patch (values come from the server)
241 if (this.firstPatchDone === true) {
242 waitTranscodingControl.setValue(true)
246 scheduleControl.updateValueAndValidity()
247 waitTranscodingControl.updateValueAndValidity()
249 this.firstPatchDone = true
255 private trackChannelChange () {
256 // We will update the "support" field depending on the channel
257 this.form.controls[ 'channelId' ]
259 .pipe(map(res => parseInt(res.toString(), 10)))
262 const oldChannelId = parseInt(this.form.value[ 'channelId' ], 10)
264 // Not initialized yet
265 if (isNaN(newChannelId)) return
266 const newChannel = this.userVideoChannels.find(c => c.id === newChannelId)
267 if (!newChannel) return
269 // Wait support field update
271 const currentSupport = this.form.value[ 'support' ]
273 // First time we set the channel?
274 if (isNaN(oldChannelId) && !currentSupport) return this.updateSupportField(newChannel.support)
276 const oldChannel = this.userVideoChannels.find(c => c.id === oldChannelId)
277 if (!newChannel || !oldChannel) {
278 console.error('Cannot find new or old channel.')
282 // If the current support text is not the same than the old channel, the user updated it.
283 // We don't want the user to lose his text, so stop here
284 if (currentSupport && currentSupport !== oldChannel.support) return
286 // Update the support text with our new channel
287 this.updateSupportField(newChannel.support)
293 private updateSupportField (support: string) {
294 return this.form.patchValue({ support: support || '' })