MediaWiki:Common.js

$(document).ready(function() {
    // Инициализация боковой панели
    $('.боковая-панель-кнопка').on('click', function() {
        var targetId = $(this).data('target');
        
        // Удаляем активный класс у всех кнопок
        $('.боковая-панель-кнопка').removeClass('active');
        // Добавляем активный класс текущей кнопке
        $(this).addClass('active');
        
        // Скрываем все разделы
        $('.боковая-панель-раздел').removeClass('default');
        // Показываем выбранный раздел
        $('#' + targetId).addClass('default');
    });
    
    // Активируем первую кнопку по умолчанию
    $('.боковая-панель-кнопка:first').click();
    
    // Подключаем Tippy.js через CDN динамически
if (!window.tippy) {
    var tippyScript = document.createElement('script');
    tippyScript.src = "https://unpkg.com/@popperjs/core@2/dist/umd/popper.min.js";
    tippyScript.onload = function() {
        var tippyCoreScript = document.createElement('script');
        tippyCoreScript.src = "https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.min.js";
        tippyCoreScript.onload = initTippy;
        document.head.appendChild(tippyCoreScript);
    };
    document.head.appendChild(tippyScript);

    // Подключаем CSS
    var tippyCSS = document.createElement('link');
    tippyCSS.rel = "stylesheet";
    tippyCSS.href = "https://unpkg.com/tippy.js@6/dist/tippy.css";
    document.head.appendChild(tippyCSS);
} else {
    initTippy();
}

// Инициализация Tippy после загрузки скриптов
function initTippy() {
    $('.допуск-контейнер').each(function() {
        var content = $(this).find('.допуск-подсказка').html(); // берем содержимое подсказки
        tippy(this, {
            content: content,
            allowHTML: true,
            interactive: true,
            placement: 'auto',      // автоматический выбор позиции
            maxWidth: '500px',
            minHeight: 'auto',
            theme: 'dark',          // темная тема
            arrow: true,           // без стрелки
            duration: [200, 200],   // плавное появление/исчезание
            popperOptions: {
                modifiers: [
                    {
                        name: 'preventOverflow',
                        options: {
                            padding: 8, // отступ от краев экрана
                        },
                    },
                    {
                        name: 'flip',
                        options: {
                            fallbackPlacements: ['top', 'bottom', 'right', 'left'],
                        },
                    },
                ],
            },
        });
    });
}

});