5737
редагувань
Admin (обговорення | внесок) Немає опису редагування |
Admin (обговорення | внесок) Немає опису редагування |
||
| (Не показані 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(''); | |||
} | } | ||
}); | }); | ||
}); | }); | ||