MediaWiki:Common.js: відмінності між версіями

нема опису редагування
Немає опису редагування
Немає опису редагування
 
(Не показані 2 проміжні версії цього користувача)
Рядок 253: Рядок 253:
     var $contents = $('.player-tab-content');
     var $contents = $('.player-tab-content');
     var $lbox = $('.l-box');
     var $lbox = $('.l-box');
    var $rbox = $('.r-box');
      
      
     if ($tabs.length === 0) return;
     if ($tabs.length === 0) return;
   
    // Функція перевірки мобільної версії
    function isMobile() {
        return $(window).width() <= 768;
    }
      
      
     $tabs.on('click', function() {
     $tabs.on('click', function() {
Рядок 267: Рядок 273:
         $content.addClass('active');
         $content.addClass('active');
          
          
         // Ховаємо/показуємо l-box залежно від табу
         // Ховаємо/показуємо l-box залежно від табу (на десктопі)
         if (tabId === 'games') {
         if (tabId === 'games') {
             $lbox.fadeOut(200);
             $lbox.fadeOut(200);
         } else {
         } else {
             $lbox.fadeIn(200);
             $lbox.fadeIn(200);
        }
       
        // Ховаємо/показуємо r-box на МОБІЛЬНИХ при переході на "games"
        if (isMobile()) {
            if (tabId === 'games') {
                $rbox.slideUp(200);
            } else {
                $rbox.slideDown(200);
            }
         }
         }
          
          
Рядок 279: Рядок 294:
              
              
             if (playerName) {
             if (playerName) {
                // Показуємо loader
                $content.html('<div class="tab-loader">Завантаження...</div>');
               
                 $.ajax({
                 $.ajax({
                     url: mw.config.get('wgScriptPath') + '/api.php',
                     url: mw.config.get('wgScriptPath') + '/api.php',
Рядок 318: Рядок 336:
                 });
                 });
             }
             }
        }
    });
   
    // При зміні розміру вікна - показуємо r-box на десктопі
    $(window).on('resize', function() {
        if (!isMobile()) {
            $rbox.show();
        }
    });
});
// ==================================================
// МОБІЛЬНИЙ ПОШУК
// ==================================================
$(function() {
    // Тільки на мобільних
    if ($(window).width() > 768) return;
   
    // Створюємо overlay для пошуку
    var $overlay = $('<div class="mobile-search-overlay">' +
        '<input type="search" placeholder="Пошук..." id="mobileSearchInput">' +
        '<span class="mobile-search-close">×</span>' +
    '</div>');
   
    $('body').append($overlay);
   
    var $input = $('#mobileSearchInput');
    var $close = $overlay.find('.mobile-search-close');
    var $searchIcon = $('#searchIcon');
   
    // Клік на іконку пошуку - відкриваємо
    $searchIcon.on('click', function(e) {
        e.preventDefault();
        e.stopPropagation();
        $overlay.addClass('active');
        $input.focus();
    });
   
    // Клік на хрестик - закриваємо
    $close.on('click', function() {
        $overlay.removeClass('active');
        $input.val('');
    });
   
    // Enter - пошук
    $input.on('keydown', function(e) {
        if (e.which === 13 || e.keyCode === 13) {
            e.preventDefault();
            var query = $(this).val().trim();
            if (query) {
                window.location.href = '/index.php?title=Спеціальна:Пошук&search=' + encodeURIComponent(query);
            }
        }
    });
   
    // Escape - закриваємо
    $(document).on('keydown', function(e) {
        if (e.which === 27 && $overlay.hasClass('active')) {
            $overlay.removeClass('active');
            $input.val('');
        }
    });
   
    // Клік поза overlay - закриваємо
    $overlay.on('click', function(e) {
        if (e.target === this) {
            $overlay.removeClass('active');
            $input.val('');
        }
    });
});
/* ==================================================== */
/* МОБІЛЬНИЙ ПОШУК - ІКОНКА + OVERLAY */
/* ==================================================== */
$(function() {
    // Тільки для мобільних
    if (window.innerWidth > 768) return;
   
    // Створюємо кнопку пошуку
    var $searchBtn = $('<div class="mobile-search-btn">' +
        '<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="2">' +
        '<circle cx="11" cy="11" r="8"/>' +
        '<path d="m21 21-4.35-4.35"/>' +
        '</svg>' +
    '</div>');
   
    // Створюємо overlay
    var $overlay = $('<div class="mobile-search-overlay">' +
        '<input type="text" placeholder="Пошук..." autocomplete="off" autocapitalize="off">' +
        '<div class="mobile-search-close">×</div>' +
    '</div>');
   
    // Додаємо в DOM
    $('.minerva-header .branding-box').after($searchBtn);
    $('body').append($overlay);
   
    var $input = $overlay.find('input');
    var $close = $overlay.find('.mobile-search-close');
   
    // Відкриття пошуку
    $searchBtn.on('click', function(e) {
        e.preventDefault();
        e.stopPropagation();
        $overlay.addClass('active');
        setTimeout(function() {
            $input.focus();
        }, 100);
    });
   
    // Закриття пошуку
    $close.on('click', function() {
        $overlay.removeClass('active');
        $input.val('');
    });
   
    // Enter - пошук
    $input.on('keydown', function(e) {
        if (e.keyCode === 13) { // Enter
            var query = $input.val().trim();
            if (query) {
                window.location.href = '/index.php?title=Спеціальна:Пошук&search=' + encodeURIComponent(query);
            }
        }
        if (e.keyCode === 27) { // Escape
            $overlay.removeClass('active');
            $input.val('');
        }
    });
   
    // Клік поза overlay - закриття
    $overlay.on('click', function(e) {
        if (e.target === this) {
            $overlay.removeClass('active');
            $input.val('');
         }
         }
     });
     });
});
});