From d6ccf7211904a34871b071f7adbb118c0bbf7498 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?D=C3=A1niel=20P=C3=A9ter=20Sipos?= <dsipos@monguz.hu>
Date: Tue, 16 Feb 2021 15:41:39 +0100
Subject: [PATCH] #885 move size to css

---
 .../media-viewer-image.component.scss         |  2 +
 .../media-viewer-image.component.ts           |  5 ---
 .../media-viewer-video.component.html         |  1 -
 .../media-viewer-video.component.scss         |  5 ++-
 .../media-viewer-video.component.ts           |  2 -
 .../media-viewer/media-viewer.component.html  | 40 +++++++++++--------
 .../media-viewer/media-viewer.component.ts    |  4 +-
 .../publication/publication.component.html    |  2 +-
 .../untyped-item/untyped-item.component.html  |  2 +-
 src/config/media-viewer-config.interface.ts   |  2 -
 src/environments/environment.common.ts        |  2 -
 11 files changed, 33 insertions(+), 34 deletions(-)

diff --git a/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss b/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss
index bbbad9d3b2..72ce4b04d9 100644
--- a/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss
+++ b/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss
@@ -1,4 +1,6 @@
 .ngx-gallery {
   display: inline-block;
   margin-bottom: 20px;
+  width: 340px !important;
+  height: 279px !important;
 }
