if(typeof window.firstLoad === 'undefined') {
    // индикатор первой загрузки скриптов
    window.categoryJsScripts_FirstLoad = false
}

// скрипты страницы категории
window.categoryJsScripts = () => {
    /* Скрытие/показ списка сортировок при клике на бабл сортировки */
    let tabsWrapSelector = '.filters-n__bubles-wrap';

    /* Слайдер баблов */
    function scrollHorizontally(e) {
        e = window.event || e;
        var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
        document.querySelector(tabsWrapSelector).scrollLeft -= (delta*40); // Multiplied by 40
        e.preventDefault();
    }

    if(document.querySelector(tabsWrapSelector)) {
        if (document.querySelector(tabsWrapSelector).addEventListener) {
            // IE9, Chrome, Safari, Opera
            document.querySelector(tabsWrapSelector).addEventListener("mousewheel", scrollHorizontally, false);
            // Firefox
            document.querySelector(tabsWrapSelector).addEventListener("DOMMouseScroll", scrollHorizontally, false);
        } else {
            // IE 6/7/8
            document.querySelector(tabsWrapSelector).attachEvent("onmousewheel", scrollHorizontally);
        }
    }

    function tabsArrowInit(el) {
        var items = $(el).find('.filters-n__bubles-item--active');

        if(items.length > 0) {
            var outerLeft = $(el).offset().left;
            var innerLeft = items.offset().left;

            var outerRight = $(el).offset().left + $(el).width();
            var innerRight = items.offset().left + items.width();

            var arrowLeft = $(el).find('.filters-n__bubles-arrow-left');
            var arrowRight = $(el).find('.filters-n__bubles-arrow-right');

            if((outerLeft - innerLeft) > 30) {
                arrowLeft.css('display', 'flex');
            } else {
                arrowLeft.hide();
            }

            if(parseInt(innerRight - outerRight) > 0) {
                arrowRight.css('display', 'flex');
            } else {
                arrowRight.hide();
            }
        }

        //console.log(`innerLeft: ${ innerLeft }`)
    }

    var tabsWrap = $(tabsWrapSelector);

    if(tabsWrap.length > 0) {
        $(window).on('load resize', function() {
            tabsArrowInit(tabsWrap);
        });

        tabsWrap.on('scroll', function (event) {
            tabsArrowInit(this);
        });
    }

    $('.filters-n__bubles-arrow').click(function () {
        let wrap = $(this).closest('.filters-n__bubles-wrap');
        let items = wrap.find('.filters-n__bubles-items');

        let startPosition = wrap.offset().left;
        let position = Math.abs(items.offset().left - startPosition);

        let start, end;
        let delta = 200;

        if($(this).hasClass('filters-n__bubles-arrow-left')) {
            start = position;
            end = position - delta;
        }

        if($(this).hasClass('filters-n__bubles-arrow-right')) {
            start = position;
            end = position + delta;
        }

        $({ numberValue: start }).animate({ numberValue: end }, {
            duration: 200,
            easing: "swing",

            step: function(val) {
                document.querySelector('.filters-n__bubles-wrap').scrollLeft = val;
            }
        });
    });

    /*
        Высчитывание положения ползунка при прокрутке баблов
    */

    let bublesWrapper = document.querySelector('.filters-n__bubles-wrap')

    function setScrollRunner(scrollLeft = 0) {
        let bublesWrapper = document.querySelector('.filters-n__bubles-wrap')
        let bublesItems = document.querySelector('.filters-n__bubles-item--active')
        let scrollRunner = document.querySelector('.filters-n__scroll-runner')

        // отношение ширины видимой области к прокручиваемой
        if(!bublesItems) {
            return;
        }

        var coef = bublesWrapper.clientWidth / bublesItems.clientWidth

        var left = coef * bublesWrapper.scrollLeft
        var right = (bublesItems.clientWidth - bublesWrapper.clientWidth - scrollLeft) * coef

        left = parseInt(left)
        right = parseInt(right)

        scrollRunner.style.left = left + 'px';
        scrollRunner.style.right = right + 'px';
    }

    setScrollRunner();

    bublesWrapper.addEventListener('scroll', function() {
        setScrollRunner(this.scrollLeft)
    });

    window.addEventListener('resize', function(event) {
        setScrollRunner();
    }, true);

    // загрузка данных со страницы категории по заданному урлу
    function loadAjaxResults(url) {
        if(window.location.search) {
            let urlParams = window.getAllUrlParams(url + window.location.search)

            try {
                // удаление ненужных параметров при запросе страницы
                urlParams = window.deleteUrlParam(urlParams, 'page')
                urlParams = window.deleteUrlParam(urlParams, 'query')

                let urlParamsString = window.joinUrlParams(urlParams)

                if(urlParamsString) {
                    url = url + '?' + urlParamsString
                }
            } catch (err) {
                console.log(err)
            }
        }

        // блок с результатами mSearch2
        let mse2ResultsJquery = $('#mse2_results')

        if(mse2ResultsJquery?.length === 0) {
            return;
        }

        // добавляем прозрачность
        prodpage.style.opacity = 0.5
        //mse2ResultsJquery.css('opacity', 0.5)


        // загрузка страницы категории по урлу
        axios({
            method: 'get',
            url: url,
            responseType: 'text',
            //data: params
        }).then((response) => {
            // подставляем урл в строку браузера
            window.history.pushState( {} , '', url);

            if(response?.data) {
                // поиск кода с title страницы
                var regex = /<title>(.+?)<\/title>/ms;
                var match = regex.exec(response.data);

                if(match?.[1]) {
                    $('title').html(match[1])
                }

                // поиск кода с карточками результатов
                var regex = /<!--mse2_results-->(.+)<!--mse2_results_end-->/ms;
                var match = regex.exec(response.data);

                if(match?.[1]) {
                    mse2ResultsJquery.html(match[1])
                } else {
                    mse2ResultsJquery.html('')
                }

                // поиск кода с количеством результатов
                var regex = /<!--mse2_results_total-->(.+)<!--mse2_results_total_end-->/ms;
                var match = regex.exec(response.data);

                if(match?.[1]) {
                    totalResults.innerHTML = match[1].trim()
                }

                // поиск кода с классами карточек товаров
                var regex = /<!--categorycard_size-->(.+)<!--categorycard_size_end-->/ms;
                var match = regex.exec(response.data);


                // выставление классов размеров карточек товаров
                if(match?.[1] && productCategoryWrapper) {
                    var classes = match[1]
                    classes = classes.split(/\s+/)

                    if(classes && classes.length > 0) {
                        let productCategoryWrapper_defaultClasses = productCategoryWrapper.getAttribute('data-default-classes')
                        productCategoryWrapper.setAttribute('class', productCategoryWrapper_defaultClasses);

                        classes.forEach((cssClass) => {
                            if(cssClass.trim()) {
                                productCategoryWrapper.classList.add(cssClass.trim())
                            }
                        })
                    }
                }

                // поиск кода с заголовком
                var regex = /<!--resource_title-->(.+)<!--resource_title_end-->/ms;
                var match = regex.exec(response.data);

                if(match?.[1]) {
                    resourceTitle.innerHTML = match[1].trim()
                }

                // поиск кода с хлебными крошками
                var regex = /<!--breadcrumbs_items-->(.+)<!--breadcrumbs_items_end-->/ms;
                var match = regex.exec(response.data);

                if(match?.[1]) {
                    breadCrumbs.innerHTML = match[1].trim()
                }

                // поиск кода с пагинацией
                let paginationJquery = $('.mse2_pagination')
                if(paginationJquery) {
                    var regex = /<!--pagination-->(.+)<!--pagination_end-->/ms;
                    var match = regex.exec(response.data);

                    if(match?.[1]) {
                        paginationJquery.html(match[1])
                        paginationJquery.css('opacity', 1)
                    }
                }

                // поиск кода с конфигом mSearch2
                var regex = /mse2Config\s*=\s*(\{.+?\})/ms;
                var match = regex.exec(response.data);

                if(match?.[1]) {
                    mse2Config = JSON.parse(match[1])
                }

                if(searchInput) {
                    // очистка строки поиска
                    searchInput.value = ''
                }


                // поиск кода с контентом низа страницы категории
                let bottomContent = $('.category-page-bottom')
                if(bottomContent) {
                    var regex = /<!--category_bottom-->(.+)<!--category_bottom_end-->/ms;
                    var match = regex.exec(response.data);

                    if(match?.[1]) {
                        bottomContent.html(match[1])
                    }
                }

                window.lazyLoadUpdate();

                tabsArrowInit(tabsWrap);



            }

            // добавляем прозрачность
            //mse2ResultsJquery.css('opacity', 1)
            prodpage.style.opacity = 1

            //console.log(response.data);
        }).catch(function (error) {
            //alert('Возникли проблемы с интернетом');
            console.log(error);
        });
    }

    // активность блока баблов
    function bublesActivity(filters) {
        let catActive = filters.querySelector('.filters-n__cats-item--active')
        let catIdx = ''

        if(catActive) {
            catIdx = catActive.getAttribute('data-idx')
        } else {
            return;
        }

        // устанавливаем активный бабл
        let activeBuble = filters.querySelector('.filters-n__bubles-item[data-idx="'+ catIdx +'"]')

        if(activeBuble) {
            if(activeBuble.innerHTML?.trim()) {
                filters.classList.add('filters-n__bubles-show')
                activeBuble.classList.add('filters-n__bubles-item--active')
            }
        }

        setScrollRunner()
    }

    /* Обработка клика по категориям */

    let prodpage = document.getElementById('pdopage')
    let filters = prodpage.querySelector('.filters-n')
    let circleCats = filters?.querySelectorAll('.filters-n__cats-item')
    let bubles = filters?.querySelectorAll('.filters-n__buble')
    let totalResults = filters.querySelector('.filters-n__sort-total')
    let resourceTitle = filters.querySelector('.title-n__title-h1')
    let breadCrumbs = prodpage.querySelector('.breadcrumbs-n')
    let productCategoryWrapper = prodpage.querySelector('.product-n--category-wrapper')
    let searchInput = filters?.querySelector('.filters-n__search-form input[name="query"]')

    if(circleCats) {
        circleCats.forEach((cat) => {
            cat.addEventListener('click', (event) => {
                // разделяем клик для перехода в категории, и клик для прокручивание области (см. elements/chunks/shop/category_new/filters/circle_cats/circle_cats.tpl)
                let scrollByMouse = cat.closest('.scrollByMouse--active')
                if(scrollByMouse) {
                    // только для десктопа
                    if(window.innerWidth > 1199) {
                        return;
                    }
                }

                let ajaxOff = cat.getAttribute('data-ajax-off')

                if(ajaxOff) {
                    return;
                }


                // категория уже активна - сбрасываем до корневой
                if(cat.classList.contains('filters-n__cats-item--active')) {
                    var resetUrl;
                    if(resetUrl = cat.getAttribute('data-reset-url')) {
                        //console.log('resetUrl', resetUrl)

                        cat.classList.remove('filters-n__cats-item--active')
                        deactivateBubles()
                        loadAjaxResults(resetUrl)
                    }

                    return;
                }

                cat.setAttribute('onclick', 'return false;')
                event.preventDefault();

                deactivateBubles()

                let currentActiveCat = filters.querySelector('.filters-n__cats-item--active')
                if(currentActiveCat) {
                    currentActiveCat.classList.remove('filters-n__cats-item--active')
                }

                cat.classList.add('filters-n__cats-item--active')

                bublesActivity(filters)

                // блокируем переход по ссылке и обновляем результаты аяксом
                let href = cat.getAttribute('href')
                if(href) {
                    loadAjaxResults(href)
                }
            });
        })
    }

    // деактивация всех баблов
    function deactivateBubles() {
        // отменяем активность у всех баблов
        let lastActiveBubles = filters.querySelectorAll('.filters-n__buble--active')

        lastActiveBubles.forEach((activeBuble) => {
            activeBuble.classList.remove('filters-n__buble--active')
        })

        // отменяем активность у текущего активного списка баблов
        let currentActiveBubles = filters.querySelectorAll('.filters-n__bubles-item--active')

        currentActiveBubles.forEach((activeBubles) => {
            activeBubles.classList.remove('filters-n__bubles-item--active')
        })

        // отменяем показ баблов
        let bublesShow = filters.parentNode.querySelector('.filters-n__bubles-show')

        if(bublesShow) {
            bublesShow.classList.remove('filters-n__bubles-show')
        }

        setScrollRunner()
    }

    if(bubles) {
        bubles.forEach((buble) => {
            buble.addEventListener('click', (event) => {
                // разделяем клик для перехода в категории, и клик для прокручивание области (см. elements/chunks/shop/category_new/filters/circle_cats/circle_cats.tpl)
                let scrollByMouse = buble.closest('.scrollByMouse--active')
                if(scrollByMouse) {
                    // только для десктопа
                    if(window.innerWidth > 1199) {
                        return;
                    }
                }

                if(buble.classList.contains('filters-n__buble--active')) {
                    let parentUrl = buble.getAttribute('data-parent-url')

                    if(parentUrl) {
                        buble.classList.remove('filters-n__buble--active')
                        loadAjaxResults(parentUrl)
                    }
                } else {
                    let href = buble.getAttribute('href');

                    if(href) {
                        deactivateBubles();
                        bublesActivity(filters);

                        buble.classList.add('filters-n__buble--active');

                        loadAjaxResults(href);
                    }
                }
            })
        })
    }

    /* Тултип */
    let cats = document.querySelectorAll('.filters-n__cats-item')

    if(cats) {
        cats.forEach((cat) => {
            cat.addEventListener('mouseover', (event) => {
                let idx = cat.getAttribute('data-idx')
                let selector = '.filters-n__cats-tooltipe-' + idx;

                let tt = document.querySelector(selector)

                if(tt) {
                    let ttText = tt.getAttribute('data-text')

                    if(ttText) {
                        const tipyInstance = tippy('.filters-n__cats-item[data-idx="'+ idx +'"]', {
                            allowHTML: true,
                            placement: 'bottom',
                            delay: [700, 0],
                            theme: 'dark',
                            trigger: 'mouseenter',
                            content: function (reference) {
                                return ttText
                            },
                        });
                    }
                }
            }, { once: true })
        })
    }
}

