MediaWiki:Common.js
Увага: Після публікування слід очистити кеш браузера, щоб побачити зміни.
- Firefox / Safari: тримайте Shift, коли натискаєте Оновити, або натисніть Ctrl-F5 чи Ctrl-Shift-R (⌘-R на Apple Mac)
- Google Chrome: натисніть Ctrl-Shift-R (⌘-Shift-R на Apple Mac)
- Edge: тримайте Ctrl, коли натискаєте Оновити, або натисніть Ctrl-F5.
// Виправляємо viewport
(function() {
var viewport = document.querySelector('meta[name="viewport"]');
if (viewport) {
viewport.setAttribute('content', 'width=device-width, initial-scale=1.0');
} else {
var meta = document.createElement('meta');
meta.name = 'viewport';
meta.content = 'width=device-width, initial-scale=1.0';
document.head.appendChild(meta);
}
})();$(function() {
$('.category-card').each(function() {
var $card = $(this);
var href = $card.attr('data-href');
if (href) {
$card.css('cursor', 'pointer');
$card.on('click', function(e) {
if ($(e.target).closest('a').length === 0) {
window.location.href = href;
}
});
$card.hover(
function() { $card.addClass('card-hover'); },
function() { $card.removeClass('card-hover'); }
);
}
});
});
/* ── Випадкові статті на головній сторінці ── */
/* ══════════════════════════════════════════════
Vue-додаток для сторінки "Викладачі"
Підключає Vue 3 через CDN і монтує на #vue-teachers
══════════════════════════════════════════════ */
mw.hook('wikipage.content').add(function() {
var mountEl = document.getElementById('vue-teachers');
if (!mountEl) return;
// Завантажуємо Vue 3 з CDN
mw.loader.getScript('https://unpkg.com/vue@3/dist/vue.global.prod.js').then(function() {
var apiBase = mw.config.get('wgScriptPath') + '/api.php';
/* ── Парсер інфобоксу ── */
function parseInfobox(wikitext) {
var result = { title: '', occupation: '', faculty: '', image: '' };
if (!wikitext) return result;
var titleMatch = wikitext.match(/\|\s*title\s*=\s*([^\|\n\}]+)/i);
if (titleMatch) result.title = titleMatch[1].trim();
var occMatch = wikitext.match(/\|\s*occupation\s*=\s*([^\|\n\}]+)/i);
if (occMatch) result.occupation = occMatch[1].trim();
var imgMatch = wikitext.match(/\|\s*image\s*=\s*([^\|\n\}]+)/i);
if (imgMatch) result.image = imgMatch[1].trim();
// Факультет з поля title
if (result.title.toLowerCase().includes('схід') || result.title.toLowerCase().includes('слов')) {
result.faculty = 'Факультет східної і слов\'янської філології';
} else if (result.title.toLowerCase().includes('філолог')) {
result.faculty = 'Філологічний факультет';
} else if (result.title.toLowerCase().includes('географ') || result.title.toLowerCase().includes('туризм')) {
result.faculty = 'Інший факультет';
} else {
result.faculty = 'Інший факультет';
}
return result;
}
/* ── Отримати посаду коротко ── */
function getPosition(title) {
if (!title) return 'Викладач';
var t = title.toLowerCase();
if (t.includes('професор')) return 'Професор';
if (t.includes('доцент')) return 'Доцент';
if (t.includes('викладач')) return 'Викладач';
return 'Інше';
}
var app = Vue.createApp({
data() {
return {
teachers: [],
loading: true,
activeFilter: 'Всі',
filters: ['Всі', 'Професор', 'Доцент', 'Викладач'],
preview: null, // об'єкт викладача для превью
previewX: 0, // позиція popup по X
previewY: 0, // позиція popup по Y
previewTimer: null, // таймер затримки
};
},
computed: {
filteredTeachers() {
var vm = this;
var result = this.teachers.filter(function(t) {
var matchFilter = vm.activeFilter === 'Всі' || t.position === vm.activeFilter;
return matchFilter;
});
result = result.slice().sort(function(a, b) {
return a.fullName.localeCompare(b.fullName, 'uk');
});
return result;
}
},
mounted() {
this.loadTeachers();
},
methods: {
showPreview(teacher, event) {
var vm = this;
clearTimeout(vm.previewTimer);
var target = event.currentTarget || event.target;
var rect = target.getBoundingClientRect();
var scrollY = window.scrollY || window.pageYOffset;
var scrollX = window.scrollX || window.pageXOffset;
vm.previewTimer = setTimeout(function() {
// Показуємо зліва або справа залежно від позиції
var spaceRight = window.innerWidth - rect.right;
if (spaceRight > 280) {
vm.previewX = rect.right + scrollX + 12;
} else {
vm.previewX = rect.left + scrollX - 272;
}
vm.previewY = rect.top + scrollY;
vm.preview = teacher;
}, 250);
},
hidePreview() {
clearTimeout(this.previewTimer);
this.previewTimer = setTimeout(() => {
this.preview = null;
}, 150);
},
keepPreview() {
clearTimeout(this.previewTimer);
},
async loadTeachers() {
this.loading = true;
try {
// Крок 1: всі сторінки з категорії Викладачі
var catResp = await fetch(
apiBase + '?action=query&list=categorymembers&cmtitle=Категорія:Викладачі' +
'&cmlimit=50&cmnamespace=0&format=json'
);
var catData = await catResp.json();
var members = catData.query.categorymembers;
if (!members || members.length === 0) {
this.loading = false;
return;
}
var titles = members.map(function(m) { return m.title; }).join('|');
// Крок 2: вміст статей
var pageResp = await fetch(
apiBase + '?action=query&titles=' + encodeURIComponent(titles) +
'&prop=revisions&rvprop=content&format=json'
);
var pageData = await pageResp.json();
var pages = Object.values(pageData.query.pages);
// Крок 3: для кожної статті отримати зображення
var teacherPromises = pages.map(async function(page) {
var content = (page.revisions && page.revisions[0]) ? (page.revisions[0]['*'] || '') : '';
var info = parseInfobox(content);
var imgSrc = null;
if (info.image) {
try {
var imgResp = await fetch(
apiBase + '?action=query&titles=File:' + encodeURIComponent(info.image) +
'&prop=imageinfo&iiprop=url&iiurlwidth=200&format=json'
);
var imgData = await imgResp.json();
var imgPages = Object.values(imgData.query.pages);
if (imgPages[0] && imgPages[0].imageinfo && imgPages[0].imageinfo[0]) {
imgSrc = imgPages[0].imageinfo[0].thumburl || imgPages[0].imageinfo[0].url;
}
} catch(e) {}
}
var pageUrl = mw.config.get('wgArticlePath').replace(
'$1', encodeURIComponent(page.title.replace(/ /g, '_'))
);
return {
fullName: page.title,
title: info.title,
occupation: info.occupation,
faculty: info.faculty,
position: getPosition(info.title),
imgSrc: imgSrc,
pageUrl: pageUrl,
};
});
this.teachers = await Promise.all(teacherPromises);
} catch(e) {
console.error('[Vue Teachers] error:', e);
}
this.loading = false;
}
},
template: `
<div class="vt-app">
<div class="vt-layout">
<!-- Ліва частина: лічильник + картки -->
<div class="vt-main">
<div class="vt-count" v-if="!loading">
Знайдено: <strong>{{ filteredTeachers.length }}</strong> з {{ teachers.length }}
</div>
<div class="vt-loading" v-if="loading">
<div class="vt-spinner"></div>
<span>Завантаження викладачів...</span>
</div>
<div class="vt-empty" v-else-if="!loading && filteredTeachers.length === 0">
<div class="vt-empty-icon">🔍</div>
<p>Нікого не знайдено</p>
<button class="vt-reset-btn" @click="activeFilter = 'Всі'">Скинути фільтри</button>
</div>
<div class="vt-grid" v-else>
<a
v-for="t in filteredTeachers"
:key="t.fullName"
:href="t.pageUrl"
class="vt-card"
@mouseenter="showPreview(t, $event)"
@mouseleave="hidePreview"
>
<div class="vt-card-img-wrap">
<img v-if="t.imgSrc" :src="t.imgSrc" :alt="t.fullName" class="vt-card-img" />
<div v-else class="vt-card-img-placeholder">{{ t.fullName.charAt(0) }}</div>
</div>
<div class="vt-card-body">
<div class="vt-card-position" :class="'pos-' + t.position.toLowerCase()">{{ t.position }}</div>
<div class="vt-card-name">{{ t.fullName }}</div>
<div class="vt-card-occupation" v-if="t.occupation">{{ t.occupation }}</div>
<div class="vt-card-title" v-if="t.title">{{ t.title }}</div>
</div>
</a>
</div>
</div>
<!-- Права панель: фільтри -->
<div class="vt-sidebar">
<div class="vt-sidebar-title">Фільтр</div>
<div class="vt-filters">
<button
v-for="f in filters"
:key="f"
class="vt-filter-btn"
:class="{ active: activeFilter === f }"
@click="activeFilter = f"
>{{ f }}</button>
</div>
</div>
</div>
<!-- Превью попап -->
<teleport to="body">
<a
v-if="preview"
:href="preview.pageUrl"
class="vt-preview"
:style="{ top: previewY + 'px', left: previewX + 'px' }"
@mouseenter="keepPreview"
@mouseleave="hidePreview"
>
<div class="vt-preview-top">
<img v-if="preview.imgSrc" :src="preview.imgSrc" class="vt-preview-img" :alt="preview.fullName" />
<div v-else class="vt-preview-img-placeholder">{{ preview.fullName.charAt(0) }}</div>
<div class="vt-preview-info">
<div class="vt-preview-position" :class="'pos-' + preview.position.toLowerCase()">{{ preview.position }}</div>
<div class="vt-preview-name">{{ preview.fullName }}</div>
</div>
</div>
<div class="vt-preview-divider"></div>
<div class="vt-preview-row" v-if="preview.occupation">
<span class="vt-preview-lbl">Спеціальність</span>
<span class="vt-preview-val">{{ preview.occupation }}</span>
</div>
<div class="vt-preview-row" v-if="preview.title">
<span class="vt-preview-lbl">Посада</span>
<span class="vt-preview-val">{{ preview.title }}</span>
</div>
</a>
</teleport>
</div>
`
});
app.mount('#vue-teachers');
});
});
/* Витягнути назву зображення з вікі-тексту */
function extractImageName(wikitext) {
if (!wikitext) return null;
// 1. Шукаємо в Infobox: | image = Файл.jpg
var infoboxImg = wikitext.match(/\|\s*image\s*=\s*([^\|\n\}]+)/i);
if (infoboxImg) {
var name = infoboxImg[1].trim();
if (name && name.length > 0) return name;
}
// 2. Шукаємо [[Файл:Назва.jpg|...]] або [[File:...]]
var fileMatch = wikitext.match(/\[\[(?:Файл|File|Зображення|Image):([^\|\]]+)/i);
if (fileMatch) {
return fileMatch[1].trim();
}
return null;
}
/* Витягнути перший змістовний абзац */
function extractDescription(wikitext) {
if (!wikitext) return '';
// Прибрати інфобокс {{...}} (може бути багаторядковим)
var text = wikitext;
var depth = 0;
var infoboxEnd = -1;
for (var i = 0; i < text.length; i++) {
if (text[i] === '{') depth++;
else if (text[i] === '}') {
depth--;
if (depth === 0) { infoboxEnd = i + 1; break; }
}
}
if (infoboxEnd > 0) text = text.substring(infoboxEnd);
// Прибрати [[Файл:...]] блоки
text = text.replace(/\[\[(?:Файл|File|Зображення|Image):[^\]]*\]\]/gi, '');
// Прибрати wikitable {| ... |}
text = text.replace(/\{\|[\s\S]*?\|\}/g, '');
// Прибрати шаблони {{...}}
text = text.replace(/\{\{[^}]*\}\}/g, '');
// Прибрати заголовки == ... ==
text = text.replace(/={2,6}[^=\n]+=+/g, '');
// Прибрати вікі-посилання — залишити текст
text = text.replace(/\[\[(?:[^\|\]]*\|)?([^\]]+)\]\]/g, '$1');
// Прибрати зовнішні посилання [url текст]
text = text.replace(/\[[^\s\]]+\s+([^\]]+)\]/g, '$1');
text = text.replace(/\[[^\]]+\]/g, '');
// Прибрати жирний/курсив
text = text.replace(/'{2,3}/g, '');
// Прибрати HTML теги
text = text.replace(/<[^>]+>/g, '');
// Прибрати рядки що починаються з * # : ;
text = text.replace(/^[\*#:;].*/gm, '');
// Прибрати порожні рядки і зайві пробіли
var lines = text.split('\n').map(function(l) { return l.trim(); }).filter(function(l) { return l.length > 20; });
// Взяти перший змістовний рядок
if (lines.length > 0) {
var result = lines[0].substring(0, 160);
if (lines[0].length > 160) result += '…';
return result;
}
return '';
}
function loadRandomArticles() {
var list = document.getElementById('random-articles-list');
if (!list) return;
list.innerHTML = '<div class="random-articles-loading">Завантаження...</div>';
var apiBase = mw.config.get('wgScriptPath') + '/api.php';
// Сторінки які не повинні з'являтись у випадкових статтях
var excludedPages = ['Головна сторінка', 'Структурні підрозділи', 'Викладачі'];
fetch(apiBase + '?action=query&list=random&rnnamespace=0&rnlimit=10&format=json')
.then(function(r) { return r.json(); })
.then(function(data) {
var pages = data.query.random.filter(function(p) {
return excludedPages.indexOf(p.title) === -1;
}).slice(0, 3);
var titles = pages.map(function(p) { return p.title; }).join('|');
return fetch(
apiBase +
'?action=query' +
'&titles=' + encodeURIComponent(titles) +
'&prop=revisions' +
'&rvprop=content' +
'&format=json'
);
})
.then(function(r) { return r.json(); })
.then(function(data) {
var pages = Object.values(data.query.pages);
list.innerHTML = '';
var promises = pages.map(function(page) {
var title = page.title;
var pageUrl = mw.config.get('wgArticlePath').replace(
'$1', encodeURIComponent(title.replace(/ /g, '_'))
);
var content = '';
if (page.revisions && page.revisions[0]) {
content = page.revisions[0]['*'] || '';
}
var excerpt = extractDescription(content);
if (!excerpt) excerpt = 'Немає опису.';
var imgName = extractImageName(content);
if (imgName) {
var fileTitle = imgName.match(/^(Файл|File|Image|Зображення):/i)
? imgName
: 'File:' + imgName;
return fetch(
apiBase +
'?action=query' +
'&titles=' + encodeURIComponent(fileTitle) +
'&prop=imageinfo' +
'&iiprop=url' +
'&iiurlwidth=120' +
'&format=json'
)
.then(function(r) { return r.json(); })
.then(function(imgData) {
var imgPages = Object.values(imgData.query.pages);
var imgSrc = null;
if (imgPages[0] && imgPages[0].imageinfo && imgPages[0].imageinfo[0]) {
imgSrc = imgPages[0].imageinfo[0].thumburl || imgPages[0].imageinfo[0].url;
}
return { title: title, excerpt: excerpt, pageUrl: pageUrl, imgSrc: imgSrc };
})
.catch(function() {
return { title: title, excerpt: excerpt, pageUrl: pageUrl, imgSrc: null };
});
}
return Promise.resolve({ title: title, excerpt: excerpt, pageUrl: pageUrl, imgSrc: null });
});
return Promise.all(promises);
})
.then(function(results) {
var list2 = document.getElementById('random-articles-list');
if (!list2) return;
list2.innerHTML = '';
results.forEach(function(item) {
var thumbHtml = item.imgSrc
? '<img class="random-article-thumb" src="' + item.imgSrc + '" alt="">'
: '<div class="random-article-thumb-placeholder">📄</div>';
var card = document.createElement('a');
card.href = item.pageUrl;
card.className = 'random-article-card';
card.innerHTML =
thumbHtml +
'<div class="random-article-info">' +
'<div class="random-article-title">' + mw.html.escape(item.title) + '</div>' +
'<div class="random-article-excerpt">' + mw.html.escape(item.excerpt) + '</div>' +
'</div>';
list2.appendChild(card);
});
})
.catch(function(err) {
var list3 = document.getElementById('random-articles-list');
if (list3) list3.innerHTML = '<div class="random-articles-loading">Не вдалося завантажити статті.</div>';
console.error('[RA] error:', err);
});
}
/* Запуск */
mw.hook('wikipage.content').add(function() {
var panel = document.getElementById('random-articles-panel');
if (!panel) return;
loadRandomArticles();
var btn = document.getElementById('random-articles-refresh');
if (btn) {
btn.addEventListener('click', function() {
loadRandomArticles();
});
}
});
/* ══════════════════════════════════════════════
ГОЛОВНА СТОРІНКА: покращення
══════════════════════════════════════════════ */
/* ── 2. Анімація чисел статистики ── */
function animateNumber(element, target) {
element.classList.add('animating');
var current = 0;
var increment = target / 60; // 60 кадрів
var timer = setInterval(function() {
current += increment;
if (current >= target) {
current = target;
clearInterval(timer);
setTimeout(function() { element.classList.remove('animating'); }, 100);
}
element.textContent = Math.floor(current);
}, 16); // ~60 FPS
}
mw.hook('wikipage.content').add(function() {
// Запускаємо анімацію тільки на головній сторінці
if (mw.config.get('wgPageName') !== 'Головна_сторінка') return;
var statsNumbers = document.querySelectorAll('.stats-panel-number');
var animated = false;
function checkAndAnimate() {
if (animated) return;
var statsPanel = document.querySelector('.stats-panel');
if (!statsPanel) return;
var rect = statsPanel.getBoundingClientRect();
if (rect.top < window.innerHeight && rect.bottom > 0) {
animated = true;
statsNumbers.forEach(function(el) {
var text = el.textContent.trim();
var num = parseInt(text.replace(/[^\d]/g, ''), 10);
if (!isNaN(num) && num > 0) {
el.textContent = '0';
setTimeout(function() { animateNumber(el, num); }, 200);
}
});
}
}
window.addEventListener('scroll', checkAndAnimate);
checkAndAnimate();
});
/* ── 4. Сортування карточок за прізвищем ── */
mw.hook('wikipage.content').add(function() {
document.querySelectorAll('div[style*="grid-template-columns"]').forEach(function(grid) {
var cards = Array.from(grid.children);
if (cards.length < 2) return;
cards.sort(function(a, b) {
var aLink = a.querySelector('div[style*="flex-grow"] a');
var bLink = b.querySelector('div[style*="flex-grow"] a');
if (!aLink || !bLink) return 0;
var aSurname = aLink.textContent.trim().split(' ')[0];
var bSurname = bLink.textContent.trim().split(' ')[0];
return aSurname.localeCompare(bSurname, 'uk');
});
cards.forEach(function(card) {
grid.appendChild(card);
});
});
});
/* ══════════════════════════════════════════════
MODERN UI: Particles.js фон + прогрес скролла
══════════════════════════════════════════════ */
/* ── 1. Прогрес скролла ── */
mw.hook('wikipage.content').add(function() {
if (mw.config.get('wgPageName') !== 'Головна_сторінка') return;
// Створюємо індикатор
var progressBar = document.createElement('div');
progressBar.className = 'scroll-progress';
document.body.appendChild(progressBar);
function updateProgress() {
var winScroll = document.documentElement.scrollTop || document.body.scrollTop;
var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
var scrolled = (winScroll / height) * 100;
progressBar.style.width = scrolled + '%';
}
window.addEventListener('scroll', updateProgress);
updateProgress();
});
/* ── 2. Particles.js canvas фон ── */
mw.hook('wikipage.content').add(function() {
if (mw.config.get('wgPageName') !== 'Головна_сторінка') return;
var welcomeWrapper = document.querySelector('.welcome-wrapper');
if (!welcomeWrapper) return;
// Створюємо canvas
var canvas = document.createElement('canvas');
canvas.className = 'particles-canvas';
canvas.style.cssText = 'position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;';
// Gradient mask для плавного переходу по краях
canvas.style.webkitMaskImage = 'linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%), linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%)';
canvas.style.maskImage = 'linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%), linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%)';
canvas.style.webkitMaskComposite = 'source-in';
canvas.style.maskComposite = 'intersect';
welcomeWrapper.style.position = 'relative';
welcomeWrapper.insertBefore(canvas, welcomeWrapper.firstChild);
var ctx = canvas.getContext('2d');
canvas.width = welcomeWrapper.offsetWidth;
canvas.height = welcomeWrapper.offsetHeight;
var particles = [];
var particleCount = 40;
var mouse = { x: null, y: null, radius: 100 };
// Частинки
function Particle() {
this.x = Math.random() * canvas.width;
this.y = Math.random() * canvas.height;
this.vx = (Math.random() - 0.5) * 0.5;
this.vy = (Math.random() - 0.5) * 0.5;
this.radius = Math.random() * 2 + 1;
}
Particle.prototype.draw = function() {
ctx.beginPath();
ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2);
ctx.fillStyle = 'rgba(255, 215, 0, 0.6)';
ctx.fill();
};
Particle.prototype.update = function() {
if (this.x > canvas.width || this.x < 0) this.vx = -this.vx;
if (this.y > canvas.height || this.y < 0) this.vy = -this.vy;
this.x += this.vx;
this.y += this.vy;
this.draw();
};
// Ініціалізація
for (var i = 0; i < particleCount; i++) {
particles.push(new Particle());
}
// Анімація
function animate() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
for (var i = 0; i < particles.length; i++) {
particles[i].update();
// З'єднання лініями
for (var j = i + 1; j < particles.length; j++) {
var dx = particles[i].x - particles[j].x;
var dy = particles[i].y - particles[j].y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 120) {
ctx.beginPath();
ctx.strokeStyle = 'rgba(255, 215, 0, ' + (1 - distance / 120) * 0.3 + ')';
ctx.lineWidth = 1;
ctx.moveTo(particles[i].x, particles[i].y);
ctx.lineTo(particles[j].x, particles[j].y);
ctx.stroke();
}
}
}
requestAnimationFrame(animate);
}
animate();
// Resize
window.addEventListener('resize', function() {
canvas.width = welcomeWrapper.offsetWidth;
canvas.height = welcomeWrapper.offsetHeight;
});
});
/* ══════════════════════════════════════════════
BURGER MENU — ПРАВИЛЬНА ВЕРСІЯ З ДЕБАГОМ
══════════════════════════════════════════════ */
(function() {
// Чекаємо повного завантаження
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initBurgerMenu);
} else {
initBurgerMenu();
}
function initBurgerMenu() {
console.log('[Burger] Initializing...');
// Перевіряємо чи вже існує burger
if (document.querySelector('.mobile-menu-toggle')) {
console.log('[Burger] Already exists, skipping');
return;
}
// Створюємо burger button
var burger = document.createElement('div');
burger.className = 'mobile-menu-toggle';
burger.innerHTML = '<span></span><span></span><span></span>';
burger.setAttribute('aria-label', 'Відкрити меню');
burger.setAttribute('role', 'button');
burger.setAttribute('tabindex', '0');
document.body.insertBefore(burger, document.body.firstChild);
console.log('[Burger] Button created');
// Створюємо overlay
var overlay = document.createElement('div');
overlay.className = 'mobile-overlay';
document.body.insertBefore(overlay, document.body.firstChild);
console.log('[Burger] Overlay created');
// Знаходимо sidebar
var panel = document.getElementById('mw-panel');
if (!panel) {
console.error('[Burger] Panel #mw-panel not found!');
return;
}
console.log('[Burger] Panel found');
// Функція відкриття
function openMenu() {
console.log('[Burger] Opening menu');
panel.classList.add('mobile-open');
overlay.classList.add('active');
burger.classList.add('active');
document.body.style.overflow = 'hidden';
}
// Функція закриття
function closeMenu() {
console.log('[Burger] Closing menu');
panel.classList.remove('mobile-open');
overlay.classList.remove('active');
burger.classList.remove('active');
document.body.style.overflow = '';
}
// Toggle при кліку на burger
burger.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
console.log('[Burger] Click detected');
if (panel.classList.contains('mobile-open')) {
closeMenu();
} else {
openMenu();
}
});
// Закрити при кліку на overlay
overlay.addEventListener('click', function(e) {
e.preventDefault();
console.log('[Burger] Overlay clicked');
closeMenu();
});
// Закрити при кліку на посилання
var links = panel.querySelectorAll('a');
console.log('[Burger] Found ' + links.length + ' links in panel');
links.forEach(function(link) {
link.addEventListener('click', function() {
console.log('[Burger] Link clicked, closing menu');
setTimeout(closeMenu, 100);
});
});
// Закрити при Escape
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape' && panel.classList.contains('mobile-open')) {
console.log('[Burger] Escape pressed');
closeMenu();
}
});
console.log('[Burger] Initialization complete!');
}
})();