diff --git a/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts b/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
index 2781034a9e..0c32b5603d 100644
--- a/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
+++ b/src/app/+item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
@@ -17,8 +17,6 @@ export class MediaViewerImageComponent implements OnInit {
   @Input() images: MediaViewerItem[];
   @Input() preview?: boolean;
   @Input() image?: string;
-  @Input() width: string;
-  @Input() height: string;
 
   loggedin: boolean;
 
@@ -44,8 +42,6 @@ export class MediaViewerImageComponent implements OnInit {
         imageSize: 'contain',
         thumbnails: false,
         imageArrows: false,
-        width: this.width,
-        height: this.height,
         startIndex: 0,
         imageAnimation: NgxGalleryAnimation.Slide,
         previewCloseOnEsc: true,
@@ -54,7 +50,6 @@ export class MediaViewerImageComponent implements OnInit {
         previewFullscreen: true,
       },
     ];
-    console.log(this.galleryOptions)
 
     if (this.image) {
       this.galleryImages = [
diff --git a/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.html b/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.html
index 977e306e33..27d36c8a1b 100644
--- a/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.html
+++ b/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.html
@@ -1,6 +1,5 @@
 <video
   #media
-  [ngStyle]="{'width': width, 'height': height}"
   [src]="filteredMedias[currentIndex].bitstream._links.content.href"
   id="singleVideo"
   [poster]="
diff --git a/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss b/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss
index 8b13789179..7702da7361 100644
--- a/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss
+++ b/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss
@@ -1 +1,4 @@
-
+video {
+  width: 340px;
+  height: 279px;
+}
diff --git a/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts b/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
index 6072bb78a0..4c578a51bb 100644
--- a/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
+++ b/src/app/+item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
@@ -11,8 +11,6 @@ import { MediaViewerItem } from '../../../core/shared/media-viewer-item.model';
 })
 export class MediaViewerVideoComponent implements OnInit {
   @Input() medias: MediaViewerItem[];
-  @Input() width: string;
-  @Input() height: string;
 
   filteredMedias: MediaViewerItem[];
 
diff --git a/src/app/+item-page/media-viewer/media-viewer.component.html b/src/app/+item-page/media-viewer/media-viewer.component.html
index ec780704b5..b79b91629f 100644
--- a/src/app/+item-page/media-viewer/media-viewer.component.html
+++ b/src/app/+item-page/media-viewer/media-viewer.component.html
@@ -1,28 +1,36 @@
 <ng-container *ngVar="mediaList$ | async as mediaList">
-  <ds-loading *ngIf="isLoading" message="{{ 'loading.default' | translate }}" [showMessage]="false"></ds-loading>
+  <ds-loading
+    *ngIf="isLoading"
+    message="{{ 'loading.default' | translate }}"
+    [showMessage]="false"
+  ></ds-loading>
   <div class="media-viewer" *ngIf="!isLoading">
     <ng-container *ngIf="mediaList.length > 0">
-      <ng-container *ngIf="config.video">
-        <ng-container *ngIf="
+      <ng-container *ngIf="videoOptions">
+        <ng-container
+          *ngIf="
             mediaList[0]?.format === 'video' || mediaList[0]?.format === 'audio'
-          ">
-          <ds-media-viewer-video [medias]="mediaList" [width]="config.width" [height]="config.height">
-          </ds-media-viewer-video>
+          "
+        >
+          <ds-media-viewer-video [medias]="mediaList"></ds-media-viewer-video>
         </ng-container>
       </ng-container>
-      <ng-container *ngIf="mediaList[0]?.format === 'image'">
-        <ds-media-viewer-image [images]="mediaList" [width]="config.width" [height]="config.height">
-        </ds-media-viewer-image>
-      </ng-container>
+        <ng-container *ngIf="mediaList[0]?.format === 'image'">
+          <ds-media-viewer-image [images]="mediaList"></ds-media-viewer-image>
+        </ng-container>
     </ng-container>
-    <ng-container *ngIf="
+    <ng-container
+      *ngIf="
         ((mediaList[0]?.format !== 'image') &&
-          (!config.video || mediaList[0]?.format !== 'video') &&
-          (!config.video || mediaList[0]?.format !== 'audio')) ||
+          (!videoOptions || mediaList[0]?.format !== 'video') &&
+          (!videoOptions || mediaList[0]?.format !== 'audio')) ||
         mediaList.length === 0
-      ">
-      <ds-media-viewer-image [image]="mediaList[0]?.thumbnail || thumbnailPlaceholder" [preview]="false"
-        [width]="config.width" [height]="config.height"></ds-media-viewer-image>
+      "
+    >
+      <ds-media-viewer-image
+        [image]="mediaList[0]?.thumbnail || thumbnailPlaceholder"
+        [preview]="false"
+      ></ds-media-viewer-image>
     </ng-container>
   </div>
 </ng-container>
diff --git a/src/app/+item-page/media-viewer/media-viewer.component.ts b/src/app/+item-page/media-viewer/media-viewer.component.ts
index efc9df75e9..84f4d3d372 100644
--- a/src/app/+item-page/media-viewer/media-viewer.component.ts
+++ b/src/app/+item-page/media-viewer/media-viewer.component.ts
@@ -1,7 +1,6 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { filter, take } from 'rxjs/operators';
-import { MediaViewerConfig } from '../../../config/media-viewer-config.interface';
 import { BitstreamDataService } from '../../core/data/bitstream-data.service';
 import { PaginatedList } from '../../core/data/paginated-list.model';
 import { RemoteData } from '../../core/data/remote-data';
@@ -24,7 +23,7 @@ import { followLink } from '../../shared/utils/follow-link-config.model';
 })
 export class MediaViewerComponent implements OnInit {
   @Input() item: Item;
-  @Input() config: MediaViewerConfig;
+  @Input() videoOptions: boolean;
 
   mediaList$: BehaviorSubject<MediaViewerItem[]>;
 
@@ -38,7 +37,6 @@ export class MediaViewerComponent implements OnInit {
    * This metod loads all the Bitstreams and Thumbnails and contert it to media item
    */
   ngOnInit(): void {
-    console.log(this.config)
     this.mediaList$ = new BehaviorSubject([]);
     this.isLoading = true;
     this.loadRemoteData('ORIGINAL').subscribe((bitstreamsRD) => {
diff --git a/src/app/+item-page/simple/item-types/publication/publication.component.html b/src/app/+item-page/simple/item-types/publication/publication.component.html
index 427f849630..dd3e7dbccd 100644
--- a/src/app/+item-page/simple/item-types/publication/publication.component.html
+++ b/src/app/+item-page/simple/item-types/publication/publication.component.html
@@ -14,7 +14,7 @@
       </ds-metadata-field-wrapper>
     </ng-container>
     <ng-container *ngIf="mediaViewer.image">
-      <ds-media-viewer [item]="object" [config]="mediaViewer"></ds-media-viewer>
+      <ds-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-media-viewer>
     </ng-container>
     <ds-item-page-file-section [item]="object"></ds-item-page-file-section>
     <ds-item-page-date-field [item]="object"></ds-item-page-date-field>
diff --git a/src/app/+item-page/simple/item-types/untyped-item/untyped-item.component.html b/src/app/+item-page/simple/item-types/untyped-item/untyped-item.component.html
index d78353930a..4f0dbb0866 100644
--- a/src/app/+item-page/simple/item-types/untyped-item/untyped-item.component.html
+++ b/src/app/+item-page/simple/item-types/untyped-item/untyped-item.component.html
@@ -14,7 +14,7 @@
       </ds-metadata-field-wrapper>
     </ng-container>
     <ng-container *ngIf="mediaViewer.image">
-      <ds-media-viewer [item]="object" [config]="mediaViewer"></ds-media-viewer>
+      <ds-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-media-viewer>
     </ng-container>
     <ds-item-page-file-section [item]="object"></ds-item-page-file-section>
     <ds-item-page-date-field [item]="object"></ds-item-page-date-field>
diff --git a/src/config/media-viewer-config.interface.ts b/src/config/media-viewer-config.interface.ts
index 42981cd768..8a6a163872 100644
--- a/src/config/media-viewer-config.interface.ts
+++ b/src/config/media-viewer-config.interface.ts
@@ -3,6 +3,4 @@ import { Config } from './config.interface';
 export interface MediaViewerConfig extends Config {
   image: boolean;
   video: boolean;
-  width: string;
-  height: string;
 }
diff --git a/src/environments/environment.common.ts b/src/environments/environment.common.ts
index df5c821abc..2f3e38a5f1 100644
--- a/src/environments/environment.common.ts
+++ b/src/environments/environment.common.ts
@@ -232,7 +232,5 @@ export const environment: GlobalConfig = {
   mediaViewer: {
     image: false,
     video: false,
-    width: '340px',
-    height: '279px',
   },
 };