6 files changed, 6 insertions, 103 deletions

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 1be1084ad..99695204d 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
@@ -188,17 +188,17 @@
         <div class="row advanced-settings">
           <div class="col-md-12 col-xl-8">
             <div class="form-group">
-              <my-video-image
+              <my-image-upload
                 i18n-inputLabel inputLabel="Upload thumbnail" inputName="thumbnailfile" formControlName="thumbnailfile"
                 previewWidth="200px" previewHeight="110px"
-              ></my-video-image>
+              ></my-image-upload>
             </div>
 
             <div class="form-group">
-              <my-video-image
+              <my-image-upload
                 i18n-inputLabel inputLabel="Upload preview" inputName="previewfile" formControlName="previewfile"
                 previewWidth="360px" previewHeight="200px"
-              ></my-video-image>
+              ></my-image-upload>
             </div>
 
             <div class="form-group">
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.module.ts b/client/src/app/videos/+video-edit/shared/video-edit.module.ts
index f441d3fde..39b6daa93 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.module.ts
+++ b/client/src/app/videos/+video-edit/shared/video-edit.module.ts
@@ -2,7 +2,6 @@ import { NgModule } from '@angular/core'
 import { TagInputModule } from 'ngx-chips'
 import { SharedModule } from '../../../shared/'
 import { VideoEditComponent } from './video-edit.component'
-import { VideoImageComponent } from './video-image.component'
 import { CalendarModule } from 'primeng/components/calendar/calendar'
 import { VideoCaptionAddModalComponent } from './video-caption-add-modal.component'
 
@@ -16,7 +15,6 @@ import { VideoCaptionAddModalComponent } from './video-caption-add-modal.compone
 
   declarations: [
     VideoEditComponent,
-    VideoImageComponent,
     VideoCaptionAddModalComponent
   ],
 
diff --git a/client/src/app/videos/+video-edit/shared/video-image.component.html b/client/src/app/videos/+video-edit/shared/video-image.component.html
deleted file mode 100644
index c09c862c4..000000000
--- a/client/src/app/videos/+video-edit/shared/video-image.component.html
+++ /dev/null
@@ -1,9 +0,0 @@
-<div class="root">
-  <my-reactive-file
-    [inputName]="inputName" [inputLabel]="inputLabel" [extensions]="videoImageExtensions" [maxFileSize]="maxVideoImageSize"
-    (fileChanged)="onFileChanged($event)"
-  ></my-reactive-file>
-
-  <img *ngIf="imageSrc" [ngStyle]="{ width: previewWidth, height: previewHeight }" [src]="imageSrc" class="preview" />
-  <div *ngIf="!imageSrc" [ngStyle]="{ width: previewWidth, height: previewHeight }" class="preview no-image"></div>
-</div>
diff --git a/client/src/app/videos/+video-edit/shared/video-image.component.scss b/client/src/app/videos/+video-edit/shared/video-image.component.scss
deleted file mode 100644
index b63963bca..000000000
--- a/client/src/app/videos/+video-edit/shared/video-image.component.scss
+++ /dev/null
@@ -1,18 +0,0 @@
-@import '_variables';
-@import '_mixins';
-
-.root {
-  height: auto;
-  display: flex;
-  align-items: center;
-
-  .preview {
-    border: 2px solid grey;
-    border-radius: 4px;
-    margin-left: 50px;
-
-    &.no-image {
-      background-color: #ececec;
-    }
-  }
-}
diff --git a/client/src/app/videos/+video-edit/shared/video-image.component.ts b/client/src/app/videos/+video-edit/shared/video-image.component.ts
deleted file mode 100644
index a604cde90..000000000
--- a/client/src/app/videos/+video-edit/shared/video-image.component.ts
+++ /dev/null
@@ -1,69 +0,0 @@
-import { Component, forwardRef, Input } from '@angular/core'
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
-import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'
-import { ServerService } from '@app/core'
-
-@Component({
-  selector: 'my-video-image',
-  styleUrls: [ './video-image.component.scss' ],
-  templateUrl: './video-image.component.html',
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => VideoImageComponent),
-      multi: true
-    }
-  ]
-})
-export class VideoImageComponent implements ControlValueAccessor {
-  @Input() inputLabel: string
-  @Input() inputName: string
-  @Input() previewWidth: string
-  @Input() previewHeight: string
-
-  imageSrc: SafeResourceUrl
-
-  private file: File
-
-  constructor (
-    private sanitizer: DomSanitizer,
-    private serverService: ServerService
-  ) {}
-
-  get videoImageExtensions () {
-    return this.serverService.getConfig().video.image.extensions
-  }
-
-  get maxVideoImageSize () {
-    return this.serverService.getConfig().video.image.size.max
-  }
-
-  onFileChanged (file: File) {
-    this.file = file
-
-    this.propagateChange(this.file)
-    this.updatePreview()
-  }
-
-  propagateChange = (_: any) => { /* empty */ }
-
-  writeValue (file: any) {
-    this.file = file
-    this.updatePreview()
-  }
-
-  registerOnChange (fn: (_: any) => void) {
-    this.propagateChange = fn
-  }
-
-  registerOnTouched () {
-    // Unused
-  }
-
-  private updatePreview () {
-    if (this.file) {
-      const url = URL.createObjectURL(this.file)
-      this.imageSrc = this.sanitizer.bypassSecurityTrustResourceUrl(url)
-    }
-  }
-}
diff --git a/client/src/app/videos/video-list/video-overview.component.scss b/client/src/app/videos/video-list/video-overview.component.scss
index aff45c072..42b542233 100644
--- a/client/src/app/videos/video-list/video-overview.component.scss
+++ b/client/src/app/videos/video-list/video-overview.component.scss
@@ -1,5 +1,6 @@
 @import '_variables';
 @import '_mixins';
+@import '_miniature';
 
 .section {
   padding-top: 10px;
@@ -50,4 +51,4 @@
   .section {
     @include video-miniature-small-screen;
   }
-}
\ No newline at end of file
+}