Improve video upload guard a little bit

client/src/app/shared/guards/can-deactivate-guard.service.ts

@@ -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(
+    const result = component.canDeactivate()
-      'All unsaved data will be lost, are you sure you want to leave ?',
+    const text = result.text || 'All unsaved data will be lost, are you sure you want to leave this page?'
-      'Unsaved Data'
+
+    return result.canDeactivate || this.confirmService.confirm(
+      text,
+      'Warning'
     )
   }
 

client/src/app/videos/+video-edit/video-add-routing.module.ts

@@ -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 ]
   }
 ]
 

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

@@ -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 () {

client/src/app/videos/+video-edit/video-add.module.ts

@@ -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: [

tsconfig.json

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