<?php

if ((isset($lists) && count($lists) > 0) || (isset($values) && count($values) > 0)) {
    $url = $sf_request->getPathInfo();
    ?>
    <form method="get" action="<?php echo $url;?>" class="catalog_filters custom_slider-ui">
        <?php
        $lists_count = count($lists);
        if ($lists_count > 0) {
            foreach ($lists as $list) {
                echo '<div class="catalog_filters__list">';
                echo '<div class="catalog_filters__h">' . $list['Translation'][$culture]['title'] . '</div>';
                foreach ($list['ProductPropList'] as $prop_list) {
                    echo '<label><input autocomplete="off" onchange="filter.change();" name="filter_list[' . $list['id'] . '][]" value="' . $prop_list['id'] . '" type="checkbox">' . $prop_list['Translation'][$culture]['variant'] . '</label>';
                }
                echo '</div>';
            }
        }
        $values_count = count($values);
        if ($values_count > 0) {
            foreach ($values as $key => $value) {
                if ($value['min'] != $value['max']) {
                    echo '<div class="catalog_filters__range">';
                    echo '<div class="catalog_filters__h">' . $value['ProductProp']['Translation'][$culture]['title'] . '</div>';
                    echo '<div id="slider_power_' . $key . '" class="slider_prop" data-slider_key="' . $key . '" data-min="' . (int)$value['min'] . '" data-max="' . (int)$value['max'] . '" data-start="[' . (int)$value['min'] . ',' . (int)$value['max'] . ']" data-connect="true"></div>';
                    echo '<input autocomplete="off" class="slider_power_inp_min slider_power_inp_' . $key . '" type="hidden" name="filter_range[' . $value['prop_id'] . '][min]" value="" />';
                    echo '<input autocomplete="off" class="slider_power_inp_max slider_power_inp_' . $key . '" type="hidden" name="filter_range[' . $value['prop_id'] . '][max]" value="" />';
                    echo '</div>';
                }
            }
        }
        echo '<i class="br20"></i><a href="' . $url . '?reset" class="catalog_filters__reset bbs_d fs_13 red_link">Сбросить фильтр</a>';
        ?>
    </form>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.slider_prop').each(function (index, element) {
                window[element.id] = document.getElementById(element.id);
                $(window[element.id]).before('<div class="slider_count"><span></span><span></span></div>');
                noUiSlider.create(window[element.id], {
                    start: $(window[element.id]).data('start'),
                    connect: $(window[element.id]).data('connect'),
                    margin: 0,
                    range: {
                        'min': $(window[element.id]).data('min'),
                        'max': $(window[element.id]).data('max')
                    },
                    step: 1
                });
                window[element.id].noUiSlider.on('update', function (values, handle) {
                    $(this.target).prev().find('span:first-child').text(this.options.range.min);
                    $(this.target).prev().find('span:last-child').text(this.options.range.max);
                    var _this = this;
                    var key = $(this.target).data('slider_key');
                    values.forEach(function (value, index, array) {
                        $(_this.target).find('.noUi-origin .noUi-handle[data-handle=' + index + ']').text(parseInt(value));
                        $('.slider_power_inp_' + key).eq(index).val(parseInt(value));
                    });
                });
                window[element.id].noUiSlider.on('end', function(values, handle){
                    filter.change();
                });
            });
        });
    </script>
    <?php
}
?>