<? if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED !== true) die();
/** @var array $arParams */
/** @var array $arResult */
/** @global CMain $APPLICATION */
/** @global CUser $USER */
/** @global CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */

/** @var CBitrixComponent $component */

use Bitrix\Iblock\SectionPropertyTable;


$this->setFrameMode(true);

$templateData = array(
    'TEMPLATE_THEME' => $this->GetFolder() . '/themes/' . $arParams['TEMPLATE_THEME'] . '/colors.css',
    'TEMPLATE_CLASS' => 'bx-' . $arParams['TEMPLATE_THEME']
);

if (isset($templateData['TEMPLATE_THEME'])) {
    $this->addExternalCss($templateData['TEMPLATE_THEME']);
}

$arResult['FORM_ACTION'] = '/catalog'. preg_replace('~^/catalog/(.+?)filter/~i', "/", $arResult['FORM_ACTION']);
//$this->addExternalCss("/bitrix/css/main/bootstrap.css");
//$this->addExternalCss("/bitrix/css/main/font-awesome.css");
?>

<aside class="catalog-page__filter">
    <div class="catalog-page__filter-wrap">
        <div class="bx-filter <?= $templateData["TEMPLATE_CLASS"] ?> <? if ($arParams["FILTER_VIEW_MODE"] == "HORIZONTAL") echo "bx-filter-horizontal" ?>">
            <form name="<? echo $arResult["FILTER_NAME"] . "_form" ?>" action="<? echo $arResult["FORM_ACTION"] ?>"
                  method="get">
                <div class="filter">
                    <div class="filter__top">
                        <h3 class="filter__title">Фильтры</h3>
                        <button class="filter__top-btn button button--green button--outline js-close-filter"
                                type="button">
                            <svg width="20" height="20" viewbox="0 0 20 20" fill="none"
                                 xmlns="http://www.w3.org/2000/svg">
                                <path d="M6 6L14.4853 14.4853M6 14.4853L14.4853 6.00001" stroke="#3D3D3D"
                                      stroke-width="1.67" stroke-linecap="round"></path>
                            </svg>
                        </button>
                    </div>
                    <div class="filter__wrap filter__wrap--left">
