275 lines
11 KiB
JavaScript
275 lines
11 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
/**
|
|
* ===================================================================
|
|
* 1. OSNOVNA FUNKCIONALNOST MOBILNE NAVIGACIJE
|
|
* ===================================================================
|
|
*/
|
|
|
|
// === MOBILNI MENI: Preklop vidnosti menija ===
|
|
try {
|
|
const icon = document.querySelector('.mobile-menu-icon');
|
|
const root = document.documentElement;
|
|
|
|
if (!icon) {
|
|
console.error('Mobile menu icon not found.');
|
|
} else {
|
|
icon.addEventListener('click', (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
root.classList.toggle('nav-open');
|
|
});
|
|
|
|
document.addEventListener('click', (e) => {
|
|
if (root.classList.contains('nav-open') && !e.target.closest('.mobile-nav-panel') && !e.target.closest('.mobile-menu-icon')) {
|
|
root.classList.remove('nav-open');
|
|
}
|
|
});
|
|
|
|
document.addEventListener('keydown', (e) => {
|
|
if (e.key === 'Escape') {
|
|
root.classList.remove('nav-open');
|
|
}
|
|
});
|
|
}
|
|
} catch (err) {
|
|
console.error('Error in Mobile Menu Toggle:', err);
|
|
}
|
|
|
|
// --- Mobilni Accordion podmeni ---
|
|
try {
|
|
const mobileNav = document.querySelector('.mobile-nav-panel .mobile-nav');
|
|
if (mobileNav) {
|
|
const menuItemsWithChildren = mobileNav.querySelectorAll('.menu-item-has-children');
|
|
|
|
menuItemsWithChildren.forEach(item => {
|
|
const link = item.querySelector('a');
|
|
if (link) {
|
|
link.addEventListener('click', (event) => {
|
|
if (event.currentTarget.parentElement.classList.contains('menu-item-has-children')) {
|
|
event.preventDefault();
|
|
}
|
|
|
|
const parentLi = event.currentTarget.parentElement;
|
|
|
|
menuItemsWithChildren.forEach(otherItem => {
|
|
if (otherItem !== parentLi && otherItem.classList.contains('open')) {
|
|
otherItem.classList.remove('open');
|
|
}
|
|
});
|
|
|
|
parentLi.classList.toggle('open');
|
|
});
|
|
}
|
|
});
|
|
}
|
|
} catch (error) {
|
|
console.error('Error in Mobile Accordion Menu:', error);
|
|
}
|
|
|
|
|
|
/**
|
|
* ===================================================================
|
|
* 2. IZBOLJŠAVE UPORABNIŠKE IZKUŠNJE (UX/UI)
|
|
* ===================================================================
|
|
*/
|
|
|
|
// --- Funkcija za poudarjanje aktivne povezave v navigaciji ---
|
|
function highlightActiveLink() {
|
|
try {
|
|
const currentPath = window.location.pathname;
|
|
const navLinks = document.querySelectorAll('.navigation a');
|
|
let bestMatch = null;
|
|
let longestMatch = 0;
|
|
|
|
navLinks.forEach(link => {
|
|
if (link.closest('.dropdown-menu')) return;
|
|
|
|
const linkPath = new URL(link.href, window.location.origin).pathname;
|
|
|
|
if (currentPath.startsWith(linkPath) && linkPath.length > longestMatch) {
|
|
longestMatch = linkPath.length;
|
|
bestMatch = link;
|
|
}
|
|
});
|
|
|
|
if (bestMatch) {
|
|
const parentMenuItem = bestMatch.closest('.menu-item');
|
|
if (parentMenuItem) {
|
|
parentMenuItem.classList.add('active-page');
|
|
}
|
|
}
|
|
} catch (error) {
|
|
console.error("Error highlighting active link:", error);
|
|
}
|
|
}
|
|
|
|
|
|
// --- Funkcionalnost za preklopnik jezika (Desktop Dropdown + Mobile Modal) ---
|
|
function setupLanguageSwitcher() {
|
|
try {
|
|
// 1. POPRAVLJENA Logika za dinamično generiranje URL-jev
|
|
const path = window.location.pathname;
|
|
const pathParts = path.split('/').filter(Boolean);
|
|
const validLangs = ['en', 'si', 'mk'];
|
|
let pathWithoutLang = '/';
|
|
|
|
if (pathParts.length > 0 && validLangs.includes(pathParts[0])) {
|
|
// Sestavi pot iz delov, ki sledijo jezikovni kodi
|
|
pathWithoutLang = '/' + pathParts.slice(1).join('/');
|
|
// Če se je originalna pot končala s '/', jo dodaj nazaj (za mape)
|
|
if (path.endsWith('/') && pathWithoutLang !== '/') {
|
|
pathWithoutLang += '/';
|
|
}
|
|
} else {
|
|
pathWithoutLang = path;
|
|
}
|
|
|
|
document.querySelectorAll('a[data-lang]').forEach(link => {
|
|
const targetLang = link.getAttribute('data-lang');
|
|
// Združi novo jezikovno kodo in preostanek poti
|
|
const newUrl = `/${targetLang}${pathWithoutLang}`;
|
|
// Zamenjaj morebitne dvojne poševnice z eno samo, razen na začetku
|
|
link.setAttribute('href', newUrl.replace(/\/{2,}/g, '/'));
|
|
});
|
|
|
|
// 2. POPRAVLJENA Logika za NAMIZNI dropdown
|
|
// Uporablja bolj specifičen selektor, ki se ujema z novo HTML strukturo
|
|
const desktopSelectors = document.querySelectorAll('.header-right-wrapper .language-selector');
|
|
desktopSelectors.forEach(selector => {
|
|
const currentLang = selector.querySelector('.current-lang');
|
|
if (currentLang) {
|
|
currentLang.addEventListener('click', (event) => {
|
|
event.stopPropagation();
|
|
const isActive = selector.classList.contains('active');
|
|
document.querySelectorAll('.language-selector.active').forEach(s => s.classList.remove('active'));
|
|
if (!isActive) {
|
|
selector.classList.add('active');
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
window.addEventListener('click', () => {
|
|
desktopSelectors.forEach(s => s.classList.remove('active'));
|
|
});
|
|
|
|
// 3. Logika za MOBILNO modalno okno (ostaja enaka, vendar bo zdaj delovala pravilno)
|
|
const mobileLangButton = document.getElementById('mobile-lang-trigger');
|
|
const languageModal = document.getElementById('language-modal-overlay');
|
|
const closeModalButton = document.getElementById('language-modal-close');
|
|
|
|
if (mobileLangButton && languageModal && closeModalButton) {
|
|
mobileLangButton.addEventListener('click', (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
languageModal.classList.add('active');
|
|
});
|
|
|
|
const closeModal = () => {
|
|
languageModal.classList.remove('active');
|
|
};
|
|
|
|
closeModalButton.addEventListener('click', closeModal);
|
|
languageModal.addEventListener('click', (e) => {
|
|
if (e.target === languageModal) closeModal();
|
|
});
|
|
document.addEventListener('keydown', (e) => {
|
|
if (e.key === 'Escape' && languageModal.classList.contains('active')) closeModal();
|
|
});
|
|
}
|
|
|
|
} catch (error) {
|
|
console.error('Error in Language Switcher setup:', error);
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* ===================================================================
|
|
* 3. OSTALE FUNKCIONALNOSTI (FAQ, ACTIVITIES, ITD.)
|
|
* ===================================================================
|
|
*/
|
|
|
|
// --- FAQ Accordion ---
|
|
try {
|
|
document.querySelectorAll('.faq-item h3').forEach(header => {
|
|
header.addEventListener('click', () => {
|
|
const faqItem = header.parentElement;
|
|
faqItem.classList.toggle('open');
|
|
});
|
|
});
|
|
} catch (error) {
|
|
console.error('Error in FAQ Accordion:', error);
|
|
}
|
|
|
|
// --- Activities Tab ---
|
|
try {
|
|
const activityNavItems = document.querySelectorAll('.activities-nav li');
|
|
const activityDetailsText = document.querySelector('.activity-details p');
|
|
|
|
if (activityNavItems.length > 0 && activityDetailsText) {
|
|
const activitiesData = {
|
|
'Študentsko predstavništvo': { text: 'Vsebina za študentsko predstavništvo...'},
|
|
'Izobraževanje in kultura': { text: 'Vsebina za izobraževanje in kulturo...'},
|
|
'Zabava in druženje': { text: 'Vsebina za zabavo in druženje...'},
|
|
'Študentska podpora': { text: 'Vsebina za študentsko podoro...'},
|
|
'Student representation': { text: 'Content for student representation...'},
|
|
'Education and culture': { text: 'Content for education and culture...'},
|
|
'Entertainment and socializing': { text: 'Content for entertainment and socializing...'},
|
|
'Student support': { text: 'Content for student support...'},
|
|
'Студентско претставување': { text: 'Содржина за студентско претставување...'},
|
|
'Образование и култура': { text: 'Содржина за образование и култура...'},
|
|
'Забава и дружење': { text: 'Содржина за забава и дружење...'},
|
|
'Студентска поддршка': { text: 'Содржина за студентска поддршка...'}
|
|
};
|
|
|
|
activityNavItems.forEach(item => {
|
|
item.addEventListener('click', () => {
|
|
activityNavItems.forEach(navItem => navItem.classList.remove('active'));
|
|
item.classList.add('active');
|
|
|
|
const activityName = item.textContent.trim();
|
|
if (activitiesData[activityName]) {
|
|
activityDetailsText.textContent = activitiesData[activityName].text;
|
|
}
|
|
});
|
|
});
|
|
}
|
|
} catch (error) {
|
|
console.error('Error in Activities Tab:', error);
|
|
}
|
|
|
|
/**
|
|
* ===================================================================
|
|
* 4. INTERAKTIVNA SEKCIJA "MISSION & VISION"
|
|
* ===================================================================
|
|
*/
|
|
try {
|
|
const missionVisionContainer = document.getElementById('mission-vision-interactive');
|
|
|
|
if (missionVisionContainer) {
|
|
const missionBox = missionVisionContainer.querySelector('.mission-box');
|
|
const visionBox = missionVisionContainer.querySelector('.vision-box');
|
|
|
|
missionBox.addEventListener('mouseenter', () => {
|
|
missionVisionContainer.classList.remove('show-vision');
|
|
});
|
|
|
|
visionBox.addEventListener('mouseenter', () => {
|
|
missionVisionContainer.classList.add('show-vision');
|
|
});
|
|
}
|
|
} catch(error) {
|
|
console.error('Error in Mission/Vision interaction setup:', error);
|
|
}
|
|
|
|
/**
|
|
* ===================================================================
|
|
* 5. ZAGON FUNKCIJ PO NALOŽITVI STRANI
|
|
* ===================================================================
|
|
*/
|
|
highlightActiveLink();
|
|
setupLanguageSwitcher();
|
|
|
|
}); |