'use strict';

jQuery(document).ready(function ($) {
    // OVERLAY 
    // $('.product__main').on('click', '.open-overlay', function () {
    //     let product = $(this).closest('.product__item'),
    //         overlay = product.find('.product-item__overlay');

    //     $('.product__item').find('.product-item__overlay').css('top', '100%');
    //     overlay.css('top', 0);
    // })
    // END OVERLAY

    // $('.product__main').on('click', '.state__button', function(evt) {
    //     evt.preventDefault();
    //     let product = $(this).closest('.product__item');
    //     let price = $(this).data('product_price');
    //     let id = $(this).data('product_id');
    //     let qty = product.find('.counter__input').val();
    //     product.find('.product-item-overlay__price').html(price * qty + ' ');
    //     product.find('.select__state').data('product_price', price).data('product_id', id).val($(this).text().trim());
    //     product.find('.state__block').removeClass('expanded').css('height', '0');

    //     product.find('.add_to_cart_button').detach();
    //     product.find('.product-item-overlay__button').prepend('<a href="?add-to-cart=' + id + '" data-quantity="' + qty +'" class="ajax_add_to_cart add_to_cart_button button button--gradient button--base button--100-perc" data-product_id="'+id+'">Добавить в корзину</a>');
    // })

    // $('.product__main').on('click', '.counter__button', function(evt) {
    //     evt.preventDefault();
    //     let product = $(this).closest('.product__item');
    //     let price = parseFloat(product.find('.select__state').data('product_price'));
       
    //     if (!price){
    //        price = parseFloat(product.find('.product-item__price p').html());
    //     }
    //     let qty = product.find('.counter__input');

    //     if ($(this).hasClass('minus') && parseInt(qty.val()) >= 2) {
    //         qty.val(parseInt(qty.val()) - 1);
    //     } else {
    //         if ($(this).hasClass('plus')) {
    //             qty.val(parseInt(qty.val()) + 1);
    //         }
    //     }
    //     product.find('.product-item-overlay__button a').attr('data-quantity', qty.val())
    //     product.find('.product-item-overlay__price').html(price * qty.val() + ' ');
    // })

    // $('.product__main').on('click', '.select__state', function(evt) {
    //     evt.preventDefault();
    //     let product = $(this).closest('.product__item'),
    //         listing = product.find('.state__block');

    //     if (listing.hasClass('expanded')) {
    //         listing.removeClass('expanded').css('height', '0');
    //     } else {
    //         listing.addClass('expanded').css('height', 'auto');
    //     }

    //     product.find('.state__block').find('.state__button').removeClass('active');
    //     product.find('.state__button').each(function () {
    //         if (product.find('.select__state').data('product_id') === $(this).data('product_id')) {
    //             $(this).addClass('active');
    //         }
    //     })
    // })


    // let page = 1;

    // jQuery('body').on('click', '#load-more-products', function(e) {
    //     e.preventDefault();
    //     page++;

    //     let category = $(this).data('category_id');
    //     let category_type = $(this).data('category_type');

    //     $.ajax({
    //         type: 'POST',
    //         url: '/wp-admin/admin-ajax.php',
    //         dataType: 'html',
    //         data: {
    //             'action' : 'get_products',
    //             'get_page' : page,
    //             'get_category' : category,
    //             'get_category_type' : category_type,
    //         },
    //         success: function(data) {
    //             // if($('<div></div>').html(data).find('.archive__item.ended').size() > 0) $('#load-more-products').parents('.cta').remove();
    //             // else $('#load-more-products').parents('.cta').show();

    //             $('#load-more-products').detach();
    //             $('.product__main').append(data);
    //             $('#load-more-products').prependTo('.product__footer');
    //         },
    //         error: function(data) {
    //             console.log(data);
    //         }
    //     });
    // });

    // $('.wpfMainWrapper').prepend('<div class="wpfFilters"></div>');
    // $('.wpfMainWrapper').find('.wpfFilterWrapper').appendTo($('.wpfFilters'));

    // $('.wpfFilterWrapper').each(function () {
    //     if ($(this).data('filter-type') === 'wpfPrice') {
    //         $(this).find('.wpfFilterContent').append('<div class="wpfExpandablePart"></div>');
    //         $(this).find('.wpfPriceFilterRange').appendTo('.wpfExpandablePart');
    //         $(this).find('.wpfPriceInputs').appendTo('.wpfExpandablePart');

    //         $(this).find('.wpfCurrencySymbol').detach();
    //         $(this).find('.wpfFilterDelimeter').detach();
    //     }
    // });
    
    // $('.wfpDescription').on('click', function () {
    //     $(this).closest('.wpfFilterWrapper').toggleClass('expanded').find('.wpfCheckboxHier').slideToggle();
    //     $(this).parent().find('.wpfExpandablePart').slideToggle();
    // })


})








// header
toggleOpenX('.lang', '.lang__open', '.lang__list', '.lang__content', false);
toggleHeader('#pc-menu','.header__menu-block','.header__pc-menu', '.white', 'white');
toggleHeader('#phone-menu','.header__menu-block','.header__phone-menu', '.white', 'white');
// header 

// modal

// toggle
toggleOpenX('.toggle', '.toggle__title', '.toggle__content', '.toggle__block-content', true);
// toggle


// overlay
let products = document.querySelectorAll('.product__item');

