MediaWiki:Common.js

/* Размещённый здесь код JavaScript будет загружаться пользователям при обращении к каждой странице */

// console.log("Привет");
/*_____________________*/
mw.loader.using('jquery').then(function() {
  $(document).ready(function() {
    // Удаляем старые элементы
    $('.citizen-header__custom-bottom, .citizen-panel-overlay').remove();
    
    // Создаем новую панель
    const $panel = $('<div>')
      .addClass('citizen-header__custom-bottom')
      .hide();
    
    // Создаем оверлей
    const $overlay = $('<div>')
      .addClass('citizen-panel-overlay')
      .hide();

    // Добавляем элементы на страницу
    $('body').append($overlay, $panel);

    // Контент панели
    const items = [
      {
        src: 'https://wiki.ss220.club/resources/assets/logo.png',
        link: 'https://wiki.ss220.club',
        width: '40px'
      },
      {
        src: 'https://bs.ss220.club/resources/assets/logo.png',
        link: 'https://bs.ss220.club',
        width: '40px'
      }
    ];

    // Заполняем панель
    $panel.append(
      items.map(item => 
        $('<a>')
          .attr('href', item.link)
          .append(
            $('<img>')
              .attr('src', item.src)
              .css('width', item.width)
          )
          .css({
            display: 'block',
            transition: '0.2s transform'
          })
          .hover(
            () => $(this).css('transform', 'scale(1.1)'),
            () => $(this).css('transform', 'none')
          )
      )
    );

    // Управление видимостью
    function togglePanel(show) {
      $panel.toggle(show);
      $overlay.toggle(show);
      $('body').toggleClass('citizen-panel-active', show);
    }

    // Открытие/закрытие
    $overlay.click(() => togglePanel(false));
    $(document).on('keyup', e => e.key === 'Escape' && togglePanel(false));

    // Инициализация
    togglePanel(true); // Для теста - сразу показать панель
  });
});