This commit is contained in:
Mark Poljanšek committed
1 parent
f73ef2eb2b
commit
b9c87390d5
12 files changed
+19417
-133
No files matched your search
+102
-67
@@ -2,6 +2,8 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
/**
|
||||
* Funkcija za nalaganje HTML komponent (glava, noga).
|
||||
* Ta funkcija je bila v originalni kodi, a se na koncu ne uporablja,
|
||||
* ker so glave in noge vgrajene neposredno v HTML datoteke. Pustimo jo za morebitno kasnejšo rabo.
|
||||
*/
|
||||
const loadComponent = (componentPath, placeholderId) => {
|
||||
return fetch(componentPath)
|
||||
@@ -38,8 +40,14 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const currentPagePath = window.location.pathname;
|
||||
|
||||
navLinks.forEach(link => {
|
||||
const linkPath = new URL(link.href).pathname;
|
||||
if (linkPath === currentPagePath || (linkPath !== '/' && currentPagePath.startsWith(linkPath))) {
|
||||
// Normaliziramo poti, da se izognemo težavam z zadnjimi poševnicami
|
||||
const linkPath = new URL(link.href).pathname.replace(/\/$/, "");
|
||||
const currentPath = currentPagePath.replace(/\/$/, "");
|
||||
|
||||
// Korenska stran (/) se mora ujemati samo z linkom, ki kaže na "/"
|
||||
if (linkPath === "" && currentPath === "") {
|
||||
link.classList.add('active');
|
||||
} else if (linkPath !== "" && currentPath.startsWith(linkPath)) {
|
||||
link.classList.add('active');
|
||||
}
|
||||
});
|
||||
@@ -51,7 +59,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const initializeApp = () => {
|
||||
|
||||
// =================================================================
|
||||
// === LOGIKA ZA DRSNIK NA DOMAČI STRANI (PRILAGOJENO ZA MOBILNE NAPRAVE) ===
|
||||
// === LOGIKA ZA DRSNIK NA DOMAČI STRANI (NESPREMENJENO) ===
|
||||
// =================================================================
|
||||
const sliderElement = document.getElementById("slider");
|
||||
|
||||
@@ -64,49 +72,40 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
let slideInterval;
|
||||
const autoPlayDelay = 5000; // 5 sekund
|
||||
|
||||
// Funkcija za prikaz prosojnice
|
||||
const showSlide = (index) => {
|
||||
if (slides.length === 0) return;
|
||||
slides[current].classList.remove("active");
|
||||
current = (index + total) % total; // Modulo za ciklično ponavljanje
|
||||
current = (index + total) % total;
|
||||
slides[current].classList.add("active");
|
||||
};
|
||||
|
||||
// Funkcije za premikanje in pavzo
|
||||
const nextSlide = () => showSlide(current + 1);
|
||||
const prevSlide = () => showSlide(current - 1);
|
||||
const pauseSlider = () => clearInterval(slideInterval);
|
||||
|
||||
// Funkcija za zagon (ali ponovni zagon) drsnika
|
||||
const startSlider = () => {
|
||||
pauseSlider(); // Najprej ustavimo morebitni obstoječi interval
|
||||
if (slides.length > 1) { // Zaženemo samo, če je več kot en slide
|
||||
pauseSlider();
|
||||
if (slides.length > 1) {
|
||||
slideInterval = setInterval(nextSlide, autoPlayDelay);
|
||||
}
|
||||
};
|
||||
|
||||
// Dogodki za ročno navigacijo
|
||||
prevBtn.addEventListener("click", () => {
|
||||
prevSlide();
|
||||
startSlider(); // Ponovno zaženi časovnik ob ročni interakciji
|
||||
});
|
||||
|
||||
nextBtn.addEventListener("click", () => {
|
||||
nextSlide();
|
||||
startSlider(); // Ponovno zaženi časovnik ob ročni interakciji
|
||||
});
|
||||
if (prevBtn && nextBtn) {
|
||||
prevBtn.addEventListener("click", () => {
|
||||
prevSlide();
|
||||
startSlider();
|
||||
});
|
||||
|
||||
nextBtn.addEventListener("click", () => {
|
||||
nextSlide();
|
||||
startSlider();
|
||||
});
|
||||
}
|
||||
|
||||
// --- DOGODKI ZA PAVZO ---
|
||||
// 1. Pavza ob preletu z miško (za namizne računalnike)
|
||||
sliderElement.addEventListener('mouseenter', pauseSlider);
|
||||
|
||||
// 2. Nadaljevanje ob umiku miške (za namizne računalnike)
|
||||
sliderElement.addEventListener('mouseleave', startSlider);
|
||||
|
||||
// 3. Pavza ob dotiku (za mobilne naprave)
|
||||
sliderElement.addEventListener('touchstart', pauseSlider, { passive: true });
|
||||
|
||||
// Zagon drsnika ob nalaganju strani
|
||||
startSlider();
|
||||
}
|
||||
|
||||
@@ -138,7 +137,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}
|
||||
|
||||
// =================================================================
|
||||
// === OBSTOJEČA KODA ZA PODSTRANI (NESPREMENJENO) ===
|
||||
// === OSTALA OBSTOJEČA KODA (NESPREMENJENO) ===
|
||||
// =================================================================
|
||||
|
||||
// Animacije ob pomikanju (Intersection Observer)
|
||||
@@ -166,43 +165,91 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}
|
||||
});
|
||||
|
||||
// Koda za kontaktni obrazec
|
||||
// =================================================================
|
||||
// === KODA ZA KONTAKTNI OBRAZEC (NADGRAJENO IN SPREMENJENO) ===
|
||||
// =================================================================
|
||||
const contactForm = document.getElementById('contact-form');
|
||||
if (contactForm) {
|
||||
// Poiščemo element za sporočila. Če ne obstaja, ga ustvarimo in dodamo.
|
||||
let formMessageElement = contactForm.querySelector('.form-message');
|
||||
if (!formMessageElement) {
|
||||
formMessageElement = document.createElement('div');
|
||||
formMessageElement.className = 'form-message';
|
||||
formMessageElement.setAttribute('aria-live', 'polite');
|
||||
contactForm.appendChild(formMessageElement);
|
||||
// Vstavimo ga pred gumbom za pošiljanje
|
||||
const submitButton = contactForm.querySelector('button[type="submit"]');
|
||||
if (submitButton) {
|
||||
submitButton.parentElement.insertAdjacentElement('beforebegin', formMessageElement);
|
||||
} else {
|
||||
contactForm.appendChild(formMessageElement);
|
||||
}
|
||||
}
|
||||
|
||||
contactForm.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
const name = document.getElementById('name').value;
|
||||
const email = document.getElementById('email').value;
|
||||
const message = document.getElementById('message').value;
|
||||
formMessageElement.textContent = '';
|
||||
formMessageElement.className = 'form-message';
|
||||
e.preventDefault(); // Preprečimo privzeto pošiljanje obrazca
|
||||
|
||||
const submitButton = contactForm.querySelector('button[type="submit"]');
|
||||
const originalButtonText = submitButton.textContent;
|
||||
|
||||
if (name.trim() === '' || email.trim() === '' || message.trim() === '') {
|
||||
// Zberemo podatke iz obrazca
|
||||
const formData = {
|
||||
name: document.getElementById('name').value,
|
||||
email: document.getElementById('email').value,
|
||||
message: document.getElementById('message').value
|
||||
};
|
||||
|
||||
// Osnovna validacija na strani klienta (dopolnitev strežniške)
|
||||
if (formData.name.trim() === '' || formData.email.trim() === '' || formData.message.trim() === '') {
|
||||
formMessageElement.textContent = 'Prosimo, izpolnite vsa polja.';
|
||||
formMessageElement.classList.add('error', 'visible');
|
||||
return;
|
||||
}
|
||||
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
||||
if (!emailPattern.test(email)) {
|
||||
formMessageElement.textContent = 'Prosimo, vnesite veljaven e-poštni naslov.';
|
||||
formMessageElement.classList.add('error', 'visible');
|
||||
formMessageElement.className = 'form-message error visible';
|
||||
return;
|
||||
}
|
||||
|
||||
formMessageElement.textContent = 'Hvala za vaše sporočilo! Odgovoril/a vam bom v najkrajšem možnem času.';
|
||||
formMessageElement.classList.add('success', 'visible');
|
||||
contactForm.reset();
|
||||
setTimeout(() => formMessageElement.classList.remove('visible'), 5000);
|
||||
// Vizualna povratna informacija, da se je pošiljanje začelo
|
||||
submitButton.disabled = true;
|
||||
submitButton.textContent = 'Pošiljam...';
|
||||
formMessageElement.className = 'form-message'; // Skrijemo prejšnja sporočila
|
||||
|
||||
// Pošljemo podatke na PHP skripto z uporabo Fetch API
|
||||
fetch('/api/send_mail.php', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(formData),
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
// Ko prejmemo odgovor od strežnika, ga prikažemo
|
||||
formMessageElement.textContent = data.message;
|
||||
if (data.success) {
|
||||
formMessageElement.classList.add('success', 'visible');
|
||||
contactForm.reset(); // Počistimo obrazec ob uspehu
|
||||
// Resetiramo števec znakov
|
||||
const charCounter = document.getElementById('char-counter');
|
||||
if(charCounter) {
|
||||
const maxLength = document.getElementById('message').getAttribute('maxlength');
|
||||
charCounter.textContent = `${maxLength} znakov na voljo`;
|
||||
charCounter.className = 'char-counter';
|
||||
}
|
||||
} else {
|
||||
formMessageElement.classList.add('error', 'visible');
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
// V primeru mrežne napake ali če strežnik ni dosegljiv
|
||||
console.error('Napaka pri pošiljanju:', error);
|
||||
formMessageElement.textContent = 'Prišlo je do napake pri povezavi. Prosimo, poskusite kasneje.';
|
||||
formMessageElement.className = 'form-message error visible';
|
||||
})
|
||||
.finally(() => {
|
||||
// Ne glede na rezultat, gumbu povrnemo prvotno stanje
|
||||
submitButton.disabled = false;
|
||||
submitButton.textContent = originalButtonText;
|
||||
});
|
||||
});
|
||||
|
||||
// Logika za števec znakov (ohranjeno in nespremenjeno)
|
||||
const messageTextarea = document.getElementById('message');
|
||||
const charCounter = document.getElementById('char-counter');
|
||||
|
||||
@@ -215,21 +262,19 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
charCounter.textContent = `${remaining} znakov na voljo`;
|
||||
|
||||
charCounter.classList.remove('warning', 'limit');
|
||||
if (remaining < 0) {
|
||||
charCounter.classList.add('limit');
|
||||
charCounter.classList.remove('warning');
|
||||
} else if (remaining <= 20) {
|
||||
charCounter.classList.add('warning');
|
||||
charCounter.classList.remove('limit');
|
||||
} else {
|
||||
charCounter.classList.remove('warning');
|
||||
charCounter.classList.remove('limit');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Gumb za na vrh
|
||||
// =================================================================
|
||||
// === GUMB ZA NA VRH (NESPREMENJENO) ===
|
||||
// =================================================================
|
||||
const backToTopButton = document.getElementById('back-to-top-btn');
|
||||
if (backToTopButton) {
|
||||
window.addEventListener('scroll', () => {
|
||||
@@ -251,18 +296,8 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
};
|
||||
|
||||
// --- Glavni Zagon Aplikacije ---
|
||||
if (document.getElementById('header-placeholder') && document.getElementById('footer-placeholder')) {
|
||||
Promise.all([
|
||||
loadComponent('/layouts/header.html', 'header-placeholder'),
|
||||
loadComponent('/layouts/footer.html', 'footer-placeholder')
|
||||
]).then(() => {
|
||||
setCurrentYear();
|
||||
setActiveNavLink();
|
||||
initializeApp();
|
||||
});
|
||||
} else {
|
||||
setCurrentYear();
|
||||
setActiveNavLink();
|
||||
initializeApp();
|
||||
}
|
||||
// Poenostavljen zagon, saj nalaganje komponent ni potrebno.
|
||||
setCurrentYear();
|
||||
setActiveNavLink();
|
||||
initializeApp();
|
||||
});
|
||||
Reference in new issue
Block a user