client/src/app/videos/+video-edit/shared/video-edit.component.ts

   1 import { Component, Input, OnInit } from '@angular/core'
   2 import { FormGroup, ValidatorFn, Validators } from '@angular/forms'
   3 import { ActivatedRoute, Router } from '@angular/router'
   4 import { FormReactiveValidationMessages, VideoValidatorsService } from '@app/shared'
   5 import { NotificationsService } from 'angular2-notifications'
   6 import { ServerService } from '../../../core/server'
   7 import { VideoEdit } from '../../../shared/video/video-edit.model'
   8 import { map } from 'rxjs/operators'
   9 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
  10 import { I18nPrimengCalendarService } from '@app/shared/i18n/i18n-primeng-calendar'
  11
  12 @Component({
  13   selector: 'my-video-edit',
  14   styleUrls: [ './video-edit.component.scss' ],
  15   templateUrl: './video-edit.component.html'
  16 })
  17
  18 export class VideoEditComponent implements OnInit {
  19   @Input() form: FormGroup
  20   @Input() formErrors: { [ id: string ]: string } = {}
  21   @Input() validationMessages: FormReactiveValidationMessages = {}
  22   @Input() videoPrivacies = []
  23   @Input() userVideoChannels: { id: number, label: string, support: string }[] = []
  24   @Input() schedulePublicationPossible = true
  25
  26   // So that it can be accessed in the template
  27   readonly SPECIAL_SCHEDULED_PRIVACY = VideoEdit.SPECIAL_SCHEDULED_PRIVACY
  28
  29   videoCategories = []
  30   videoLicences = []
  31   videoLanguages = []
  32
  33   tagValidators: ValidatorFn[]
  34   tagValidatorsMessages: { [ name: string ]: string }
  35
  36   schedulePublicationEnabled = false
  37
  38   error: string = null
  39   calendarLocale: any = {}
  40   minScheduledDate = new Date()
  41
  42   calendarTimezone: string
  43   calendarDateFormat: string
  44
  45   constructor (
  46     private formValidatorService: FormValidatorService,
  47     private videoValidatorsService: VideoValidatorsService,
  48     private route: ActivatedRoute,
  49     private router: Router,
  50     private notificationsService: NotificationsService,
  51     private serverService: ServerService,
  52     private i18nPrimengCalendarService: I18nPrimengCalendarService
  53   ) {
  54     this.tagValidators = this.videoValidatorsService.VIDEO_TAGS.VALIDATORS
  55     this.tagValidatorsMessages = this.videoValidatorsService.VIDEO_TAGS.MESSAGES
  56
  57     this.calendarLocale = this.i18nPrimengCalendarService.getCalendarLocale()
  58     this.calendarTimezone = this.i18nPrimengCalendarService.getTimezone()
  59     this.calendarDateFormat = this.i18nPrimengCalendarService.getDateFormat()
  60   }
  61
  62   updateForm () {
  63     const defaultValues = {
  64       nsfw: 'false',
  65       commentsEnabled: 'true',
  66       waitTranscoding: 'true',
  67       tags: []
  68     }
  69     const obj = {
  70       name: this.videoValidatorsService.VIDEO_NAME,
  71       privacy: this.videoValidatorsService.VIDEO_PRIVACY,
  72       channelId: this.videoValidatorsService.VIDEO_CHANNEL,
  73       nsfw: null,
  74       commentsEnabled: null,
  75       waitTranscoding: null,
  76       category: this.videoValidatorsService.VIDEO_CATEGORY,
  77       licence: this.videoValidatorsService.VIDEO_LICENCE,
  78       language: this.videoValidatorsService.VIDEO_LANGUAGE,
  79       description: this.videoValidatorsService.VIDEO_DESCRIPTION,
  80       tags: null,
  81       thumbnailfile: null,
  82       previewfile: null,
  83       support: this.videoValidatorsService.VIDEO_SUPPORT,
  84       schedulePublicationAt: this.videoValidatorsService.VIDEO_SCHEDULE_PUBLICATION_AT
  85     }
  86
  87     this.formValidatorService.updateForm(
  88       this.form,
  89       this.formErrors,
  90       this.validationMessages,
  91       obj,
  92       defaultValues
  93     )
  94
  95     this.trackChannelChange()
  96     this.trackPrivacyChange()
  97   }
  98
  99   ngOnInit () {
 100     this.updateForm()
 101
 102     this.videoCategories = this.serverService.getVideoCategories()
 103     this.videoLicences = this.serverService.getVideoLicences()
 104     this.videoLanguages = this.serverService.getVideoLanguages()
 105
 106     setTimeout(() => this.minScheduledDate = new Date(), 1000 * 60) // Update every minute
 107   }
 108
 109   private trackPrivacyChange () {
 110     // We will update the "support" field depending on the channel
 111     this.form.controls[ 'privacy' ]
 112       .valueChanges
 113       .pipe(map(res => parseInt(res.toString(), 10)))
 114       .subscribe(
 115         newPrivacyId => {
 116           this.schedulePublicationEnabled = newPrivacyId === this.SPECIAL_SCHEDULED_PRIVACY
 117
 118           // Value changed
 119           const scheduleControl = this.form.get('schedulePublicationAt')
 120           const waitTranscodingControl = this.form.get('waitTranscoding')
 121
 122           if (this.schedulePublicationEnabled) {
 123             scheduleControl.setValidators([ Validators.required ])
 124
 125             waitTranscodingControl.disable()
 126             waitTranscodingControl.setValue(false)
 127           } else {
 128             scheduleControl.clearValidators()
 129
 130             waitTranscodingControl.enable()
 131             waitTranscodingControl.setValue(true)
 132           }
 133
 134           scheduleControl.updateValueAndValidity()
 135           waitTranscodingControl.updateValueAndValidity()
 136         }
 137       )
 138   }
 139
 140   private trackChannelChange () {
 141     // We will update the "support" field depending on the channel
 142     this.form.controls[ 'channelId' ]
 143       .valueChanges
 144       .pipe(map(res => parseInt(res.toString(), 10)))
 145       .subscribe(
 146         newChannelId => {
 147           const oldChannelId = parseInt(this.form.value[ 'channelId' ], 10)
 148           const currentSupport = this.form.value[ 'support' ]
 149
 150           // Not initialized yet
 151           if (isNaN(newChannelId)) return
 152           const newChannel = this.userVideoChannels.find(c => c.id === newChannelId)
 153           if (!newChannel) return
 154
 155           // First time we set the channel?
 156           if (isNaN(oldChannelId)) return this.updateSupportField(newChannel.support)
 157           const oldChannel = this.userVideoChannels.find(c => c.id === oldChannelId)
 158
 159           if (!newChannel || !oldChannel) {
 160             console.error('Cannot find new or old channel.')
 161             return
 162           }
 163
 164           // If the current support text is not the same than the old channel, the user updated it.
 165           // We don't want the user to lose his text, so stop here
 166           if (currentSupport && currentSupport !== oldChannel.support) return
 167
 168           // Update the support text with our new channel
 169           this.updateSupportField(newChannel.support)
 170         }
 171       )
 172   }
 173
 174   private updateSupportField (support: string) {
 175     return this.form.patchValue({ support: support || '' })
 176   }
 177 }