<?php
$_product = $this->getProduct();
$_helper = $this->helper('catalog/output');
$now = date("Y-m-d H:m:s");
$use_zoom = themeOptions('use_zoom');
$use_carousel = themeOptions('use_carousel');
$thumbs_count = count($this->getGalleryImages());
$_i_thumbs = 0;
?>
<?php
$_mainWidth = 350;
$_mainHeight = 350;
$_smWidth = 68;
$_smHeight = 68;
$_carWidth = 344;
$_zoomLeft = $_mainWidth + 17;
$_zoomWidth = 350;
?>
<style>
.product-view .product-img-box .more-views { width:<?php echo $_carWidth ?>px; }
#zoom-window { left: <?php echo $_zoomLeft ?>px; width: <?php echo $_zoomWidth ?>px; }
</style>
<div class="zoom-container layout_default">
<?php include('labels.phtml') ?>
<div class="main-image" >
<a id="zoom" class="<?php if(!$use_zoom): ?> lightbox<?php endif;?> main-thumbnail" href="<?php echo $this->helper('catalog/image')->init($_product, 'image') ?>">
<?php
$_img = '<img class="zoom-image" src="'.$this->helper('catalog/image')->init($_product, 'image')->resize($_mainWidth,$_mainHeight).'" width="'.$_mainWidth.'" height="'.$_mainHeight.'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" />';
echo $_helper->productAttribute($_product, $_img, 'image');
?>
</a>
<?php if($use_zoom): ?>
<div class="lightbox-btn">
<a id="zoom" class="lightbox" href="<?php echo $this->helper('catalog/image')->init($_product, 'image') ?>">
<?php echo $this->__('Enlarge') ?>
</a>
</div>
<?php endif;?>
</div>
<div class="more-views "<?php if($use_carousel && $thumbs_count > 4): ?>style="height:80px;"<?php endif; ?>">
<div class="zoom-gallery slider">
<?php if($thumbs_count == 0): ?>
<div class="slide last">
<a class="zoom-thumbnail<?php if(!$use_zoom): ?> lightbox<?php endif;?>" href="<?php echo $this->helper('catalog/image')->init($_product, 'image') ?>" data-easyzoom-source="<?php echo $this->helper('catalog/image')->init($_product, 'image')->resize($_mainWidth,$_mainHeight) ?>">
<?php
$_img = '<img class="zoom-image fade-image" src="'.$this->helper('catalog/image')->init($_product, 'thumbnail')->resize($_smWidth,$_smHeight).'" width="'.$_smWidth.'" height="'.$_smHeight.'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" />';
echo $_helper->productAttribute($_product, $_img, 'image');
?>
</a>
</div>
<?php endif; ?>
<?php if ($thumbs_count > 0): ?>
<?php foreach ($this->getGalleryImages() as $_image): $_i_thumbs++; ?>
<div class="slide <?php if($thumbs_count == $_i_thumbs) echo 'last'; ?>">
<a class="zoom-thumbnail<?php if(!$use_zoom): ?> lightbox<?php endif;?>" href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()); ?>" data-easyzoom-source="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize($_mainWidth,$_mainHeight); ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img class="fade-image" src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize($_smWidth,$_smHeight); ?>" width="<?php echo $_smWidth ?>" height="<?php echo $_smHeight ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>
</div>
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
<?php if($use_carousel && $thumbs_count > 4): ?>
<div class="more-views-arrow prev"> </div>
<div class="more-views-arrow next"> </div>
<?php endif;?>
</div>
<script type="text/javascript">
<?php if($use_zoom): ?>
// Start easyZoom
jQuery('#zoom')
.easyZoom({
parent: 'div.zoom-container',
preload: '',
lightboxBtn: '.lightbox-btn .lightbox'
})
.data('easyZoom')
.gallery('a.zoom-thumbnail');
<?php endif;?>
<?php if($use_carousel && $thumbs_count > 4): ?>
jQuery('.more-views').iosSlider({
desktopClickDrag: true,
snapToChildren: true,
infiniteSlider: false,
navNextSelector: '.more-views-arrow.next',
navPrevSelector: '.more-views-arrow.prev'
});
<?php endif;?>
// Start lightbox
jQuery('a.lightbox').lightBox({
imageLoading : '<?php echo $this->getSkinUrl('images/lightbox-ico-loading.gif') ?>',
imageBtnClose : '<?php echo $this->getSkinUrl('images/lightbox-btn-close.gif') ?>',
imageBtnNext : '<?php echo $this->getSkinUrl('images/lightbox-btn-next.gif') ?>',
imageBtnPrev : '<?php echo $this->getSkinUrl('images/lightbox-btn-prev.gif') ?>',
imageBlank : '<?php echo $this->getSkinUrl('images/lightbox-blank.gif') ?>',
fixedNavigation : true
});
</script>