X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-edit%2Fvideo-update.component.ts;h=d22ee540a86bbadd704862a40a96f8d87b2b7189;hb=f8b2c1b4f509c037b9650cca2c5befd21f056df3;hp=b1d80bcaa10e31c69403483bc5b405191a95c290;hpb=db400f447a9f7aae1c56fa25396e93069744483f;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/videos/+video-edit/video-update.component.ts b/client/src/app/videos/+video-edit/video-update.component.ts index b1d80bcaa..d22ee540a 100644 --- a/client/src/app/videos/+video-edit/video-update.component.ts +++ b/client/src/app/videos/+video-edit/video-update.component.ts @@ -1,17 +1,18 @@ import { map, switchMap } from 'rxjs/operators' import { Component, OnInit } from '@angular/core' -import { FormBuilder, FormGroup } from '@angular/forms' import { ActivatedRoute, Router } from '@angular/router' import { LoadingBarService } from '@ngx-loading-bar/core' -import { NotificationsService } from 'angular2-notifications' -import { VideoPrivacy } from '../../../../../shared/models/videos' +import { Notifier } from '@app/core' +import { VideoConstant, VideoPrivacy } from '../../../../../shared/models/videos' import { ServerService } from '../../core' -import { AuthService } from '../../core/auth' import { FormReactive } from '../../shared' -import { ValidatorMessage } from '../../shared/forms/form-validators/validator-message' import { VideoEdit } from '../../shared/video/video-edit.model' import { VideoService } from '../../shared/video/video.service' -import { populateAsyncUserVideoChannels } from '@app/shared/misc/utils' +import { I18n } from '@ngx-translate/i18n-polyfill' +import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' +import { VideoCaptionService } from '@app/shared/video-caption' +import { VideoCaptionEdit } from '@app/shared/video-caption/video-caption-edit.model' +import { VideoDetails } from '@app/shared/video/video-details.model' @Component({ selector: 'my-videos-update', @@ -22,70 +23,74 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { video: VideoEdit isUpdatingVideo = false - form: FormGroup - formErrors: { [ id: string ]: string } = {} - validationMessages: ValidatorMessage = {} - videoPrivacies = [] - userVideoChannels = [] + videoPrivacies: VideoConstant[] = [] + userVideoChannels: { id: number, label: string, support: string }[] = [] + schedulePublicationPossible = false + videoCaptions: VideoCaptionEdit[] = [] + waitTranscodingEnabled = true + + private updateDone = false constructor ( - private formBuilder: FormBuilder, + protected formValidatorService: FormValidatorService, private route: ActivatedRoute, private router: Router, - private notificationsService: NotificationsService, + private notifier: Notifier, private serverService: ServerService, private videoService: VideoService, - private authService: AuthService, - private loadingBar: LoadingBarService + private loadingBar: LoadingBarService, + private videoCaptionService: VideoCaptionService, + private i18n: I18n ) { super() } - buildForm () { - this.form = this.formBuilder.group({}) - this.form.valueChanges.subscribe(data => this.onValueChanged(data)) - } - ngOnInit () { - this.buildForm() + this.buildForm({}) this.serverService.videoPrivaciesLoaded - .subscribe(() => this.videoPrivacies = this.serverService.getVideoPrivacies()) + .subscribe(() => this.videoPrivacies = this.serverService.getVideoPrivacies()) + + this.route.data + .pipe(map(data => data.videoData)) + .subscribe(({ video, videoChannels, videoCaptions }) => { + this.video = new VideoEdit(video) + this.userVideoChannels = videoChannels + this.videoCaptions = videoCaptions + + // We cannot set private a video that was not private + if (this.video.privacy !== VideoPrivacy.PRIVATE) { + this.videoPrivacies = this.videoPrivacies.filter(p => p.id !== VideoPrivacy.PRIVATE) + } else { // We can schedule video publication only if it it is private + this.schedulePublicationPossible = this.video.privacy === VideoPrivacy.PRIVATE + } - const uuid: string = this.route.snapshot.params[ 'uuid' ] - this.videoService.getVideo(uuid) - .pipe( - switchMap(video => { - return this.videoService - .loadCompleteDescription(video.descriptionPath) - .pipe(map(description => Object.assign(video, { description }))) - }) - ) - .subscribe( - video => { - this.video = new VideoEdit(video) + this.videoPrivacies = this.videoService.explainedPrivacyLabels(this.videoPrivacies) - populateAsyncUserVideoChannels(this.authService, this.userVideoChannels) - .catch(err => console.error(err)) + const videoFiles = (video as VideoDetails).files + if (videoFiles.length > 1) { // Already transcoded + this.waitTranscodingEnabled = false + } - // We cannot set private a video that was not private - if (video.privacy.id !== VideoPrivacy.PRIVATE) { - const newVideoPrivacies = [] - for (const p of this.videoPrivacies) { - if (p.id !== VideoPrivacy.PRIVATE) newVideoPrivacies.push(p) - } + // FIXME: Angular does not detect the change inside this subscription, so use the patched setTimeout + setTimeout(() => this.hydrateFormFromVideo()) + }, - this.videoPrivacies = newVideoPrivacies - } + err => { + console.error(err) + this.notifier.error(err.message) + } + ) + } - this.hydrateFormFromVideo() - }, + canDeactivate () { + if (this.updateDone === true) return { canDeactivate: true } - err => { - console.error(err) - this.notificationsService.error('Error', err.message) - } - ) + for (const caption of this.videoCaptions) { + if (caption.action) return { canDeactivate: false } + } + + return { canDeactivate: this.formChanged === false } } checkForm () { @@ -95,7 +100,8 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { } update () { - if (this.checkForm() === false) { + if (this.checkForm() === false + || this.isUpdatingVideo === true) { return } @@ -103,26 +109,33 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { this.loadingBar.start() this.isUpdatingVideo = true + + // Update the video this.videoService.updateVideo(this.video) - .subscribe( - () => { - this.isUpdatingVideo = false - this.loadingBar.complete() - this.notificationsService.success('Success', 'Video updated.') - this.router.navigate([ '/videos/watch', this.video.uuid ]) - }, - - err => { - this.isUpdatingVideo = false - this.notificationsService.error('Error', err.message) - console.error(err) - } - ) + .pipe( + // Then update captions + switchMap(() => this.videoCaptionService.updateCaptions(this.video.id, this.videoCaptions)) + ) + .subscribe( + () => { + this.updateDone = true + this.isUpdatingVideo = false + this.loadingBar.complete() + this.notifier.success(this.i18n('Video updated.')) + this.router.navigate([ '/videos/watch', this.video.uuid ]) + }, + err => { + this.loadingBar.complete() + this.isUpdatingVideo = false + this.notifier.error(err.message) + console.error(err) + } + ) } private hydrateFormFromVideo () { - this.form.patchValue(this.video.toJSON()) + this.form.patchValue(this.video.toFormPatch()) const objects = [ {