Improve video upload guard a little bit

This commit is contained in:
Chocobozzz 2018-01-25 19:01:13 +01:00
parent 94a5ff8a4a
commit f6a043df74
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
5 changed files with 41 additions and 19 deletions

View File

@ -1,10 +1,10 @@
import { Injectable } from '@angular/core'
import { CanDeactivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'
import { Observable } from 'rxjs/Observable'
import { ConfirmService } from '../core'
import { ConfirmService } from '../../core/index'
export interface CanComponentDeactivate {
canDeactivate: () => Observable<boolean> | boolean
canDeactivate: () => { text?: string, canDeactivate: Observable<boolean> | boolean }
}
@Injectable()
@ -16,9 +16,12 @@ export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate>
currentState: RouterStateSnapshot,
nextState: RouterStateSnapshot
): Observable<boolean> | boolean {
return component.canDeactivate() || this.confirmService.confirm(
'All unsaved data will be lost, are you sure you want to leave ?',
'Unsaved Data'
const result = component.canDeactivate()
const text = result.text || 'All unsaved data will be lost, are you sure you want to leave this page?'
return result.canDeactivate || this.confirmService.confirm(
text,
'Warning'
)
}

View File

@ -4,7 +4,7 @@ import { RouterModule, Routes } from '@angular/router'
import { MetaGuard } from '@ngx-meta/core'
import { LoginGuard } from '../../core'
import { CanDeactivateGuard } from '../../shared/can-deactivate-guard.service'
import { CanDeactivateGuard } from '../../shared/guards/can-deactivate-guard.service'
import { VideoAddComponent } from './video-add.component'
const videoAddRoutes: Routes = [
@ -12,7 +12,7 @@ const videoAddRoutes: Routes = [
path: '',
component: VideoAddComponent,
canActivate: [ MetaGuard, LoginGuard ],
canDeactivate: [CanDeactivateGuard]
canDeactivate: [ CanDeactivateGuard ]
}
]

View File

@ -1,10 +1,12 @@
import { HttpEventType, HttpResponse } from '@angular/common/http'
import { Component, OnInit, ViewChild } from '@angular/core'
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
import { FormBuilder, FormGroup } from '@angular/forms'
import { Router } from '@angular/router'
import { UserService } from '@app/shared'
import { CanComponentDeactivate } from '@app/shared/guards/can-deactivate-guard.service'
import { NotificationsService } from 'angular2-notifications'
import { BytesPipe } from 'ngx-pipes'
import { Subscription } from 'rxjs/Subscription'
import { VideoPrivacy } from '../../../../../shared/models/videos'
import { AuthService, ServerService } from '../../core'
import { FormReactive } from '../../shared'
@ -12,7 +14,6 @@ import { ValidatorMessage } from '../../shared/forms/form-validators/validator-m
import { populateAsyncUserVideoChannels } from '../../shared/misc/utils'
import { VideoEdit } from '../../shared/video/video-edit.model'
import { VideoService } from '../../shared/video/video.service'
import { CanComponentDeactivate } from '@app/shared/can-deactivate-guard.service'
@Component({
selector: 'my-videos-add',
@ -23,12 +24,12 @@ import { CanComponentDeactivate } from '@app/shared/can-deactivate-guard.service
]
})
export class VideoAddComponent extends FormReactive implements OnInit, CanComponentDeactivate {
export class VideoAddComponent extends FormReactive implements OnInit, OnDestroy, CanComponentDeactivate {
@ViewChild('videofileInput') videofileInput
isUploadingVideo = false
videoUploaded = false
videoUploadObservable = null
videoUploadObservable: Subscription = null
videoUploadPercents = 0
videoUploadedIds = {
id: 0,
@ -85,8 +86,26 @@ export class VideoAddComponent extends FormReactive implements OnInit, CanCompon
})
}
ngOnDestroy () {
if (this.videoUploadObservable) {
this.videoUploadObservable.unsubscribe()
}
}
canDeactivate () {
return !this.isUploadingVideo
let text = ''
if (this.videoUploaded === true) {
text = 'Your video was uploaded in your account and is private.' +
' But associated data (tags, description...) will be lost, are you sure you want to leave this page?'
} else {
text = 'Your video is not uploaded yet, are you sure you want to leave this page?'
}
return {
canDeactivate: !this.isUploadingVideo,
text
}
}
fileChange () {

View File

@ -4,7 +4,7 @@ import { SharedModule } from '../../shared'
import { VideoEditModule } from './shared/video-edit.module'
import { VideoAddRoutingModule } from './video-add-routing.module'
import { VideoAddComponent } from './video-add.component'
import { CanDeactivateGuard } from '../../shared/can-deactivate-guard.service'
import { CanDeactivateGuard } from '../../shared/guards/can-deactivate-guard.service'
@NgModule({
imports: [

View File

@ -20,11 +20,11 @@
"exclude": [
"node_modules",
"client",
"text1",
"text2",
"text3",
"text4",
"text5",
"text6"
"test1",
"test2",
"test3",
"test4",
"test5",
"test6"
]
}