3 files changed, 27 insertions, 8 deletions

diff --git a/client/src/app/videos/+video-edit/shared/video-caption-add-modal.component.ts b/client/src/app/videos/+video-edit/shared/video-caption-add-modal.component.ts
index 45b8c71f8..5498dac22 100644
--- a/client/src/app/videos/+video-edit/shared/video-caption-add-modal.component.ts
+++ b/client/src/app/videos/+video-edit/shared/video-caption-add-modal.component.ts
@@ -49,10 +49,14 @@ export class VideoCaptionAddModalComponent extends FormReactive implements OnIni
   }
 
   show () {
+    this.closingModal = false
+
     this.modal.show()
   }
 
   hide () {
+    this.closingModal = true
+
     this.modal.hide()
   }
 
@@ -65,7 +69,7 @@ export class VideoCaptionAddModalComponent extends FormReactive implements OnIni
   }
 
   async addCaption () {
-    this.closingModal = true
+    this.hide()
 
     const languageId = this.form.value[ 'language' ]
     const languageObject = this.videoCaptionLanguages.find(l => l.id === languageId)
@@ -74,7 +78,12 @@ export class VideoCaptionAddModalComponent extends FormReactive implements OnIni
       language: languageObject,
       captionfile: this.form.value['captionfile']
     })
+    //
+    // this.form.patchValue({
+    //   language: null,
+    //   captionfile: null
+    // })
 
-    this.hide()
+    this.form.reset()
   }
 }
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.html b/client/src/app/videos/+video-edit/shared/video-edit.component.html
index 14d5f3614..4675cb827 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.html
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.html
@@ -151,7 +151,7 @@
 
         <div class="form-group" *ngFor="let videoCaption of videoCaptions">
 
-          <div class="caption-entry">
+          <div *ngIf="videoCaption.action !== 'REMOVE'" class="caption-entry">
             <div class="caption-entry-label">{{ videoCaption.language.label }}</div>
 
             <span i18n class="caption-entry-delete" (click)="deleteCaption(videoCaption)">Delete</span>
@@ -200,5 +200,5 @@
 </div>
 
 <my-video-caption-add-modal
-  #videoCaptionAddModal [existingCaptions]="getExistingCaptions()" (captionAdded)="onCaptionAdded($event)"
+  #videoCaptionAddModal [existingCaptions]="existingCaptions" (captionAdded)="onCaptionAdded($event)"
 ></my-video-caption-add-modal>
\ No newline at end of file
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.ts b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
index 9394d7dab..c7beccb30 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.ts
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
@@ -68,6 +68,12 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     this.calendarDateFormat = this.i18nPrimengCalendarService.getDateFormat()
   }
 
+  get existingCaptions () {
+    return this.videoCaptions
+               .filter(c => c.action !== 'REMOVE')
+               .map(c => c.language.id)
+  }
+
   updateForm () {
     const defaultValues = {
       nsfw: 'false',
@@ -126,11 +132,15 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     if (this.schedulerInterval) clearInterval(this.schedulerInterval)
   }
 
-  getExistingCaptions () {
-    return this.videoCaptions.map(c => c.language.id)
-  }
-
   onCaptionAdded (caption: VideoCaptionEdit) {
+    const existingCaption = this.videoCaptions.find(c => c.language.id === caption.language.id)
+
+    // Replace existing caption?
+    if (existingCaption) {
+      Object.assign(existingCaption, caption, { action: 'CREATE' as 'CREATE' })
+      return
+    }
+
     this.videoCaptions.push(
       Object.assign(caption, { action: 'CREATE' as 'CREATE' })
     )