From 2e3a5e2f031cf563400f41675e2718bae63b2c54 Mon Sep 17 00:00:00 2001
From: buttle <chris@gatopelao.org>
Date: Mon, 28 Jun 2021 13:05:17 +0200
Subject: [PATCH] adjusts gallery height

---
 README.md                                   | 14 ++++-------
 asset/css/gallery.css                       |  6 ++---
 src/Site/BlockLayout/ImageGallery.php       | 19 +++++++++------
 view/common/block-layout/imageGallery.phtml | 27 ++++++++++++++++-----
 4 files changed, 41 insertions(+), 25 deletions(-)

diff --git a/README.md b/README.md
index a2c9adf..d60fca9 100644
--- a/README.md
+++ b/README.md
@@ -1,16 +1,14 @@
-# ImageGallery media for Omeka S
+# ImageGallery for Omeka S
 
-[ImageGallery] is a module for [Omeka S] that optionally enables [wheelzoom],
-a script for zooming IMG elements with the mousewheel/trackpad and [zoom],
-a script to enlarge images on touch, click, or mouseover.
+[ImageGallery] is a module for [Omeka S] that displays image media in an item.
 
 ## Install
 
 ```
 cd ./modules
-https://git.hangar.org/arcHIVE-tech/ImageGallery/archive/main.zip
+https://git.hangar.org/arcHIVE-tech/ImageGallery-omeka-module
 unzip main.zip
-mv imageviewer-omeka-module/ ImageGallery
+mv ImageGallery-omeka-module/ ImageGallery
 rm main.zip
 ```
 
@@ -18,8 +16,6 @@ rm main.zip
 The module is released under the [MIT] License.
 
 [arc-hive]: https://arc-hive.zone/
-[wheelzoom]: https://github.com/jackmoore/wheelzoom
-[zoom]: https://github.com/jackmoore/zoom
 [Omeka S]: https://omeka.org/s
-[ImageGallery]: https://git.hangar.org/arcHIVE-tech/ImageGallery
+[ImageGallery]: https://git.hangar.org/arcHIVE-tech/ImageGallery-omeka-module
 [MIT]: http://opensource.org/licenses/MIT
diff --git a/asset/css/gallery.css b/asset/css/gallery.css
index 6ebbf41..80b74c2 100644
--- a/asset/css/gallery.css
+++ b/asset/css/gallery.css
@@ -8,7 +8,8 @@
 }
 
 .archive-gallery img {
-  max-width: 100%;
+  /*max-width: 100%;*/
+  width: 100%;
   vertical-align: top;
 }
 
@@ -16,7 +17,6 @@
   display: flex;
   /*margin: 10px auto;*/
   margin: 0 auto;
-  max-width: 600px;
   position: relative;
   /*padding-top: 66.6666666667%;*/
 }
@@ -35,7 +35,7 @@
   transition: opacity 0.3s ease-in-out;
 }
 .archive-gallery .gallery__thumb {
-  padding-top: 6px;
+  padding-top: 0px;
   margin: 6px;
   display: block;
 }
diff --git a/src/Site/BlockLayout/ImageGallery.php b/src/Site/BlockLayout/ImageGallery.php
index 9d0ac82..dc4c01d 100644
--- a/src/Site/BlockLayout/ImageGallery.php
+++ b/src/Site/BlockLayout/ImageGallery.php
@@ -75,15 +75,20 @@ class ImageGallery extends AbstractBlockLayout
 
     $media = $attachments[0]->item()->media()[0];
     $item = $attachments[0]->item();
+    $item_url = null;
+    if ($block->dataValue('renderSourceLink')) {
+      $item_url = $attachments[0]->item()->url();
+    }
+    $max_width = $block->dataValue('width');
 		return $view->partial('common/block-layout/imageGallery', [
-			'title' => $block->dataValue('title'),
-      'item' => $item,
-      'images' => $item->media(),
-      'item_url' => $attachments[0]->item()->url(),
-      'renderSourceLink' => $block->dataValue('renderSourceLink'),
-			'width' => $block->dataValue('width'),
-			'image' => $media->primaryMedia()->thumbnailUrl('large'),
       'gallery_id' => 'ig-' . ++$id,
+			'title' => $block->dataValue('title'),
+      //'item' => $item,
+      'images' => $item->media(),
+      'item_url' => $item_url,
+      //'renderSourceLink' => $block->dataValue('renderSourceLink'),
+			'width' => $block->dataValue('width'),
+      'max_width' => $max_width,
 		]);
 	}
 }
diff --git a/view/common/block-layout/imageGallery.phtml b/view/common/block-layout/imageGallery.phtml
index 5923207..f285dfc 100644
--- a/view/common/block-layout/imageGallery.phtml
+++ b/view/common/block-layout/imageGallery.phtml
@@ -7,14 +7,15 @@ $this->headLink()->appendStylesheet($this->assetUrl('css/gallery.css', 'ImageGal
 
 
 <div class="archive-gallery">
-	<?php if ($renderSourceLink) { ?>
+	<?php if ($item_url) { ?>
 		<div class="source-link">
 			<a href="<?= $item_url ?>">Source</a>
 		</div>
 	<?php } ?>
 
 	<section id="<?= $gallery_id ?>"
-					 class="gallery" style="padding-top: 330px;">
+					 class="gallery"
+					 style="padding-top: 400px; max-width: <?= $max_width ?>%;">
 
 	<?php foreach ($images as $image) { ?>
 		<?php $image_id = $image_id +1;
@@ -26,13 +27,13 @@ $this->headLink()->appendStylesheet($this->assetUrl('css/gallery.css', 'ImageGal
 						 checked name="gallery"
 						 class="gallery__selector"/>
 	    <img class="gallery__img"
-					 style="height: 330px;"
-					 src="<?= $image->primaryMedia()->thumbnailUrl('large') ?>"
-					 alt=""
+					 style=""
+					 src="<?= $image->primaryMedia()->originalUrl() ?>"
+					 alt="<?= $image->primaryMedia()->source() ?>"
 			/>
 	    <label for="<?= $img_id ?>" class="gallery__thumb">
 				<img src="<?= $image->primaryMedia()->thumbnailUrl('large') ?>"
-						 alt=""
+						 alt="Thumbnail: <?= $image->primaryMedia()->source() ?>"
 				/>
 			</label>
 	  </div>
@@ -41,3 +42,17 @@ $this->headLink()->appendStylesheet($this->assetUrl('css/gallery.css', 'ImageGal
 
 	</section>
 </div>
+
+
+<script>
+jQuery(document).ready(function() {
+	var gallery_image_height=0;
+	$( ".gallery__img" ).each(function( index ) {
+		if ($(this).height() > gallery_image_height) {
+			gallery_image_height = $(this).height();
+		}
+	});
+	$('section.gallery').css('padding-top', gallery_image_height)
+
+});
+</script>