{#
Copyright (C) SPREAD WORKS Inc. All Rights Reserved.
For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.
#}
{% set bind_prefix = constant('Plugin\\TabaBannerManager2\\Common\\Constants::FRONT_BIND_PREFIX') %}
{% set css_id = 'tababannermanager_'~banner_area.areaId %}
{% set param = '' %}
{% for banner in banner_list %}
{% set param = param~'&banner_id[]='~banner.bannerId %}
{% endfor %}
{% if banner_area.effectDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Area::EFFECT_DIV_SLIDE') %}
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script>
<style>
</style>
<script>
$(function() {
$('#{{ css_id }}').slick({
infinite: true,
dots:true,
slidesToShow: 1,
slidesToScroll: 1,
autoplay: true,
arrows: false,
});
$('#{{ css_id }}').on('afterChange',function(event,slick,currentSlide){
var bannerId = $(this).find('div[data-slick-index="' + currentSlide + '"]').attr('data-key');
viewCounter("&banner_id=" + bannerId);
});
var bannerId = $('#{{ css_id }}').find('.tababannermanager_banner').attr('data-key');
viewCounter("&banner_id=" + bannerId);
});
</script>
{% elseif banner_area.effectDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Area::EFFECT_DIV_HORIZONTAL') %}
<style>
#{{ css_id }} {
display: flex;
}
#{{ css_id }} .tababannermanager_banner:not(:last-child) {
margin-right: 16px;
}
</style>
<script>
$(function() {
viewCounter('{{ param|raw }}');
});
</script>
{% elseif banner_area.effectDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Area::EFFECT_DIV_VERTICAL') %}
<style>
#{{ css_id }} .tababannermanager_banner {
display: flex;
flex-direction: column;
}
#{{ css_id }} .tababannermanager_banner:not(:last-child) {
margin-bottom: 16px;
}}
</style>
<script>
$(function() {
viewCounter('{{ param|raw }}');
});
</script>
{% elseif banner_area.effectDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Area::EFFECT_DIV_HORIZONTAL_RESPONSIVE') %}
{% if options is not empty and options.grid is not empty %}
{% set responsive_col = options.grid %}
{% else %}
{% set responsive_col = 'col-12 col-sm-4 col-md-3' %}
{% endif %}
<script>
$(function() {
viewCounter('{{ param|raw }}');
});
</script>
{% endif %}
<script>
function viewCounter(data) {
$.ajax({
type: 'POST',
url:'{{ path(bind_prefix~'_view_counter') }}',
data: "{{ constant('Eccube\\Common\\Constant::TOKEN_NAME') }}={{ csrf_token }}" + data,
success: function(json) {},
error: function() {}
});
}
</script>
{{ banner_area.preHtml|raw }}
{% if banner_area.effectDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Area::EFFECT_DIV_HORIZONTAL_RESPONSIVE') %}
<div class="tababannermanager_area row" id="{{ css_id }}">
{% else %}
<div class="tababannermanager_area" id="{{ css_id }}">
{% endif %}
{% for banner in banner_list %}
<div class="tababannermanager_banner {{ responsive_col|default('') }}" id="{{ css_id }}_{{ banner.bannerId }}" data-key="{{ banner.bannerId }}">
{% if banner.url is not empty %}<a href="{{ path(bind_prefix~'_click_counter',{banner_id:banner.bannerId}) }}" {% if banner.linkTarget is not empty %}target="{{ banner.linkTarget }}"{% endif %}>{% endif %}
{% if banner.bannerDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Banner::BANNER_DIV_IMAGE') %}
<img src="{{ asset(banner.bannerFileName,'save_image') }}" class="img-fluid">
{% elseif banner.bannerDiv == constant('Plugin\\TabaBannerManager2\\Entity\\Banner::BANNER_DIV_TEXT') %}
{{ banner.bannerText|raw }}
{% endif %}
{% if banner.description is not empty %}<p>{{ banner.description|raw }}</p>{% endif %}
{% if banner.url is not empty %}</a>{% endif %}
</div>
{% endfor %}
</div>
{{ banner_area.postHtml|raw }}