#885 move size to css

2025-10-07 01:54:15 +00:00 · 2021-02-16 15:41:39 +01:00
parent 80e5199e37
commit d6ccf72119
11 changed files with 33 additions and 34 deletions
--- 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;
 }
--- 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 = [
--- 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]="
--- 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;
+}
--- 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[];

--- 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>
--- 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) => {
--- 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>
--- 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>
--- 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;
 }
--- 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',
  },
 };