{#
 * @version		$Id: slideshow_xt.twig 5503 2019-02-15 13:58:41Z mic $
 * @package		Slideshow XT
 * @author		mic - https://osworx.net
 * @copyright	2019 OSWorX
 * @license		OCL OSWorX Commercial License
#}
<div class="swiper-viewport sw-viewport-{{ module }}">
	<div id="slideshow{{ module }}" class="swiper-container">
		<div class="swiper-wrapper">
			{% for banner in banners %}
				<div class="swiper-slide text-center">
					{% if banner.link %}
						<a href="{{ banner.link }}"><img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" /></a>
					{% else %}
						<img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" />
					{% endif %}
				</div>
			{% endfor %}
		</div>
	</div>
	{% if pagination %}
		<div class="swiper-pagination slideshow{{ module }}"></div>
		<div class="swiper-pager">
			<div class="swiper-button-next"></div>
			<div class="swiper-button-prev"></div>
		</div>
	{% endif %}
</div>
{{ css }}
<script>
$('#slideshow{{ module }}').swiper({
	mode: 'horizontal',
	slidesPerView: 1,
	pagination: '.slideshow{{ module }}',
	paginationClickable: true,
	nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',
    spaceBetween: {{ spaceBetween }},
	autoplay: {{ autoplay }},
    autoplayDisableOnInteraction: true,
	loop: true,
	speed: {{ speed }},
	effect: '{{ effect }}'
});
</script>