document.addEventListener("DOMContentLoaded", function(event) {
    window.categoryJsScripts()
    window.categoryJsScripts_FirstLoad = true
})

if(typeof window.categoryJsScripts_FirstLoad !== 'undefined' && window.categoryJsScripts_FirstLoad) {
    window.categoryJsScripts()
}


/**
 * Сортировка
 */

/* Скрытие/показ списка сортировок при клике на бабл сортировки */
document.addEventListener("DOMContentLoaded", function(event) {
    let filters = document.querySelector('.filters-n__sort-list')

    if(filters) {
        filters.onclick = () => {
            if(filters.classList.contains('filters-n__sort-list--active')) {
                filters.classList.remove('filters-n__sort-list--translate')

                setTimeout(() => {
                    filters.classList.remove('filters-n__sort-list--active')
                }, 200)
            } else {
                filters.classList.add('filters-n__sort-list--active')

                setTimeout(() => {
                    filters.classList.add('filters-n__sort-list--translate')
                }, 100)
            }
        }
    }

    /* Подстановка заголовка списка сортировки */
    $(document).on('mse2_load', function (e, data) {
        var active = $('.filters-n__sort-list-item.active')
        var titleEl = $('.filters-n__sort-header-title')
        var titleDefault = titleEl.attr('title-default')
        var title = titleDefault

        if(typeof active !== 'undefined' && active.length > 0) {
            title = active.attr('title-short')
        }

        titleEl.text(title)
    });
})

