<?php if (!empty($block->getBanner())): ?>
<div class="sparsh_banner">
    <div class="sparsh_banner_slider">
        <?php  foreach ($block->getBanner() as $banner): ?>
        <div>
            <?php if ($banner->getBannerType() == "Video"):?>
                <div class="video-thumb">
                    <?php if ($banner->getBannerVideoAutoplay()) { ?>
                    <video controls autoplay muted loop>
                    <?php } else { ?>
                    <video controls>
                    <?php } ?>
                          <source src="<?= $block->escapeHtml($block->getMediaPath().$banner->getBannerVideo()) ?>" type="video/mp4">
                    </video>
                </div>            
            <?php endif;?>
            
            <?php if ($banner->getBannerType() == "Youtube"):?>
                <div class="youtube-thumb">
                    <iframe src="https://www.youtube.com/embed/<?= $block->escapeUrl($banner->getBannerYoutube()) ?>?controls=0&rel=0<?php if ($banner->getBannerVideoAutoplay()) { echo "&autoplay=1";
                                                               } else { echo "&autoplay=0"; } ?>&modestbranding=1&disablekb=1"
                        <?php if ($banner->getBannerVideoAutoplay()) { echo "allow='autoplay;'"; } ?> frameborder="0" allowfullscreen>
                    </iframe>
                </div>            
            <?php endif;?>

            <?php if ($banner->getBannerType() == "Image"):?>
                <div class="image-thumb">
                    <img src="<?= $block->escapeHtml($block->getMediaPath().$banner->getBannerImage()) ?>" alt="<?= /* @noEscape */ ($banner->getBannerTitle()?$banner->getBannerTitle():"Sparsh Banner");?>">
                </div>
                <?php if ($banner->getBannerDescription() != "" || $banner->getBannerTitle() != ""):?>
                    <div class="caption">
                        <div class="title">
                            <div class="container">
                                <?php if ($banner->getBannerTitle() != ""):?>
                                <h2><?= $block->escapeHtml($banner->getBannerTitle()) ?></h2>
                                <?php endif; ?>
                                <?php if ($banner->getBannerDescription() != ""):?>
                                    <?= /* @noEscape */ $banner->getBannerDescription() ?>
                                <?php endif; ?>
                            </div>
                        </div>
                        <?php if ($banner->getLabelButtonText() != ""): ?>
                        <div class="container">
                            <a href="<?= $block->escapeHtml(($banner->getCallToAction()?$banner->getCallToAction():'#')) ?>" class="btn btn-md btn-banner">
                                <?= $block->escapeHtml($banner->getLabelButtonText()) ?>
                            </a>
                        </div>
                        <?php endif; ?>
                    </div>
                <?php endif;?>
            <?php endif;?>
        </div>
        <?php endforeach; ?>
    </div>
</div>
<script type="text/x-magento-init">
{
    "*": {
        "Sparsh_Banner/js/banner-slider": {
            "autoplay": "<?= /* @noEscape */ $block->getConfig('sparsh_banner/advance/auto_rotation'); ?>",
            "autoplay_speed": "<?= /* @noEscape */ $block->getConfig('sparsh_banner/advance/auto_rotation_speed'); ?>"
        }
    }
}
</script>
<?php endif; ?>
