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('.допуск-контейнер', {
		    content: (reference) => reference.getAttribute('data-tooltip'),
		    allowHTML: true,
		    interactive: true,
		    placement: 'auto',
		    maxWidth: '80vw',
		    theme: 'dark',
		    arrow: false,
		    duration: [200, 200],
		    popperOptions: {
		        modifiers: [
		            { name: 'preventOverflow', options: { padding: 8 } },
		            { name: 'flip', options: { fallbackPlacements: ['top','bottom','right','left'] } }
		        ]
		    }
		});
    });
}

});