<?php
$options    = (array)$block['options'];
$items      = $block['items'];
$class      = isset($block['class']) ? $block['class'] : '';
$target     = $options['target_new'] ? '_self' : '_blank';
$number     = empty($options['max_rows']) ? 3 : $options['max_rows'];
$carouselId = uniqid('carousel-');
$locale     = Pi::service('i18n')->getLocale();


// Set style
$imgStyle = '';
if (!empty($options['width'])) {
    $imgStyle .= 'width: ' . $options['width'] . 'px;';
}
if (!empty($options['height'])) {
    $imgStyle .= 'height: ' . $options['height'] . 'px;';
}
if (!empty($imgStyle)) {
    $imgStyle = sprintf('style="%s" ', $imgStyle);
}

// Get local
$rtl  = (in_array($locale, ['fa', 'ar'])) ? 'true' : 'false';
$loop = 'true';

// Set arrow
$iconOwlLeft  = in_array($locale, ['fa', 'ar']) ? '<i class="fas fa-angle-right"></i>' : '<i class="fas fa-angle-left"></i>';
$iconOwlRight = in_array($locale, ['fa', 'ar']) ? '<i class="fas fa-angle-left"></i>' : '<i class="fas fa-angle-right"></i>';

// Set script
$script
        = <<<'EOT'
    $(document).ready(function($) {
		$('#%s').owlCarousel({
    		loop: %s,
    		lazyLoad:true,
    		rtl:%s,
    		margin:3,
    		nav:true,
    		autoplay:true,
    		dots:false,
    		autoplayTimeout:6000,
    		autoplayHoverPause:true,
    		navText: ['%s', '%s'],
    		responsive:{
        		0:{items:2},
        		600:{items:3},
        		1000:{items:%s}
    		}
		})
    });
EOT;
$script = sprintf($script, $carouselId, $loop, $rtl, $iconOwlLeft, $iconOwlRight, $number);

// Load files
$this->jQuery([
    'extension/owl.carousel.min.js',
    'extension/owl.carousel.min.css',
    'extension/owl.theme.default.min.css',
]);
$this->footScript()->appendScript($script);
?>
<div class="widget-owl-carousel">
    <div id="<?php echo $carouselId; ?>" class="owl-carousel owl-theme text-center clearfix <?php echo $class; ?>">
        <?php foreach ($items as $item) { ?>
            <?php $caption = _escape($item['caption']); ?>
            <?php if (isset($item['link']) && !empty($item['link'])) { ?>
                <a href="<?php echo $item['link']; ?>" target="<?php echo $target; ?>">
                    <img src="<?php echo $item['image']; ?>" <?php echo $imgStyle; ?> alt="<?php echo $caption; ?>" />
                </a>
            <?php } else { ?>
                <img src="<?php echo $item['image']; ?>" <?php echo $imgStyle; ?> alt="<?php echo $caption; ?>" />
            <?php } ?>
        <?php } ?>
    </div>
</div>