products.forEach(productItem => {
    let button = productItem.querySelector('.open-overlay'),
        overlay = productItem.querySelector('.product-item__overlay');

    
    if (button) {
        button.onclick = function (e) {
            console.log('Открытие overlay для товара', productItem);
            document.querySelectorAll('.product__item').forEach(e => {
                if (e.classList.contains('active')) {
                    e.classList.remove('active');
                }
            });
            document.querySelectorAll('.product-item__overlay').forEach(e => {
                if (e.classList.contains('active')) {
                    e.classList.remove('active');
                }
            });

            productItem.classList.toggle('active'); 
            overlay.classList.toggle('active');    
            console.log('overlay toggled', overlay.classList.contains('active'));        
        }
    }
    
})
// overlay


// checkbox 
let checkbox = document.querySelectorAll('.checkbox');

checkbox.forEach(e => {
    e.onclick = function (event) {
        let input = e.querySelector('.checkbox__input');

        if (!e.classList.contains('active')) {
            input.checked = 1;
        }else{
            input.checked = 0;
        }
        e.classList.toggle('active');
    }
})
// checkbox 


// function

function toggleOpenX(mainElement, buttonElement ,heightElement, contentElement, close) {
    let elements = document.querySelectorAll(mainElement);

    elements.forEach(e => {
        let thisMainElement = e,
            thisButtonElement = e.querySelector(buttonElement),
            thisHeightElement = e.querySelector(heightElement),
            thisContentElement = e.querySelector(contentElement);        

        thisButtonElement.onclick = function (e) {
            let height = thisHeightElement.clientHeight;

            if (close == true && !thisMainElement.classList.contains('active')) {
                elements.forEach(e => {
                    if (e.classList.contains('active')) {
                        e.classList.remove('active');
                        e.querySelector(contentElement).style.height = null
                    }                    
                })
            }

            if (!thisMainElement.classList.contains('active')) {
                thisContentElement.style.height = `${height}px`;
                thisMainElement.classList.add('active');
            }else{
                thisContentElement.style.height = null;
                thisMainElement.classList.remove('active');
            }
        }
        
    });
}

function toggleHeader(button, content, blockheight, removeBlock, removeClass) {
    let thisButton = document.querySelector(button), 
        thisContent = document.querySelector(content),
        thisRemoveBlock = document.querySelector(removeBlock) || '',
        thisBlockheight = document.querySelector(blockheight);

    thisButton.onclick = function () {
        let height = thisBlockheight.clientHeight;

        if (!thisContent.classList .contains('open')) {
            thisContent.style.height = `${height}px`;
            thisContent.classList .add('open');

            if (removeBlock) {
                thisRemoveBlock.classList.remove(removeClass);
            }
        }else{
            thisContent.style.height = null;
            thisContent.classList .remove('open');

            if (removeBlock) {
                if (window.scrollY <= 25) {
                    thisRemoveBlock.classList.add(removeClass);
                }
            }
        }
    }
}
// function


// scroll


if (document.querySelector('.header').classList.contains('white')) {
    window.addEventListener("scroll", function (e) {
        let header = document.querySelector('.header');
        let scroll = window.scrollY;
        
        if (scroll >= 25) {
            header.classList.remove('white')
        }else{
            header.classList.add('white')
        }
        
    });
}
// scroll

document.addEventListener('DOMContentLoaded', function () {
    const petsSlider = new Swiper(".discount_cosmodog__slider", {
        slidesPerView: 1,
        spaceBetween: 0,
        effect: "fade",
        fadeEffect: {
            crossFade: true,
        },
        loop: true,
        autoplay: {
            delay: 5000,
            disableOnInteraction: false,
        },
    });
});


jQuery(document).ready(function($) {
  jQuery('.popup-wrap').on('click', function(e) {
    if (e.target === this) {
      $(this).closest('.modalProfile').removeClass('active');
    }
  });
  $('.close-btn').on('click', function(e) {
      $('.modalProfile').removeClass('active');
  });

});

// // Находим все элементы с классом login-open
// document.addEventListener('DOMContentLoaded', function() {
//     const loginButtons = document.querySelectorAll('.login-open');
    
//     loginButtons.forEach(button => {
//       button.addEventListener('click', function(event) {
//         event.preventDefault();
        
//         const modal = document.querySelector('.modal');
//         const modalAside = document.querySelector('.modal__aside');
//         const modalLogin = document.querySelector('.modal__login');
        
//         modal.classList.add('active');
//         modalLogin.classList.add('active');
        
//         // Set width and slide in from right
//         modalAside.style.width = '20vw';
//         modalAside.style.right = '0';
//       });
//     });
    
//     const closeButtons = document.querySelectorAll('.modal-close');
//     const modal = document.querySelector('.modal');
    
//     closeButtons.forEach(button => {
//       button.addEventListener('click', closeModal);
//     });
    
//     modal.addEventListener('click', function(event) {
//       if (event.target === modal) {
//         closeModal();
//       }
//     });
    
//     function closeModal() {
//       const modal = document.querySelector('.modal');
//       const modalAside = document.querySelector('.modal__aside');
//       const modalLogin = document.querySelector('.modal__login');
      
//       modal.classList.remove('active');
//       modalLogin.classList.remove('active');
      
//       // Reset styles
//       modalAside.style.width = '';
//       modalAside.style.right = '-30vw';
//     }
// });