MediaWiki:Common.js: различия между версиями

мНет описания правки
мНет описания правки
Строка 564: Строка 564:
// Функция для логики меню, создаваемого модулем CategoryMenu
// Функция для логики меню, создаваемого модулем CategoryMenu
function initCategorySwitcher() {
function initCategorySwitcher() {
    var categories = document.querySelectorAll('.categories div');
var categories = document.querySelectorAll('.categories div');
    var menus = document.querySelectorAll('.menu');
var menus = document.querySelectorAll('.menu');
    var contentDivs = document.querySelectorAll('.content div');
var contentDivs = document.querySelectorAll('.content div');
    var menuItems = document.querySelectorAll('.menu div');
var menuItems = document.querySelectorAll('.menu div');
    var currentCategoryIndex = 0; // Индекс текущей активной категории
var currentCategoryIndex = 0; // Индекс текущей активной категории


    // Функция для генерации ID из текста
function clearActiveContent() {
    function generateIdFromText(text) {
for (var i = 0; i < contentDivs.length; i++) {
        return text.trim().toLowerCase().replace(/\s+/g, '-').replace(/[^a-zа-яё0-9\-]/g, '');
contentDivs[i].classList.remove('active');
    }
}
}


    // Присваиваем ID категориям и пунктам меню
function clearActiveMenu() {
    function assignIds() {
for (var i = 0; i < menus.length; i++) {
        for (var i = 0; i < categories.length; i++) {
menus[i].classList.remove('active');
            var category = categories[i];
}
            var categoryText = category.textContent || category.innerText;
}
            var categoryId = generateIdFromText(categoryText);
            category.setAttribute('id', categoryId);


            var menu = menus[i];
function clearActiveMenuItems() {
            var menuItems = menu.querySelectorAll('div');
for (var i = 0; i < menuItems.length; i++) {
            for (var j = 0; j < menuItems.length; j++) {
menuItems[i].classList.remove('active');
                var menuItem = menuItems[j];
}
                var menuItemText = menuItem.textContent || menuItem.innerText;
}
                var menuItemId = generateIdFromText(menuItemText);
                menuItem.setAttribute('id', menuItemId);
            }
        }
    }


    assignIds(); // Вызываем функцию для присвоения ID
function switchCategory(index) {
clearActiveMenu();
clearActiveContent();


    function clearActiveContent() {
// Удаляем класс active у всех категорий
        for (var i = 0; i < contentDivs.length; i++) {
categories.forEach(function(category) {
            contentDivs[i].classList.remove('active');
category.classList.remove('active');
        }
});
    }


    function clearActiveMenu() {
// Устанавливаем новую активную категорию
        for (var i = 0; i < menus.length; i++) {
var selectedCategory = categories[index];
            menus[i].classList.remove('active');
if (selectedCategory) {
        }
selectedCategory.classList.add('active'); // Добавляем класс active
    }
var categoryClass = selectedCategory.classList[0]; // Получаем класс категории
var selectedMenu = document.querySelector('.' + categoryClass + '-menu');
if (selectedMenu) {
selectedMenu.classList.add('active'); // Активируем меню соответствующей категории
var firstParagraph = selectedMenu.querySelector('div');
if (firstParagraph) {
switchContent(firstParagraph); // Открываем первый пункт меню
}
}
}


    function clearActiveMenuItems() {
currentCategoryIndex = index;
        for (var i = 0; i < menuItems.length; i++) {
updateArrowStates(); // Обновляем состояние стрелок
            menuItems[i].classList.remove('active');
}
        }
    }


    function switchCategory(index) {
function switchContent(menuItem) {
        clearActiveMenu();
clearActiveMenuItems();
        clearActiveContent();
clearActiveContent();
var contentClass = menuItem.className + '-content';
var content = document.querySelector('.' + contentClass);
if (content) {
content.classList.add('active');
menuItem.classList.add('active');
}
}


        for (var i = 0; i < categories.length; i++) {
// Обновляем состояние стрелок (активные/неактивные)
            categories[i].classList.remove('active');
function updateArrowStates() {
        }
const prevArrow = document.getElementById('prev-category');
const nextArrow = document.getElementById('next-category');


        var selectedCategory = categories[index];
// Если это первая категория, отключаем стрелку назад
        if (selectedCategory) {
if (currentCategoryIndex === 0) {
            selectedCategory.classList.add('active');
prevArrow.classList.add('disabled');
            var categoryClass = selectedCategory.id; // Используем ID как класс для меню
} else {
            var selectedMenu = document.querySelector('.' + categoryClass + '-menu');
prevArrow.classList.remove('disabled');
            if (selectedMenu) {
}
                selectedMenu.classList.add('active');
                var firstMenuItem = selectedMenu.querySelector('div');
                if (firstMenuItem) {
                    switchContent(firstMenuItem);
                }
            }
        }


        currentCategoryIndex = index;
// Если это последняя категория, отключаем стрелку вперёд
        updateArrowStates(); // Обновляем состояние стрелок
if (currentCategoryIndex === categories.length - 1) {
    }
nextArrow.classList.add('disabled');
} else {
nextArrow.classList.remove('disabled');
}
}


    function switchContent(menuItem) {
// Стрелки для переключения категорий
        clearActiveMenuItems();
document.getElementById('prev-category').addEventListener('click', function() {
        clearActiveContent();
if (currentCategoryIndex > 0) {
        var contentClass = menuItem.id + '-content';
currentCategoryIndex = currentCategoryIndex - 1;
        var content = document.querySelector('.' + contentClass);
switchCategory(currentCategoryIndex); // Переключаем на новую категорию
        if (content) {
}
            content.classList.add('active');
});
            menuItem.classList.add('active');
        }
    }


    // Обновляем состояние стрелок (активные/неактивные)
document.getElementById('next-category').addEventListener('click', function() {
    function updateArrowStates() {
if (currentCategoryIndex < categories.length - 1) {
        var prevArrow = document.getElementById('prev-category');
currentCategoryIndex = currentCategoryIndex + 1;
        var nextArrow = document.getElementById('next-category');
switchCategory(currentCategoryIndex); // Переключаем на новую категорию
}
});


        if (currentCategoryIndex === 0) {
// Инициализация: открываем первую категорию и первый пункт
            prevArrow.classList.add('disabled');
if (categories.length > 0) {
            prevArrow.style.pointerEvents = 'none'; // Отключаем клики
switchCategory(currentCategoryIndex); // Отображаем первую категорию
        } else {
updateArrowStates(); // Обновляем состояние стрелок
            prevArrow.classList.remove('disabled');
}
            prevArrow.style.pointerEvents = 'auto'; // Включаем клики
        }


        if (currentCategoryIndex === categories.length - 1) {
// Удаляем обработчики кликов на категории
            nextArrow.classList.add('disabled');
categories.forEach(function(category) {
            nextArrow.style.pointerEvents = 'none';
category.addEventListener('click', function(event) {
        } else {
event.preventDefault(); // Предотвращаем любое действие при клике
            nextArrow.classList.remove('disabled');
});
            nextArrow.style.pointerEvents = 'auto';
});
        }
    }


    // Логика для обработки якоря
// Клик по элементам меню
    function openCategoryFromAnchor() {
for (var i = 0; i < menuItems.length; i++) {
        var hash = window.location.hash.substring(1); // Получаем якорь без #
menuItems[i].addEventListener('click', function() {
        if (!hash) return;
switchContent(this);
});
}


        // Попробуем найти пункт меню или категорию с соответствующим ID
document.querySelector('.menu-toggle').addEventListener('click', function() {
        var targetMenuItem = document.getElementById(hash);
var menu = document.querySelector('.menu-container');
        if (targetMenuItem) {
menu.classList.toggle('active'); // Переключаем класс для показа/скрытия меню
            // Если это пункт меню, нужно сначала открыть его категорию
var toggleButton = document.querySelector('.menu-toggle');
            var menu = targetMenuItem.closest('.menu');
toggleButton.classList.toggle('active'); // Добавляем переключение для перемещения кнопки
            var categoryIndex;
});
            for (var i = 0; i < menus.length; i++) {
                if (menus[i] === menu) {
                    categoryIndex = i;
                    break;
                }
            }
            if (categoryIndex !== undefined) {
                switchCategory(categoryIndex);
                switchContent(targetMenuItem);
                targetMenuItem.scrollIntoView({ behavior: "smooth" }); // Прокручиваем к пункту
            }
        } else {
            // Ищем категорию по ID
            var targetCategory = document.getElementById(hash);
            if (targetCategory) {
                for (var i = 0; i < categories.length; i++) {
                    if (categories[i] === targetCategory) {
                        switchCategory(i);
                        targetCategory.scrollIntoView({ behavior: "smooth" });
                        break;
                    }
                }
            }
        }
    }
 
    // Инициализация: открываем первую категорию и первый пункт
    if (categories.length > 0) {
        switchCategory(currentCategoryIndex);
        updateArrowStates();
    }
 
    // Обрабатываем якорь при загрузке
    openCategoryFromAnchor();
 
    // Обрабатываем якорь при изменении URL
    window.addEventListener('hashchange', openCategoryFromAnchor);
 
    // Клик по элементам меню
    for (var i = 0; i < menuItems.length; i++) {
        menuItems[i].addEventListener('click', function() {
            switchContent(this);
        });
    }
 
    document.querySelector('.menu-toggle').addEventListener('click', function() {
        var menu = document.querySelector('.menu-container');
        menu.classList.toggle('active');
        var toggleButton = document.querySelector('.menu-toggle');
        toggleButton.classList.toggle('active');
    });
}
}
const currentPageTitle = document.title;
const currentPageTitle = document.title;