adjusts gallery height
This commit is contained in:
parent
f655e84081
commit
2e3a5e2f03
14
README.md
14
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
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in New Issue