/* Скрытие списка при клике на остальной части документа вне бабла сортировки */
document.addEventListener('click', (e) => {
    if (!e.target.closest('.filters-n__sort-list')) {
        let filtersList = document.querySelector('.filters-n__sort-list--active')

        if(filtersList) {
            filtersList.classList.remove('filters-n__sort-list--translate')

            setTimeout(() => {
                filtersList.classList.remove('filters-n__sort-list--active')
            }, 200)
        }
    }
});

document.addEventListener('DOMContentLoaded', () => {
    /*
        Визуализация прокрутки фильтов
     */
    setTimeout(() => {
        let filtersEl = document.querySelector('.filters-n__cats-items')

        filtersEl.scrollBy({
            left: 150,
            behavior: 'smooth'
        })

        setTimeout(() => {
            // Прокрутка вправо
            filtersEl.scrollBy({
                left: -150,
                behavior: 'smooth'
            });
        }, 1000); // 1 секунду ожидания перед прокруткой вправо
    })

    /*
        Раскрытие поля поиска по клику на иконку поиска
     */
    setTimeout(() => {
        function searchExpand(status) {
            let filtersEl = $('.filters-n');
            let filtersSearchEl = $('.filters-n__search')

            if(status) {
                setTimeout(() => {
                    filtersSearchEl.find('input').focus();
                }, 100); // 100 миллисекунд задержки

                filtersEl.addClass('filters-n--search-focus')
                filtersSearchEl.removeClass('filters-n__search--category')
            } else {
                filtersEl.removeClass('filters-n--search-focus')
                filtersSearchEl.addClass('filters-n__search--category')
            }
        }

        // $('.filters-n__search-form input').focusin(() => {
        //     searchExpand(true)
        // })


        $('.filters-n__search--category-page .filters-n__search-form input').focusout(() => {
            searchExpand(false)
        })

        $('.filters-n__search-icon').click(() => {
            searchExpand(true)
        })
    })
});