<?php
$frontendHelper = $this->helper('Wyomind\ElasticsearchLayeredNavigation\Helper\Frontend');
$swatchMediaUrl = $frontendHelper->getBaseMediaUrl();
?>
<script id="eln-product-attribute-filter-template" type="text/x-magento-template">
    <div class="eln-filter-item filter-options-item" attribute-code="<%= attributeCode %>"
         data-role="eln-product-attribute-filter-content">
        <div class="filter-options-title"><%= filter.label %></div>
        <div class="eln-filter-content filter-options-content" role="tabpanel">
            <div class="swatch-attribute-options clearfix">
                <div class="swatch-attribute hide-more">
                    <div class="container">
                        <% if (showLayerFilter) { %>
                        <input type="text" class="eln-layer-filter"/>
                        <% } %>
                        <% _.each(filter.values, function(data) { %>
                        <% if (generateUrl) { %>
                        <a href="<% if (!_.has(selected, data.id)) { %><%= _.createFilterUrl(attributeCode,data.label) %><% } else { %><%= _.createFilterUrlMinus(attributeCode,data.label) %><% } %>"
                        <% } else { %>
                        <span
                        <% } %>
                           class="<% if (showMoreLess == 1) { %>hide<%= showMoreLessNbValues %> <% } %>eln-filter-option filter-option <% if (data.count == 0) { %>disabled<% } %>" style="display:block" attribute-code="<%= attributeCode %>" option-id="<%= data.id %>" option-label="<%= data.label %>">
                            <input type="checkbox" <% if (_.has(selected, data.id)) { %>checked="checked"<% } %>/>
                            <div data-filter="<%= data.label.toLowerCase() %>" title="<%= data.label %><% if (data.count > 0) { %> (<%= data.count %>)<% } %>" style="float: none;max-width: 100%;width: 100%;">
                                <span class="title <% if (_.has(selected, data.id)) { %>selected<% } %>">
                                    <% if (data.image != "") { %>
                                    <img class='eln-option-image' src="<?= $swatchMediaUrl ?><%= data.image %>" width="20" height="20"/>
                                    <% } %>
                                    <%= data.label %>
                                </span>
                                <% if (showResultsCount == 1 && data.count > 0) { %><span class="count"><%= data.count %></span><% } %>
                            </div>
                        <% if (generateUrl) { %>
                        </a>
                        <% } else { %>
                        </span>
                        <% } %>
                        <% }) %>
                    </div>
                    <% if (_.size(filter.values) > showMoreLessNbValues && showMoreLess) { %>
                    <a class="show-more wyomind-primary-color" href="#"><?= __('Show more'); ?></a>
                    <a class="show-less wyomind-primary-color" href="#"><?= __('Show less'); ?></a>
                    <% } %>
                </div>
            </div>
        </div>
    </div>
</script>
