new-templane/resources/js/app.js

// Header Mobile Menu Toggle
document.addEventListener("DOMContentLoaded", function() {
    const burger = document.querySelector(".header__burger");
    const nav = document.querySelector(".header__nav");
    const body = document.body;

    if (burger && nav) {
        burger.addEventListener("click", function() {
            // Toggle active classes
            burger.classList.toggle("active");
            nav.classList.toggle("active");
            body.classList.toggle("menu-open");
        });

        // Close menu when clicking on menu links
        const menuLinks = nav.querySelectorAll(".header__menu-link");
        menuLinks.forEach(link => {
            link.addEventListener("click", function() {
                burger.classList.remove("active");
                nav.classList.remove("active");
                body.classList.remove("menu-open");
            });
        });

        // Close menu on window resize if opened
        window.addEventListener("resize", function() {
            if (window.innerWidth > 768) {
                burger.classList.remove("active");
                nav.classList.remove("active");
                body.classList.remove("menu-open");
            }
        });
    }


    // Находим все таблицы внутри блока с классом text
    const tables = document.querySelectorAll('.text table');

    if(tables){
        tables.forEach(table => {
            // Проверяем, есть ли у таблицы класс no-table-wrapper
            if (!table.classList.contains('no-table-wrapper')) {
                    // Создаем внешний wrapper для скролла
                    const scrollWrapper = document.createElement('div');
                    scrollWrapper.classList.add('table-wrapper-scroll');

                    // Создаем внутренний wrapper для стилизации
                    const wrapper = document.createElement('div');
                    wrapper.classList.add('table-wrapper');

                    // Оборачиваем таблицу
                    table.parentNode.insertBefore(scrollWrapper, table);
                    scrollWrapper.appendChild(wrapper);
                    wrapper.appendChild(table);

                    // Проверяем, есть ли у таблицы элемент caption
                    if (table.querySelector('caption')) {
                            // Если caption есть, добавляем к scrollWrapper класс 'has-caption'
                            scrollWrapper.classList.add('has-caption');
                    }

                    // Получаем первую строку таблицы
                    const firstRow = table.querySelector('tr');
                    // Подсчитываем количество столбцов в первой строке
                    const columnCount = firstRow ? firstRow.children.length : 0;

                    // Если столбцов больше трех, добавляем класс 'large-table'
                    if (columnCount > 3) {
                            wrapper.classList.add('large-table');
                    }
            }
        });
    }

    // FAQ Accordion
    const faqItems = document.querySelectorAll('.faq__item');

    if (faqItems) {
        faqItems.forEach(item => {
            const question = item.querySelector('.faq__question');
            const answer = item.querySelector('.faq__answer');

            if (question && answer) {
                question.addEventListener('click', function() {
                    // Закрываем все остальные FAQ
                    faqItems.forEach(otherItem => {
                        if (otherItem !== item) {
                            otherItem.classList.remove('active');
                            const otherAnswer = otherItem.querySelector('.faq__answer');
                            if (otherAnswer) {
                                otherAnswer.style.maxHeight = null;
                            }
                        }
                    });

                    // Переключаем текущий FAQ
                    item.classList.toggle('active');

                    if (item.classList.contains('active')) {
                        answer.style.maxHeight = answer.scrollHeight + 'px';
                    } else {
                        answer.style.maxHeight = null;
                    }
                });
            }
        });
    }

    // Table of Contents toggle
    const toc = document.querySelector('.toc');
    const tocHeader = document.querySelector('.toc__header');
    const tocContent = document.querySelector('.toc__content');

    if (toc && tocHeader && tocContent) {
        tocHeader.addEventListener('click', function() {
            toc.classList.toggle('active');

            if (toc.classList.contains('active')) {
                tocContent.style.maxHeight = tocContent.scrollHeight + 'px';
            } else {
                tocContent.style.maxHeight = null;
            }
        });
    }

    // Table of Contents smooth scroll
    const tocLinks = document.querySelectorAll('.toc__link');

    if (tocLinks) {
        tocLinks.forEach(link => {
            link.addEventListener('click', function(e) {
                e.preventDefault();

                const targetId = this.getAttribute('href');
                const targetElement = document.querySelector(targetId);

                if (targetElement) {
                    targetElement.scrollIntoView({
                        behavior: 'smooth',
                        block: 'start'
                    });
                }
            });
        });
    }
});