<!--                        <div class="filter__item filter__item--list">-->
<!--                            <a class="filter__category is-active filter__category--base" href="category.html">-->
<!--                                Все товары <span>48</span>-->
<!--                            </a>-->
<!--                            <a class="filter__category" href="category.html">-->
<!--                                Септики<span>30</span>-->
<!--                            </a>-->
<!--                            <a class="filter__category" href="category.html">-->
<!--                                Канализации<span>4</span>-->
<!--                            </a>-->
<!--                            <a class="filter__category" href="category.html">-->
<!--                                Станции очистки<span>4</span>-->
<!--                            </a>-->
<!--                            <a class="filter__category" href="category.html">-->
<!--                                ЛОС<span>10</span>-->
<!--                            </a>-->
<!--                        </div>-->
<!--                        --><?//$APPLICATION->IncludeComponent(
//                            "bitrix:catalog.section.list",
//                            ".default",
//                            array(
//                                "ADDITIONAL_COUNT_ELEMENTS_FILTER" => "additionalCountFilter",
//                                "ADD_SECTIONS_CHAIN" => "Y",
//                                "CACHE_FILTER" => "N",
//                                "CACHE_GROUPS" => "Y",
//                                "CACHE_TIME" => "36000000",
//                                "CACHE_TYPE" => "A",
//                                "COUNT_ELEMENTS" => "Y",
//                                "COUNT_ELEMENTS_FILTER" => "CNT_ACTIVE",
//                                "FILTER_NAME" => "",
//                                "HIDE_SECTIONS_WITH_ZERO_COUNT_ELEMENTS" => "N",
//                                "IBLOCK_ID" => "4",
//                                "IBLOCK_TYPE" => "catalog",
//                                "SECTION_CODE" => "",
//                                "SECTION_FIELDS" => array(
//                                    0 => "",
//                                    1 => "",
//                                ),
//                                "SECTION_ID" => $_REQUEST["SECTION_ID"],
//                                "SECTION_URL" => "#SECTION_CODE_PATH#",
//                                "SECTION_USER_FIELDS" => array(
//                                    0 => "",
//                                    1 => "",
//                                ),
//                                "SHOW_PARENT_NAME" => "Y",
//                                "TOP_DEPTH" => "1",
//                                "VIEW_MODE" => "LIST",
//                                "COMPONENT_TEMPLATE" => ".default"
//                            ),
//                            false
//                        );?>

                        <?$APPLICATION->IncludeComponent("bitrix:menu", "catalog_left_menu", Array(
	"ALLOW_MULTI_SELECT" => "N",	// Разрешить несколько активных пунктов одновременно
		"CHILD_MENU_TYPE" => "catalog_links",	// Тип меню для остальных уровней
		"DELAY" => "N",	// Откладывать выполнение шаблона меню
		"MAX_LEVEL" => "2",	// Уровень вложенности меню
		"MENU_CACHE_GET_VARS" => "",	// Значимые переменные запроса
		"MENU_CACHE_TIME" => "3600",	// Время кеширования (сек.)
		"MENU_CACHE_TYPE" => "N",	// Тип кеширования
		"MENU_CACHE_USE_GROUPS" => "Y",	// Учитывать права доступа
		"ROOT_MENU_TYPE" => "only_catalog",	// Тип меню для первого уровня
		"USE_EXT" => "Y",	// Подключать файлы с именами вида .тип_меню.menu_ext.php
		"COMPONENT_TEMPLATE" => "catalog_vertical",
		"MENU_THEME" => "site",	// Тема меню
	),
	false
);?>

                        <? foreach ($arResult["HIDDEN"] as $arItem): ?>
                            <input type="hidden" name="<? echo $arItem["CONTROL_NAME"] ?>"
                                   id="<? echo $arItem["CONTROL_ID"] ?>" value="<? echo $arItem["HTML_VALUE"] ?>"/>
                        <? endforeach; ?>



                        <? foreach ($arResult["ITEMS"] as $key => $arItem)//prices
                        {
                            $key = $arItem["ENCODED_ID"];
                            if (isset($arItem["PRICE"])):
                                if ($arItem["VALUES"]["MAX"]["VALUE"] - $arItem["VALUES"]["MIN"]["VALUE"] <= 0)
                                    continue;

                                $precision = 0;
                                $step_num = 4;
                                $step = ($arItem["VALUES"]["MAX"]["VALUE"] - $arItem["VALUES"]["MIN"]["VALUE"]) / $step_num;
                                $prices = array();
                                if (Bitrix\Main\Loader::includeModule("currency")) {
                                    for ($i = 0; $i < $step_num; $i++) {
                                        $prices[$i] = CCurrencyLang::CurrencyFormat($arItem["VALUES"]["MIN"]["VALUE"] + $step * $i, $arItem["VALUES"]["MIN"]["CURRENCY"], false);
                                    }
                                    $prices[$step_num] = CCurrencyLang::CurrencyFormat($arItem["VALUES"]["MAX"]["VALUE"], $arItem["VALUES"]["MAX"]["CURRENCY"], false);
                                } else {
                                    $precision = $arItem["DECIMALS"] ? $arItem["DECIMALS"] : 0;
                                    for ($i = 0; $i < $step_num; $i++) {
                                        $prices[$i] = number_format($arItem["VALUES"]["MIN"]["VALUE"] + $step * $i, $precision, ".", "");
                                    }
                                    $prices[$step_num] = number_format($arItem["VALUES"]["MAX"]["VALUE"], $precision, ".", "");
                                }
                                ?>
                                <div class="filter__item range js-range" data-role="bx_filter_block">
                                    <!--                            <span class="bx-filter-container-modef"></span>-->
                                    <!-- <div class="bx-filter-parameters-box-title" onclick="smartFilter.hideFilterProps(this)"><span>ww<?php /*=$arItem["NAME"]*/
                                    ?> <i data-role="prop_angle" class="fa fa-angle-<?/*if (isset($arItem["DISPLAY_EXPANDED"]) && $arItem["DISPLAY_EXPANDED"] == "Y"):*/
                                    ?>up<?/*else:*/
                                    ?>down<?/*endif*/
                                    ?>"></i></span></div>-->
                                    <div class="filter__item-name">Цена (руб.)</div>
                                    <!--                            <div class="bx-filter-block" data-role="bx_filter_block">-->

                                    <!--<script>
                                        function setMinPrice2() {
                                            var checkbox = document.getElementById('setMinPrice');
                                            var minPriceInput = document.getElementById('<?/*echo $arItem["VALUES"]["MIN"]["CONTROL_ID"]*/
                                    ?>');

                                            console.log("set")
                                            if (checkbox.checked) {
                                                minPriceInput.value = 50000; // Устанавливаем минимальную цену на 10000
                                            } else {
                                                minPriceInput.value = ''; // Очищаем поле, если чекбокс не установлен
                                            }

                                            smartFilter.keyup(minPriceInput); // Обновляем фильтр
                                        }
                                    </script>-->
                                    <div class="range__control">
                                        <div class="range__control-item">
                                            <?= GetMessage("CT_BCSF_FILTER_FROM") ?>
                                            <input class="range__control-input js-input-from"
                                                   id="<? echo $arItem["VALUES"]["MIN"]["CONTROL_ID"] ?>"
                                                   type="text"
                                                   name="<? echo $arItem["VALUES"]["MIN"]["CONTROL_NAME"]?>"
                                                   placeholder="<?=$arItem["VALUES"]["MIN"]["VALUE"]?>"
                                                   value="<?= $arItem["VALUES"]["MIN"]["HTML_VALUE"]?>"
                                                   onkeyup="smartFilter.keyup(this)">
                                        </div>
                                        <div class="range__control-item">
                                            &mdash; <?= GetMessage("CT_BCSF_FILTER_TO") ?>
                                            <input class="range__control-input js-input-to"
                                                   type="text"
                                                   name="<? echo $arItem["VALUES"]["MAX"]["CONTROL_NAME"] ?>"
                                                   id="<? echo $arItem["VALUES"]["MAX"]["CONTROL_ID"]?>"
                                                   placeholder="<?=$arItem["VALUES"]["MAX"]["VALUE"]?>"
                                                   value="<?= $arItem["VALUES"]["MAX"]["HTML_VALUE"]?>"
                                                   onkeyup="smartFilter.keyup(this)">

                                        </div>
                                    </div>
                                    <!--       <div class="col-xs-6 bx-filter-parameters-box-container-block bx-left">-->
                                    <!-- <input type="checkbox" id="setMinPrice" onclick="setMinPrice2()" />
                                        <label for="setMinPrice"><?php /*=GetMessage("CT_BCSF_SET_MIN_PRICE")*/
                                    ?> 50000</label>-->
                                    <!-- <i class="bx-ft-sub"><?php /*=GetMessage("CT_BCSF_FILTER_FROM")*/
                                    ?></i>
                                        <div class="bx-filter-input-container">
                                            <input
                                                class="min-price"
                                                type="text"
                                                name="<?/*echo $arItem["VALUES"]["MIN"]["CONTROL_NAME"]*/
                                    ?>"
                                                id="<?/*echo $arItem["VALUES"]["MIN"]["CONTROL_ID"]*/
                                    ?>"
                                                value="<?/*echo $arItem["VALUES"]["MIN"]["HTML_VALUE"]*/
                                    ?>"
                                                size="5"
                                                onkeyup="smartFilter.keyup(this)"
                                            />

                                        </div>

                                    </div>
                                    <div class="col-xs-6 bx-filter-parameters-box-container-block bx-right">
                                        <i class="bx-ft-sub"><?php /*=GetMessage("CT_BCSF_FILTER_TO")*/
                                    ?></i>
                                        <div class="bx-filter-input-container">
                                            <input
                                                class="max-price"
                                                type="text"
                                                name="<?/*echo $arItem["VALUES"]["MAX"]["CONTROL_NAME"]*/
                                    ?>"
                                                id="<?/*echo $arItem["VALUES"]["MAX"]["CONTROL_ID"]*/
                                    ?>"
                                                value="<?/*echo $arItem["VALUES"]["MAX"]["HTML_VALUE"]*/
                                    ?>"
                                                size="5"
                                                onkeyup="smartFilter.keyup(this)"
                                            />
                                        </div>
                                    </div>-->

                                    <!--                                    <div class="range__sliders" id="drag_track_-->
                                    <?php //=$key
                                    ?><!--">-->
                                    <!--                                        <input class="range__slider js-range-from" type="range" value="-->
                                    <?//echo $sectMinPrice
                                    ?><!--" min="--><?//echo $sectMinPrice
                                    ?><!--" max="--><?//echo $sectMaxPrice
                                    ?><!--" id="left_slider_--><?php //=$key
                                    ?><!--">-->
                                    <!--                                        <input class="range__slider js-range-to" type="range" value="-->
                                    <?//echo $sectMaxPrice
                                    ?><!--" min="--><?//echo $sectMinPrice
                                    ?><!--" max="--><?//echo $sectMaxPrice
                                    ?><!--" id="right_slider_--><?php //=$key
                                    ?><!--">-->
                                    <!--                                    </div>-->
                                    <!--                                    <div class="col-xs-10 col-xs-offset-1 bx-ui-slider-track-container">-->
                                    <div class="bx-ui-slider-track" id="drag_track_<?= $key ?>">
                                        <!--                                            --><?//for($i = 0; $i <= $step_num; $i++):
                                        ?>
                                        <!--                                                <div class="bx-ui-slider-part p-->
                                        <?php //=$i+1
                                        ?><!--"><span>--><?php //=$prices[$i]
                                        ?><!--</span></div>-->
                                        <!--                                            --><?//endfor;
                                        ?>

                                        <div class="bx-ui-slider-pricebar-vd" style="left: 0;right: 0;"
                                             id="colorUnavailableActive_<?= $key ?>"></div>
                                        <div class="bx-ui-slider-pricebar-vn" style="left: 0;right: 0;"
                                             id="colorAvailableInactive_<?= $key ?>"></div>
                                        <div class="bx-ui-slider-pricebar-v" style="left: 0;right: 0;"
                                             id="colorAvailableActive_<?= $key ?>"></div>
                                        <div class="bx-ui-slider-range" id="drag_tracker_<?= $key ?>"
                                             style="left: 0%; right: 0%;">
                                            <a class="bx-ui-slider-handle left" style="left:0;"
                                               href="javascript:void(0)" id="left_slider_<?= $key ?>"></a>
                                            <a class="bx-ui-slider-handle right" style="right:0;"
                                               href="javascript:void(0)" id="right_slider_<?= $key ?>"></a>
                                        </div>
                                    </div>

                                    <!--                                    </div>-->

                                    <!--                            </div>-->
                                </div>
                            <?
                            $arJsParams = array(
                                "leftSlider" => 'left_slider_' . $key,
                                "rightSlider" => 'right_slider_' . $key,
                                "tracker" => "drag_tracker_" . $key,
                                "trackerWrap" => "drag_track_" . $key,
                                "minInputId" => $arItem["VALUES"]["MIN"]["CONTROL_ID"],
                                "maxInputId" => $arItem["VALUES"]["MAX"]["CONTROL_ID"],
                                "minPrice" => $arItem["VALUES"]["MIN"]["VALUE"],
                                "maxPrice" => $arItem["VALUES"]["MAX"]["VALUE"],
                                "curMinPrice" => $arItem["VALUES"]["MIN"]["HTML_VALUE"],
                                "curMaxPrice" => $arItem["VALUES"]["MAX"]["HTML_VALUE"],
                                "fltMinPrice" => intval($arItem["VALUES"]["MIN"]["FILTERED_VALUE"]) ? $arItem["VALUES"]["MIN"]["FILTERED_VALUE"] : $arItem["VALUES"]["MIN"]["VALUE"],
                                "fltMaxPrice" => intval($arItem["VALUES"]["MAX"]["FILTERED_VALUE"]) ? $arItem["VALUES"]["MAX"]["FILTERED_VALUE"] : $arItem["VALUES"]["MAX"]["VALUE"],
                                "precision" => $precision,
                                "colorUnavailableActive" => 'colorUnavailableActive_' . $key,
                                "colorAvailableActive" => 'colorAvailableActive_' . $key,
                                "colorAvailableInactive" => 'colorAvailableInactive_' . $key,
                            );
                            ?>
                                <script>
                                    BX.ready(function () {
                                        window['trackBar<?=$key?>'] = new BX.Iblock.SmartFilter(<?=CUtil::PhpToJSObject($arJsParams)?>);
                                    });
                                </script>
                            <?endif;
                        }


                        ?>
                    </div>
                        <div class="filter__wrap filter__wrap--right">

                            <?

                            //not prices
                            foreach ($arResult["ITEMS"] as $key => $arItem) {
                            if (
                                empty($arItem["VALUES"])
                                || isset($arItem["PRICE"])
                            )
                                continue;

                            if (
                                $arItem["DISPLAY_TYPE"] === SectionPropertyTable::NUMBERS_WITH_SLIDER
                                && ($arItem["VALUES"]["MAX"]["VALUE"] - $arItem["VALUES"]["MIN"]["VALUE"] <= 0)
                            )
                                continue;
                            ?>

                            <?
                            $arCur = current($arItem["VALUES"]);
                            if ($arItem["NAME"] !== "Высокие грунтовые воды" && $arItem["NAME"] !== "Тип накопления"){ ?>
                                <div class="filter__item js-filter-group">
                                    <div class="filter__item-name"><?= $arItem["NAME"] ?></div>
                                    <div class="filter__item-list" data-role="bx_filter_block">
                                        <?

                                        switch ($arItem["DISPLAY_TYPE"]) {
                                        case SectionPropertyTable::NUMBERS_WITH_SLIDER://NUMBERS_WITH_SLIDER
                                            ?>
                                            <!--                                <div class="col-xs-6 bx-filter-parameters-box-container-block bx-left">-->
                                            <!--                                    <i class="bx-ft-sub">--><?php //=GetMessage("CT_BCSF_FILTER_FROM")
                                                                                                            ?><!--</i>-->
                                            <!--                                    <div class="bx-filter-input-container">-->
                                            <!--                                        <input-->
                                            <!--                                                class="min-price"-->
                                            <!--                                                type="text"-->
                                            <!--                                                name="--><?//echo $arItem["VALUES"]["MIN"]["CONTROL_NAME"]
                                                                                                         ?><!--"-->
                                            <!--                                                id="--><?//echo $arItem["VALUES"]["MIN"]["CONTROL_ID"]
                                                                                                       ?><!--"-->
                                            <!--                                                value="--><?//echo $arItem["VALUES"]["MIN"]["HTML_VALUE"]
                                                                                                          ?><!--"-->
                                            <!--                                                size="5"-->
                                            <!--                                                onkeyup="smartFilter.keyup(this)"-->
                                            <!--                                        />-->
                                            <!--                                    </div>-->
                                            <!--                                </div>-->
                                            <!--                                <div class="col-xs-6 bx-filter-parameters-box-container-block bx-right">-->
                                            <!--                                    <i class="bx-ft-sub">--><?php //=GetMessage("CT_BCSF_FILTER_TO")
                                                                                                            ?><!--</i>-->
                                            <!--                                    <div class="bx-filter-input-container">-->
                                            <!--                                        <input-->
                                            <!--                                                class="max-price"-->
                                            <!--                                                type="text"-->
                                            <!--                                                name="--><?//echo $arItem["VALUES"]["MAX"]["CONTROL_NAME"]
                                                                                                         ?><!--"-->
                                            <!--                                                id="--><?//echo $arItem["VALUES"]["MAX"]["CONTROL_ID"]
                                                                                                       ?><!--"-->
                                            <!--                                                value="--><?//echo $arItem["VALUES"]["MAX"]["HTML_VALUE"]
                                                                                                          ?><!--"-->
                                            <!--                                                size="5"-->
                                            <!--                                                onkeyup="smartFilter.keyup(this)"-->
                                            <!--                                        />-->
                                            <!--                                    </div>-->
                                            <!--                                </div>-->
                                            <div class="range__control">
                                                <div class="range__control-item">
                                                    <?= GetMessage("CT_BCSF_FILTER_FROM") ?>
                                                    <input class="range__control-input js-input-from"
                                                           id="<? echo $arItem["VALUES"]["MIN"]["CONTROL_ID"] ?>"
                                                           type="text"
                                                           name="<? echo $arItem["VALUES"]["MIN"]["CONTROL_NAME"] ?>"
                                                           placeholder="<?=$arItem["VALUES"]["MIN"]["VALUE"]?>"
                                                           value="<?= $arItem["VALUES"]["MIN"]["HTML_VALUE"]?>"
                                                           onkeyup="smartFilter.keyup(this)">
                                                </div>
                                                <div class="range__control-item">
                                                    &mdash; <?= GetMessage("CT_BCSF_FILTER_TO") ?>
                                                    <input class="range__control-input js-input-to"
                                                           type="text"
                                                           name="<? echo $arItem["VALUES"]["MAX"]["CONTROL_NAME"]?>"
                                                           id="<? echo $arItem["VALUES"]["MAX"]["CONTROL_ID"]?>"
                                                           placeholder="<?=$arItem["VALUES"]["MAX"]["VALUE"]?>"
                                                           value="<?= $arItem["VALUES"]["MAX"]["HTML_VALUE"]?>"
                                                           onkeyup="smartFilter.keyup(this)">

                                                </div>
                                            </div>


                                            <div class="bx-ui-slider-track" id="drag_track_<?= $key ?>">
                                                <?
                                                $precision = $arItem["DECIMALS"] ? $arItem["DECIMALS"] : 0;
                                                $step = ($arItem["VALUES"]["MAX"]["VALUE"] - $arItem["VALUES"]["MIN"]["VALUE"]) / 4;
                                                //                                        $value1 = number_format($arItem["VALUES"]["MIN"]["VALUE"], $precision, ".", "");
                                                //                                        $value2 = number_format($arItem["VALUES"]["MIN"]["VALUE"] + $step, $precision, ".", "");
                                                //                                        $value3 = number_format($arItem["VALUES"]["MIN"]["VALUE"] + $step * 2, $precision, ".", "");
                                                //                                        $value4 = number_format($arItem["VALUES"]["MIN"]["VALUE"] + $step * 3, $precision, ".", "");
                                                //                                        $value5 = number_format($arItem["VALUES"]["MAX"]["VALUE"], $precision, ".", "");
                                                ?>
                                                <!--                                        <div class="bx-ui-slider-part p1"><span>-->
                                                <?php //=$value1
                                                ?><!--</span></div>-->
                                                <!--                                        <div class="bx-ui-slider-part p2"><span>-->
                                                <?php //=$value2
                                                ?><!--</span></div>-->
                                                <!--                                        <div class="bx-ui-slider-part p3"><span>-->
                                                <?php //=$value3
                                                ?><!--</span></div>-->
                                                <!--                                        <div class="bx-ui-slider-part p4"><span>-->
                                                <?php //=$value4
                                                ?><!--</span></div>-->
                                                <!--                                        <div class="bx-ui-slider-part p5"><span>-->
                                                <?php //=$value5
                                                ?><!--</span></div>-->

                                                <div class="bx-ui-slider-pricebar-vd" style="left: 0;right: 0;"
                                                     id="colorUnavailableActive_<?= $key ?>"></div>
                                                <div class="bx-ui-slider-pricebar-vn" style="left: 0;right: 0;"
                                                     id="colorAvailableInactive_<?= $key ?>"></div>
                                                <div class="bx-ui-slider-pricebar-v" style="left: 0;right: 0;"
                                                     id="colorAvailableActive_<?= $key ?>"></div>
                                                <div class="bx-ui-slider-range" id="drag_tracker_<?= $key ?>"
                                                     style="left: 0;right: 0;">
                                                    <a class="bx-ui-slider-handle left" style="left:0;"
                                                       href="javascript:void(0)" id="left_slider_<?= $key ?>"></a>
                                                    <a class="bx-ui-slider-handle right" style="right:0;"
                                                       href="javascript:void(0)" id="right_slider_<?= $key ?>"></a>
                                                </div>
                                            </div>

                                        <?
                                        $arJsParams = array(
                                            "leftSlider" => 'left_slider_' . $key,
                                            "rightSlider" => 'right_slider_' . $key,
                                            "tracker" => "drag_tracker_" . $key,
                                            "trackerWrap" => "drag_track_" . $key,
                                            "minInputId" => $arItem["VALUES"]["MIN"]["CONTROL_ID"],
                                            "maxInputId" => $arItem["VALUES"]["MAX"]["CONTROL_ID"],
                                            "minPrice" => $arItem["VALUES"]["MIN"]["VALUE"],
                                            "maxPrice" => $arItem["VALUES"]["MAX"]["VALUE"],
                                            "curMinPrice" => $arItem["VALUES"]["MIN"]["HTML_VALUE"],
                                            "curMaxPrice" => $arItem["VALUES"]["MAX"]["HTML_VALUE"],
                                            "fltMinPrice" => intval($arItem["VALUES"]["MIN"]["FILTERED_VALUE"]) ? $arItem["VALUES"]["MIN"]["FILTERED_VALUE"] : $arItem["VALUES"]["MIN"]["VALUE"],
                                            "fltMaxPrice" => intval($arItem["VALUES"]["MAX"]["FILTERED_VALUE"]) ? $arItem["VALUES"]["MAX"]["FILTERED_VALUE"] : $arItem["VALUES"]["MAX"]["VALUE"],
                                            "precision" => $arItem["DECIMALS"] ? $arItem["DECIMALS"] : 0,
                                            "colorUnavailableActive" => 'colorUnavailableActive_' . $key,
                                            "colorAvailableActive" => 'colorAvailableActive_' . $key,
                                            "colorAvailableInactive" => 'colorAvailableInactive_' . $key,
                                        );
                                        ?>
                                            <script>
                                                BX.ready(function () {
                                                    window['trackBar<?=$key?>'] = new BX.Iblock.SmartFilter(<?=CUtil::PhpToJSObject($arJsParams)?>);
                                                });
                                            </script>
                                        <?
                                        break;
                                        case SectionPropertyTable::NUMBERS://NUMBERS
                                        ?>
                                            <div class="col-xs-6 bx-filter-parameters-box-container-block bx-left">
                                                <i class="bx-ft-sub"><?= GetMessage("CT_BCSF_FILTER_FROM") ?></i>
                                                <div class="bx-filter-input-container">
                                                    <input
                                                            class="min-price"
                                                            type="text"
                                                            name="<? echo $arItem["VALUES"]["MIN"]["CONTROL_NAME"] ?>"
                                                            id="<? echo $arItem["VALUES"]["MIN"]["CONTROL_ID"] ?>"
                                                            value="<? echo $arItem["VALUES"]["MIN"]["HTML_VALUE"] ?>"
                                                            size="5"
                                                            onkeyup="smartFilter.keyup(this)"
                                                    />
                                                </div>
                                            </div>
                                            <div class="col-xs-6 bx-filter-parameters-box-container-block bx-right">
                                                <i class="bx-ft-sub"><?= GetMessage("CT_BCSF_FILTER_TO") ?></i>
                                                <div class="bx-filter-input-container">
                                                    <input
                                                            class="max-price"
                                                            type="text"
                                                            name="<? echo $arItem["VALUES"]["MAX"]["CONTROL_NAME"] ?>"
                                                            id="<? echo $arItem["VALUES"]["MAX"]["CONTROL_ID"] ?>"
                                                            value="<? echo $arItem["VALUES"]["MAX"]["HTML_VALUE"] ?>"
                                                            size="5"
                                                            onkeyup="smartFilter.keyup(this)"
                                                    />
                                                </div>
                                            </div>
                                        <?
                                        break;
                                        case SectionPropertyTable::CHECKBOXES_WITH_PICTURES://CHECKBOXES_WITH_PICTURES
                                        ?>
                                            <div class="col-xs-12">

                                                <div class="bx-filter-param-btn-inline">
                                                    <? foreach ($arItem["VALUES"] as $val => $ar): ?>
                                                        <input
                                                                style="display: none"
                                                                type="checkbox"
                                                                name="<?= $ar["CONTROL_NAME"] ?>"
                                                                id="<?= $ar["CONTROL_ID"] ?>"
                                                                value="<?= $ar["HTML_VALUE"] ?>"
                                                            <? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
                                                        />
                                                        <?
                                                        $class = "";
                                                        if ($ar["CHECKED"])
                                                            $class .= " bx-active";
                                                        if ($ar["DISABLED"])
                                                            $class .= " disabled";
                                                        ?>
                                                        <label for="<?= $ar["CONTROL_ID"] ?>"
                                                               data-role="label_<?= $ar["CONTROL_ID"] ?>"
                                                               class="bx-filter-param-label <?= $class ?>"
                                                               onclick="smartFilter.keyup(BX('<?= CUtil::JSEscape($ar["CONTROL_ID"]) ?>')); BX.toggleClass(this, 'bx-active');">
												<span class="bx-filter-param-btn bx-color-sl">
													<? if (isset($ar["FILE"]) && !empty($ar["FILE"]["SRC"])): ?>
                                                        <span class="bx-filter-btn-color-icon"
                                                              style="background-image:url('<?= $ar["FILE"]["SRC"] ?>');"></span>
                                                    <? endif ?>
												</span>
                                                        </label>
                                                    <? endforeach ?>
                                                </div>
                                            </div>
                                        <?
                                        break;
                                        case SectionPropertyTable::CHECKBOXES_WITH_PICTURES_AND_LABELS://CHECKBOXES_WITH_PICTURES_AND_LABELS
                                        ?>
                                            <div class="col-xs-12">
                                                <div class="bx-filter-param-btn-block">
                                                    <? foreach ($arItem["VALUES"] as $val => $ar): ?>
                                                        <input
                                                                style="display: none"
                                                                type="checkbox"
                                                                name="<?= $ar["CONTROL_NAME"] ?>"
                                                                id="<?= $ar["CONTROL_ID"] ?>"
                                                                value="<?= $ar["HTML_VALUE"] ?>"
                                                            <? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
                                                        />
                                                        <?
                                                        $class = "";
                                                        if ($ar["CHECKED"])
                                                            $class .= " bx-active";
                                                        if ($ar["DISABLED"])
                                                            $class .= " disabled";
                                                        ?>
                                                        <label for="<?= $ar["CONTROL_ID"] ?>"
                                                               data-role="label_<?= $ar["CONTROL_ID"] ?>"
                                                               class="bx-filter-param-label<?= $class ?>"
                                                               onclick="smartFilter.keyup(BX('<?= CUtil::JSEscape($ar["CONTROL_ID"]) ?>')); BX.toggleClass(this, 'bx-active');">
												<span class="bx-filter-param-btn bx-color-sl">
													<? if (isset($ar["FILE"]) && !empty($ar["FILE"]["SRC"])): ?>
                                                        <span class="bx-filter-btn-color-icon"
                                                              style="background-image:url('<?= $ar["FILE"]["SRC"] ?>');"></span>
                                                    <? endif ?>
												</span>
                                                            <span class="bx-filter-param-text"
                                                                  title="<?= $ar["VALUE"]; ?>"><?= $ar["VALUE"]; ?><?
                                                                if ($arParams["DISPLAY_ELEMENT_COUNT"] !== "N" && isset($ar["ELEMENT_COUNT"])):
                                                                    ?> (<span
                                                                        data-role="count_<?= $ar["CONTROL_ID"] ?>"><? echo $ar["ELEMENT_COUNT"]; ?></span>)<?
                                                                endif; ?></span>
                                                        </label>
                                                    <? endforeach ?>
                                                </div>
                                            </div>
                                        <?
                                        break;
                                        case SectionPropertyTable::DROPDOWN://DROPDOWN
                                        $checkedItemExist = false;
                                        ?>
                                            <div class="col-xs-12">
                                                <div class="bx-filter-select-container">
                                                    <div class="bx-filter-select-block"
                                                         onclick="smartFilter.showDropDownPopup(this, '<?= CUtil::JSEscape($key) ?>')">
                                                        <div class="bx-filter-select-text" data-role="currentOption">
                                                            <?
                                                            foreach ($arItem["VALUES"] as $val => $ar) {
                                                                if ($ar["CHECKED"]) {
                                                                    echo $ar["VALUE"];
                                                                    $checkedItemExist = true;
                                                                }
                                                            }
                                                            if (!$checkedItemExist) {
                                                                echo GetMessage("CT_BCSF_FILTER_ALL");
                                                            }
                                                            ?>
                                                        </div>
                                                        <div class="bx-filter-select-arrow"></div>
                                                        <input
                                                                style="display: none"
                                                                type="radio"
                                                                name="<?= $arCur["CONTROL_NAME_ALT"] ?>"
                                                                id="<? echo "all_" . $arCur["CONTROL_ID"] ?>"
                                                                value=""
                                                        />
                                                        <? foreach ($arItem["VALUES"] as $val => $ar): ?>
                                                            <input
                                                                    style="display: none"
                                                                    type="radio"
                                                                    name="<?= $ar["CONTROL_NAME_ALT"] ?>"
                                                                    id="<?= $ar["CONTROL_ID"] ?>"
                                                                    value="<? echo $ar["HTML_VALUE_ALT"] ?>"
                                                                <? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
                                                            />
                                                        <? endforeach ?>
                                                        <div class="bx-filter-select-popup" data-role="dropdownContent"
                                                             style="display: none;">
                                                            <ul>
                                                                <li>
                                                                    <label for="<?= "all_" . $arCur["CONTROL_ID"] ?>"
                                                                           class="bx-filter-param-label"
                                                                           data-role="label_<?= "all_" . $arCur["CONTROL_ID"] ?>"
                                                                           onclick="smartFilter.selectDropDownItem(this, '<?= CUtil::JSEscape("all_" . $arCur["CONTROL_ID"]) ?>')">
                                                                        <? echo GetMessage("CT_BCSF_FILTER_ALL"); ?>
                                                                    </label>
                                                                </li>
                                                                <?
                                                                foreach ($arItem["VALUES"] as $val => $ar):
                                                                    $class = "";
                                                                    if ($ar["CHECKED"])
                                                                        $class .= " selected";
                                                                    if ($ar["DISABLED"])
                                                                        $class .= " disabled";
                                                                    ?>
                                                                    <li>
                                                                        <label for="<?= $ar["CONTROL_ID"] ?>"
                                                                               class="bx-filter-param-label<?= $class ?>"
                                                                               data-role="label_<?= $ar["CONTROL_ID"] ?>"
                                                                               onclick="smartFilter.selectDropDownItem(this, '<?= CUtil::JSEscape($ar["CONTROL_ID"]) ?>')"><?= $ar["VALUE"] ?></label>
                                                                    </li>
                                                                <? endforeach ?>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        <?
                                        break;
                                        case SectionPropertyTable::DROPDOWN_WITH_PICTURES_AND_LABELS://DROPDOWN_WITH_PICTURES_AND_LABELS
                                        ?>
                                            <div class="col-xs-12">
                                                <div class="bx-filter-select-container">
                                                    <div class="bx-filter-select-block"
                                                         onclick="smartFilter.showDropDownPopup(this, '<?= CUtil::JSEscape($key) ?>')">
                                                        <div class="bx-filter-select-text fix"
                                                             data-role="currentOption">
                                                            <?
                                                            $checkedItemExist = false;
                                                            foreach ($arItem["VALUES"] as $val => $ar):
                                                                if ($ar["CHECKED"]) {
                                                                    ?>
                                                                    <? if (isset($ar["FILE"]) && !empty($ar["FILE"]["SRC"])): ?>
                                                                        <span class="bx-filter-btn-color-icon"
                                                                              style="background-image:url('<?= $ar["FILE"]["SRC"] ?>');"></span>
                                                                    <? endif ?>
                                                                    <span class="bx-filter-param-text">
																<?= $ar["VALUE"] ?>
															</span>
                                                                    <?
                                                                    $checkedItemExist = true;
                                                                }
                                                            endforeach;
                                                            if (!$checkedItemExist) {
                                                                ?><span class="bx-filter-btn-color-icon all"></span> <?
                                                                echo GetMessage("CT_BCSF_FILTER_ALL");
                                                            }
                                                            ?>
                                                        </div>
                                                        <div class="bx-filter-select-arrow"></div>
                                                        <input
                                                                style="display: none"
                                                                type="radio"
                                                                name="<?= $arCur["CONTROL_NAME_ALT"] ?>"
                                                                id="<? echo "all_" . $arCur["CONTROL_ID"] ?>"
                                                                value=""
                                                        />
                                                        <? foreach ($arItem["VALUES"] as $val => $ar): ?>
                                                            <input
                                                                    style="display: none"
                                                                    type="radio"
                                                                    name="<?= $ar["CONTROL_NAME_ALT"] ?>"
                                                                    id="<?= $ar["CONTROL_ID"] ?>"
                                                                    value="<?= $ar["HTML_VALUE_ALT"] ?>"
                                                                <? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
                                                            />
                                                        <? endforeach ?>
                                                        <div class="bx-filter-select-popup" data-role="dropdownContent"
                                                             style="display: none">
                                                            <ul>
                                                                <li style="border-bottom: 1px solid #e5e5e5;padding-bottom: 5px;margin-bottom: 5px;">
                                                                    <label for="<?= "all_" . $arCur["CONTROL_ID"] ?>"
                                                                           class="bx-filter-param-label"
                                                                           data-role="label_<?= "all_" . $arCur["CONTROL_ID"] ?>"
                                                                           onclick="smartFilter.selectDropDownItem(this, '<?= CUtil::JSEscape("all_" . $arCur["CONTROL_ID"]) ?>')">
                                                                        <span class="bx-filter-btn-color-icon all"></span>
                                                                        <? echo GetMessage("CT_BCSF_FILTER_ALL"); ?>
                                                                    </label>
                                                                </li>
                                                                <?
                                                                foreach ($arItem["VALUES"] as $val => $ar):
                                                                    $class = "";
                                                                    if ($ar["CHECKED"])
                                                                        $class .= " selected";
                                                                    if ($ar["DISABLED"])
                                                                        $class .= " disabled";
                                                                    ?>
                                                                    <li>
                                                                        <label for="<?= $ar["CONTROL_ID"] ?>"
                                                                               data-role="label_<?= $ar["CONTROL_ID"] ?>"
                                                                               class="bx-filter-param-label<?= $class ?>"
                                                                               onclick="smartFilter.selectDropDownItem(this, '<?= CUtil::JSEscape($ar["CONTROL_ID"]) ?>')">
                                                                            <? if (isset($ar["FILE"]) && !empty($ar["FILE"]["SRC"])): ?>
                                                                                <span class="bx-filter-btn-color-icon"
                                                                                      style="background-image:url('<?= $ar["FILE"]["SRC"] ?>');"></span>
                                                                            <? endif ?>
                                                                            <span class="bx-filter-param-text">
																	<?= $ar["VALUE"] ?>
																</span>
                                                                        </label>
                                                                    </li>
                                                                <? endforeach ?>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        <?
                                        break;
                                        case SectionPropertyTable::RADIO_BUTTONS://RADIO_BUTTONS
                                        ?>
                                            <div class="col-xs-12">
                                                <div class="radio">
                                                    <label class="bx-filter-param-label"
                                                           for="<? echo "all_" . $arCur["CONTROL_ID"] ?>">
												<span class="bx-filter-input-checkbox">
													<input
                                                            type="radio"
                                                            value=""
                                                            name="<? echo $arCur["CONTROL_NAME_ALT"] ?>"
                                                            id="<? echo "all_" . $arCur["CONTROL_ID"] ?>"
                                                            onclick="smartFilter.click(this)"
                                                    />
													<span class="bx-filter-param-text"><? echo GetMessage("CT_BCSF_FILTER_ALL"); ?></span>
												</span>
                                                    </label>
                                                </div>
                                                <? foreach ($arItem["VALUES"] as $val => $ar): ?>
                                                    <div class="radio">
                                                        <label data-role="label_<?= $ar["CONTROL_ID"] ?>"
                                                               class="bx-filter-param-label"
                                                               for="<? echo $ar["CONTROL_ID"] ?>">
													<span class="bx-filter-input-checkbox <? echo $ar["DISABLED"] ? 'disabled' : '' ?>">
														<input
                                                                type="radio"
                                                                value="<? echo $ar["HTML_VALUE_ALT"] ?>"
                                                                name="<? echo $ar["CONTROL_NAME_ALT"] ?>"
                                                                id="<? echo $ar["CONTROL_ID"] ?>"
															<? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
															onclick="smartFilter.click(this)"
                                                        />
														<span class="bx-filter-param-text"
                                                              title="<?= $ar["VALUE"]; ?>"><?= $ar["VALUE"]; ?><?
                                                            if ($arParams["DISPLAY_ELEMENT_COUNT"] !== "N" && isset($ar["ELEMENT_COUNT"])):
                                                                ?>&nbsp;(<span
                                                                    data-role="count_<?= $ar["CONTROL_ID"] ?>"><? echo $ar["ELEMENT_COUNT"]; ?></span>)<?
                                                            endif; ?></span>
													</span>
                                                        </label>
                                                    </div>
                                                <? endforeach; ?>
                                            </div>
                                        <?
                                        break;
                                        case SectionPropertyTable::CALENDAR://CALENDAR
                                        ?>
                                            <div class="col-xs-12">
                                                <div class="bx-filter-parameters-box-container-block">
                                                    <div class="bx-filter-input-container bx-filter-calendar-container">
                                                        <? $APPLICATION->IncludeComponent(
                                                            'bitrix:main.calendar',
                                                            '',
                                                            array(
                                                                'FORM_NAME' => $arResult["FILTER_NAME"] . "_form",
                                                                'SHOW_INPUT' => 'Y',
                                                                'INPUT_ADDITIONAL_ATTR' => 'class="calendar" placeholder="' . FormatDate("SHORT", $arItem["VALUES"]["MIN"]["VALUE"]) . '" onkeyup="smartFilter.keyup(this)" onchange="smartFilter.keyup(this)"',
                                                                'INPUT_NAME' => $arItem["VALUES"]["MIN"]["CONTROL_NAME"],
                                                                'INPUT_VALUE' => $arItem["VALUES"]["MIN"]["HTML_VALUE"],
                                                                'SHOW_TIME' => 'N',
                                                                'HIDE_TIMEBAR' => 'Y',
                                                            ),
                                                            null,
                                                            array('HIDE_ICONS' => 'Y')
                                                        ); ?>
                                                    </div>
                                                </div>
                                                <div class="bx-filter-parameters-box-container-block">
                                                    <div class="bx-filter-input-container bx-filter-calendar-container">
                                                        <? $APPLICATION->IncludeComponent(
                                                            'bitrix:main.calendar',
                                                            '',
                                                            array(
                                                                'FORM_NAME' => $arResult["FILTER_NAME"] . "_form",
                                                                'SHOW_INPUT' => 'Y',
                                                                'INPUT_ADDITIONAL_ATTR' => 'class="calendar" placeholder="' . FormatDate("SHORT", $arItem["VALUES"]["MAX"]["VALUE"]) . '" onkeyup="smartFilter.keyup(this)" onchange="smartFilter.keyup(this)"',
                                                                'INPUT_NAME' => $arItem["VALUES"]["MAX"]["CONTROL_NAME"],
                                                                'INPUT_VALUE' => $arItem["VALUES"]["MAX"]["HTML_VALUE"],
                                                                'SHOW_TIME' => 'N',
                                                                'HIDE_TIMEBAR' => 'Y',
                                                            ),
                                                            null,
                                                            array('HIDE_ICONS' => 'Y')
                                                        ); ?>
                                                    </div>
                                                </div>
                                            </div>
                                        <?
                                        break;
                                        default://CHECKBOXES
                                        ?>


                                        <? foreach ($arItem["VALUES"] as $val => $ar):?>
                                            <div class="filter__item-wrap">


                                                <label class="custom-checkbox">
                                                    <input
                                                            type="checkbox"
                                                            value="<? echo $ar["HTML_VALUE"] ?>"
                                                            name="<? echo $ar["CONTROL_NAME"] ?>"
                                                            id="<? echo $ar["CONTROL_ID"] ?>"
                                                        <? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
                                                            onclick="smartFilter.click(this);"

                                                    />
                                                    <?= $ar["VALUE"]; ?>
                                                </label>
                                                <!--														<span class="bx-filter-param-text"-->
                                                <!--                                                              title="-->
                                                <?php //= $ar["VALUE"]; ?><!--">--><?php //= $ar["VALUE"]; ?><!---->
                                                <? //
                                                //                                                            if ($arParams["DISPLAY_ELEMENT_COUNT"] !== "N" && isset($ar["ELEMENT_COUNT"])):
                                                //                                                                ?><!--&nbsp;(<span-->
                                                <!--                                                                    data-role="count_-->
                                                <?php //= $ar["CONTROL_ID"] ?><!--">-->
                                                <? // echo $ar["ELEMENT_COUNT"]; ?><!--</span>)--><? //
                                                //                                                            endif; ?><!--</span>-->


                                            </div>
                                        <? endforeach; ?>

                                        <?
                                        }
                                        ?>
                                    </div>
                                </div>
                                <?
                            }
                            else { ?>
                            <div class="filter__item js-filter-group">

                                <div class="filter__item-list" data-role="bx_filter_block">
                                    <?
                                    switch ($arItem["DISPLAY_TYPE"]) {
                                        default://CHECKBOXES
                                            ?>
                                            <? foreach ($arItem["VALUES"] as $val => $ar): ?>
                                            <div class="filter__item-wrap">
                                                <label class="switcher">
                                                    <input
                                                            type="checkbox"
                                                            value="<? echo $ar["HTML_VALUE"] ?>"
                                                            name="<? echo $ar["CONTROL_NAME"] ?>"
                                                            id="<? echo $ar["CONTROL_ID"] ?>"
                                                        <? echo $ar["CHECKED"] ? 'checked="checked"' : '' ?>
                                                            onclick="smartFilter.click(this);"
                                                    />
                                                    <?= $ar["VALUE"]; ?>
                                                </label>
                                            </div>
                                        <? endforeach; ?>

                                        <?
                                    }
                                    ?>
                                </div>
                            </div>
                            <?
                            }
                            }
                            ?>
                        </div>
                        <div class="row">
                            <div class="col-xs-12 bx-filter-button-box">
                                <div class="bx-filter-block">
                                    <div class="bx-filter-parameters-box-container">
                                        <input
                                                class="btn btn-themes"
                                                type="submit"
                                                id="set_filter"
                                                name="set_filter"
                                                value="<?= GetMessage("CT_BCSF_SET_FILTER") ?>"
                                                style="display: none"
                                        />
                                        <input
                                                class="button button--outline"
                                                type="submit"
                                                id="del_filter"
                                                name="del_filter"
                                                value="<?= GetMessage("CT_BCSF_DEL_FILTER") ?>"
                                        />
                                        <div class="bx-filter-popup-result <? if ($arParams["FILTER_VIEW_MODE"] == "VERTICAL") echo $arParams["POPUP_POSITION"] ?>"
                                             id="modef" <? if (!isset($arResult["ELEMENT_COUNT"])) echo 'style="display:none"'; ?>
                                             style="display: inline-block;">
                                            <? echo GetMessage("CT_BCSF_FILTER_COUNT", array("#ELEMENT_COUNT#" => '<span id="modef_num">' . (int)($arResult["ELEMENT_COUNT"] ?? 0) . '</span>')); ?>
                                            <span class="arrow"></span>
                                            <br/>
                                            <a href="<? echo $arResult["FILTER_URL"] ?>"
                                               target=""><? echo GetMessage("CT_BCSF_FILTER_SHOW") ?></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="clb"></div>

                </div>
            </form>

        </div>
    </div>
</aside>
<?php
    array_walk_recursive($arResult, static function (&$item, $key) {
        $item = '/'. ltrim(str_replace(['/catalog', '/filter'], '', $item), '/');
    });
?>

<script>
    var smartFilter = new JCSmartFilter('<?= CUtil::JSEscape('')?>', '<?=CUtil::JSEscape($arParams["FILTER_VIEW_MODE"])?>', <?=CUtil::PhpToJSObject($arResult["JS_FILTER_PARAMS"])?>);
console.dir(smartFilter);
</script>
