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

   1 import { of } from 'rxjs'
   2 import { switchMap } from 'rxjs/operators'
   3 import { SelectChannelItem } from 'src/types/select-options-item.model'
   4 import { Component, HostListener, OnInit } from '@angular/core'
   5 import { ActivatedRoute, Router } from '@angular/router'
   6 import { Notifier } from '@app/core'
   7 import { FormReactive, FormReactiveService } from '@app/shared/shared-forms'
   8 import { Video, VideoCaptionEdit, VideoCaptionService, VideoDetails, VideoEdit, VideoService } from '@app/shared/shared-main'
   9 import { LiveVideoService } from '@app/shared/shared-video-live'
  10 import { LoadingBarService } from '@ngx-loading-bar/core'
  11 import { logger } from '@root-helpers/logger'
  12 import { LiveVideo, LiveVideoUpdate, VideoPrivacy } from '@shared/models'
  13 import { VideoSource } from '@shared/models/videos/video-source'
  14 import { hydrateFormFromVideo } from './shared/video-edit-utils'
  15
  16 @Component({
  17   selector: 'my-videos-update',
  18   styleUrls: [ './shared/video-edit.component.scss' ],
  19   templateUrl: './video-update.component.html'
  20 })
  21 export class VideoUpdateComponent extends FormReactive implements OnInit {
  22   videoEdit: VideoEdit
  23   videoDetails: VideoDetails
  24   videoSource: VideoSource
  25   userVideoChannels: SelectChannelItem[] = []
  26   videoCaptions: VideoCaptionEdit[] = []
  27   liveVideo: LiveVideo
  28
  29   isUpdatingVideo = false
  30   forbidScheduledPublication = false
  31
  32   private updateDone = false
  33
  34   constructor (
  35     protected formReactiveService: FormReactiveService,
  36     private route: ActivatedRoute,
  37     private router: Router,
  38     private notifier: Notifier,
  39     private videoService: VideoService,
  40     private loadingBar: LoadingBarService,
  41     private videoCaptionService: VideoCaptionService,
  42     private liveVideoService: LiveVideoService
  43   ) {
  44     super()
  45   }
  46
  47   ngOnInit () {
  48     this.buildForm({})
  49
  50     const { videoData } = this.route.snapshot.data
  51     const { video, videoChannels, videoCaptions, videoSource, liveVideo } = videoData
  52
  53     this.videoDetails = video
  54     this.videoEdit = new VideoEdit(this.videoDetails)
  55
  56     this.userVideoChannels = videoChannels
  57     this.videoCaptions = videoCaptions
  58     this.videoSource = videoSource
  59     this.liveVideo = liveVideo
  60
  61     this.forbidScheduledPublication = this.videoEdit.privacy !== VideoPrivacy.PRIVATE
  62   }
  63
  64   onFormBuilt () {
  65     hydrateFormFromVideo(this.form, this.videoEdit, true)
  66
  67     if (this.liveVideo) {
  68       this.form.patchValue({
  69         saveReplay: this.liveVideo.saveReplay,
  70         replayPrivacy: this.liveVideo.replaySettings ? this.liveVideo.replaySettings.privacy : VideoPrivacy.PRIVATE,
  71         latencyMode: this.liveVideo.latencyMode,
  72         permanentLive: this.liveVideo.permanentLive
  73       })
  74     }
  75   }
  76
  77   @HostListener('window:beforeunload', [ '$event' ])
  78   onUnload (event: any) {
  79     const { text, canDeactivate } = this.canDeactivate()
  80
  81     if (canDeactivate) return
  82
  83     event.returnValue = text
  84     return text
  85   }
  86
  87   canDeactivate (): { canDeactivate: boolean, text?: string } {
  88     if (this.updateDone === true) return { canDeactivate: true }
  89
  90     const text = $localize`You have unsaved changes! If you leave, your changes will be lost.`
  91
  92     for (const caption of this.videoCaptions) {
  93       if (caption.action) return { canDeactivate: false, text }
  94     }
  95
  96     return { canDeactivate: this.formChanged === false, text }
  97   }
  98
  99   isWaitTranscodingHidden () {
 100     if (this.videoDetails.getFiles().length > 1) { // Already transcoded
 101       return true
 102     }
 103
 104     return false
 105   }
 106
 107   async update () {
 108     await this.waitPendingCheck()
 109     this.forceCheck()
 110
 111     if (!this.form.valid || this.isUpdatingVideo === true) {
 112       return
 113     }
 114
 115     this.videoEdit.patch(this.form.value)
 116
 117     this.loadingBar.useRef().start()
 118     this.isUpdatingVideo = true
 119
 120     // Update the video
 121     this.videoService.updateVideo(this.videoEdit)
 122         .pipe(
 123           // Then update captions
 124           switchMap(() => this.videoCaptionService.updateCaptions(this.videoEdit.id, this.videoCaptions)),
 125
 126           switchMap(() => {
 127             if (!this.liveVideo) return of(undefined)
 128
 129             const liveVideoUpdate: LiveVideoUpdate = {
 130               saveReplay: !!this.form.value.saveReplay,
 131               replaySettings: { privacy: this.form.value.replayPrivacy },
 132               permanentLive: !!this.form.value.permanentLive,
 133               latencyMode: this.form.value.latencyMode
 134             }
 135
 136             // Don't update live attributes if they did not change
 137             const liveChanged = Object.keys(liveVideoUpdate)
 138               .some(key => this.liveVideo[key] !== liveVideoUpdate[key])
 139             if (!liveChanged) return of(undefined)
 140
 141             return this.liveVideoService.updateLive(this.videoEdit.id, liveVideoUpdate)
 142           })
 143         )
 144         .subscribe({
 145           next: () => {
 146             this.updateDone = true
 147             this.isUpdatingVideo = false
 148             this.loadingBar.useRef().complete()
 149             this.notifier.success($localize`Video updated.`)
 150             this.router.navigateByUrl(Video.buildWatchUrl(this.videoEdit))
 151           },
 152
 153           error: err => {
 154             this.loadingBar.useRef().complete()
 155             this.isUpdatingVideo = false
 156             this.notifier.error(err.message)
 157             logger.error(err)
 158           }
 159         })
 160   }
 161
 162   hydratePluginFieldsFromVideo () {
 163     if (!this.videoEdit.pluginData) return
 164
 165     this.form.patchValue({
 166       pluginData: this.videoEdit.pluginData
 167     })
 168   }
 169
 170   getVideoUrl () {
 171     return Video.buildWatchUrl(this.videoDetails)
 172   }
 173 }