ImageViewer-omeka-module/view/common/block-layout/imageViewer.phtml

57 lines
1.4 KiB
PHTML

<?php
if ($zoom_type == "wheelzoom") {
$this->headScript()->appendFile($this->assetUrl('vendor/wheelzoom/wheelzoom.js',
'ImageViewer'));
}
if ($zoom_type == "zoom") {
$this->headScript()->appendFile($this->assetUrl('vendor/zoom/jquery.zoom.min.js',
'ImageViewer'));
}
if ($zoom_type == "zoom" || $zoom_type == "wheelzoom") {
$this->headLink()->appendStylesheet($this->assetUrl('css/zoom.css',
'ImageViewer'));
}
?>
<?php
if ($title !== false && $title !== "") {
$title = sprintf('<p id="wheelzoom-title">%s</p>', $title);
} else {
$title = false;
}
?>
<?php if ($zoom_type == "zoom") { ?>
<div id='<?= $id ?>' class='zoom' style='width:<?= $width ?>%; cursor:grab'>
<img src='<?= $image ?>' alt='<?= $title ?>'/>
</div>
<script>
$(document).ready(function(){
$('#<?= $id ?>').zoom({on:'grab', 'duration': 200, 'magnify': 1.5});
});
</script>
<?php } ?>
<?php if ($zoom_type == "wheelzoom") { ?>
<div class='zoom' style='display:block; width:<?= $width ?>%; cursor:crosshair'>
<img id="<?= $id ?>" src="<?= $image ?>" />
</div>
<script>
$(document).ready(function(){
wheelzoom(document.querySelector('#<?= $id ?>'));
});
</script>
<?php } ?>
<?php if ($zoom_type == "") { ?>
<div class="archive-img">
<img id="<?= $id ?>"
style="width: <?= $width ?>%;"
src="<?= $image ?>"
/>
</div>
<?php } ?>