X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-edit%2Fvideo-update.component.ts;h=e990ceb137c460e145a6da96bba47db19fbb9dd4;hb=851f5daa1eec66e1faa3c45238ec9ab91be05b00;hp=4fe65bccd83cee34acbeed2e85256b8450afa0f5;hpb=ef4c78da4f0da61aebfa42f6e8420bf431a68bc8;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 4fe65bccd..e990ceb13 100644 --- a/client/src/app/videos/+video-edit/video-update.component.ts +++ b/client/src/app/videos/+video-edit/video-update.component.ts @@ -1,19 +1,17 @@ import { map, switchMap } from 'rxjs/operators' -import { Component, OnInit } from '@angular/core' +import { Component, HostListener, OnInit } from '@angular/core' import { ActivatedRoute, Router } from '@angular/router' import { LoadingBarService } from '@ngx-loading-bar/core' -import { NotificationsService } from 'angular2-notifications' -import { VideoConstant, VideoPrivacy } from '../../../../../shared/models/videos' +import { Notifier } from '@app/core' import { ServerService } from '../../core' -import { AuthService } from '../../core/auth' import { FormReactive } from '../../shared' import { VideoEdit } from '../../shared/video/video-edit.model' import { VideoService } from '../../shared/video/video.service' -import { VideoChannelService } from '@app/shared/video-channel/video-channel.service' 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', @@ -24,21 +22,21 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { video: VideoEdit isUpdatingVideo = false - videoPrivacies: VideoConstant[] = [] userVideoChannels: { id: number, label: string, support: string }[] = [] schedulePublicationPossible = false videoCaptions: VideoCaptionEdit[] = [] + waitTranscodingEnabled = true + + private updateDone = false constructor ( 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 videoChannelService: VideoChannelService, private videoCaptionService: VideoCaptionService, private i18n: I18n ) { @@ -48,56 +46,49 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { ngOnInit () { this.buildForm({}) - this.serverService.videoPrivaciesLoaded - .subscribe(() => this.videoPrivacies = this.serverService.getVideoPrivacies()) - - 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 }))) - }), - switchMap(video => { - return this.videoChannelService - .listAccountVideoChannels(video.account) - .pipe( - map(result => result.data), - map(videoChannels => videoChannels.map(c => ({ id: c.id, label: c.displayName, support: c.support }))), - map(videoChannels => ({ video, videoChannels })) - ) - }), - switchMap(({ video, videoChannels }) => { - return this.videoCaptionService - .listCaptions(video.id) - .pipe( - map(result => result.data), - map(videoCaptions => ({ video, videoChannels, videoCaptions })) - ) - }) - ) - .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.toString() !== VideoPrivacy.PRIVATE.toString()) - } else { // We can schedule video publication only if it it is private - this.schedulePublicationPossible = this.video.privacy === VideoPrivacy.PRIVATE - } - - this.hydrateFormFromVideo() - }, + this.route.data + .pipe(map(data => data.videoData)) + .subscribe(({ video, videoChannels, videoCaptions }) => { + this.video = new VideoEdit(video) + this.userVideoChannels = videoChannels + this.videoCaptions = videoCaptions - err => { - console.error(err) - this.notificationsService.error(this.i18n('Error'), err.message) + const videoFiles = (video as VideoDetails).files + if (videoFiles.length > 1) { // Already transcoded + this.waitTranscodingEnabled = false } - ) + + // FIXME: Angular does not detect the change inside this subscription, so use the patched setTimeout + setTimeout(() => this.hydrateFormFromVideo()) + }, + + err => { + console.error(err) + this.notifier.error(err.message) + } + ) + } + + @HostListener('window:beforeunload', [ '$event' ]) + onUnload (event: any) { + const { text, canDeactivate } = this.canDeactivate() + + if (canDeactivate) return + + event.returnValue = text + return text + } + + canDeactivate (): { canDeactivate: boolean, text?: string } { + if (this.updateDone === true) return { canDeactivate: true } + + const text = this.i18n('You have unsaved changes! If you leave, your changes will be lost.') + + for (const caption of this.videoCaptions) { + if (caption.action) return { canDeactivate: false, text } + } + + return { canDeactivate: this.formChanged === false, text } } checkForm () { @@ -107,7 +98,8 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { } update () { - if (this.checkForm() === false) { + if (this.checkForm() === false + || this.isUpdatingVideo === true) { return } @@ -124,19 +116,20 @@ export class VideoUpdateComponent extends FormReactive implements OnInit { ) .subscribe( () => { + this.updateDone = true this.isUpdatingVideo = false this.loadingBar.complete() - this.notificationsService.success(this.i18n('Success'), this.i18n('Video updated.')) + this.notifier.success(this.i18n('Video updated.')) this.router.navigate([ '/videos/watch', this.video.uuid ]) }, err => { + this.loadingBar.complete() this.isUpdatingVideo = false - this.notificationsService.error(this.i18n('Error'), err.message) + this.notifier.error(err.message) console.error(err) } ) - } private hydrateFormFromVideo () {