2025-05-24 16:47:32 +02:00
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
updateNavVisibility();
|
|
|
|
setInterval(updateNavVisibility, 1000); // Aktualizuj co sekundę
|
|
|
|
});
|
|
|
|
|
2025-05-23 15:25:48 +02:00
|
|
|
function updateNavVisibility() {
|
|
|
|
const token = localStorage.getItem('token');
|
|
|
|
document.querySelectorAll('.anonymous-links, .user-links').forEach(el => {
|
2025-05-24 16:47:32 +02:00
|
|
|
el.style.display = 'none';
|
2025-05-23 15:25:48 +02:00
|
|
|
});
|
2025-05-24 16:47:32 +02:00
|
|
|
|
|
|
|
if (token) {
|
|
|
|
document.querySelector('.user-links').style.display = 'flex';
|
|
|
|
} else {
|
|
|
|
document.querySelector('.anonymous-links').style.display = 'flex';
|
|
|
|
}
|
2025-05-23 15:25:48 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
document.getElementById('logoutLink')?.addEventListener('click', (e) => {
|
|
|
|
e.preventDefault();
|
|
|
|
localStorage.removeItem('token');
|
|
|
|
localStorage.removeItem('imie');
|
|
|
|
window.location.href = '/';
|
|
|
|
});
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
updateNavVisibility();
|
|
|
|
|
|
|
|
// Aktualizuj awatar/imię w nagłówku
|
|
|
|
const userName = localStorage.getItem('imie');
|
|
|
|
if(userName) {
|
|
|
|
const profileLink = document.querySelector('a[href="/profile.html"]');
|
|
|
|
if(profileLink) profileLink.innerHTML = `👤 ${userName}`;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
async function loadUserData() {
|
|
|
|
const response = await fetch('/api/check-auth');
|
|
|
|
const data = await response.json();
|
|
|
|
updateNavVisibility(data.authenticated);
|
|
|
|
}
|
|
|
|
|
|
|
|
document.getElementById('loginForm')?.addEventListener('submit', async (e) => {
|
|
|
|
e.preventDefault();
|
|
|
|
const email = document.getElementById('loginEmail').value;
|
|
|
|
const password = document.getElementById('loginPassword').value;
|
|
|
|
|
|
|
|
const response = await fetch('/login', {
|
|
|
|
method: 'POST',
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json',
|
|
|
|
},
|
|
|
|
body: JSON.stringify({ email, haslo: password }),
|
|
|
|
});
|
|
|
|
|
|
|
|
const data = await response.json();
|
|
|
|
if (response.ok) {
|
|
|
|
localStorage.setItem('token', data.token);
|
|
|
|
localStorage.setItem('imie', data.imie);
|
|
|
|
window.location.href = '/';
|
|
|
|
} else {
|
|
|
|
alert(data.message || 'Logowanie nieudane');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
document.getElementById('registerForm')?.addEventListener('submit', async (e) => {
|
|
|
|
e.preventDefault();
|
|
|
|
const name = document.getElementById('registerName').value;
|
|
|
|
const email = document.getElementById('registerEmail').value;
|
|
|
|
const password = document.getElementById('registerPassword').value;
|
|
|
|
const confirmPassword = document.getElementById('registerConfirmPassword').value;
|
|
|
|
|
|
|
|
if (password !== confirmPassword) {
|
|
|
|
alert('Hasła nie są identyczne');
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
const response = await fetch('/rejestracja', {
|
|
|
|
method: 'POST',
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json',
|
|
|
|
},
|
|
|
|
body: JSON.stringify({ imie: name, email, haslo: password, confirmPassword }),
|
|
|
|
});
|
|
|
|
|
|
|
|
if (response.ok) {
|
|
|
|
alert('Rejestracja udana');
|
|
|
|
window.location.href = '/login.html';
|
|
|
|
} else {
|
|
|
|
const data = await response.text();
|
|
|
|
alert(data || 'Rejestracja nieudana');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2025-05-24 16:47:32 +02:00
|
|
|
async function loadBooks(searchTerm = '') {
|
2025-05-23 15:25:48 +02:00
|
|
|
try {
|
2025-05-24 16:47:32 +02:00
|
|
|
const response = await fetch(`/api/ksiazki?search=${encodeURIComponent(searchTerm)}`);
|
|
|
|
if (!response.ok) throw new Error(`Błąd HTTP: ${response.status}`);
|
2025-05-23 15:25:48 +02:00
|
|
|
const books = await response.json();
|
2025-05-24 16:47:32 +02:00
|
|
|
renderBooks(books);
|
2025-05-23 15:25:48 +02:00
|
|
|
} catch (error) {
|
2025-05-24 16:47:32 +02:00
|
|
|
console.error('Błąd ładowania książek:', error);
|
|
|
|
showError('Wystąpił błąd podczas ładowania książek');
|
2025-05-23 15:25:48 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2025-05-24 16:47:32 +02:00
|
|
|
// Inicjalizacja przy pierwszym załadowaniu
|
2025-05-23 15:25:48 +02:00
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
if (document.getElementById('books-container')) {
|
|
|
|
loadBooks();
|
|
|
|
}
|
2025-05-24 16:47:32 +02:00
|
|
|
|
|
|
|
// Nasłuchiwanie wyszukiwania
|
|
|
|
document.getElementById('searchInput')?.addEventListener('input', (e) => {
|
|
|
|
loadBooks(e.target.value);
|
|
|
|
});
|
|
|
|
|
|
|
|
updateNavVisibility();
|
2025-05-23 15:25:48 +02:00
|
|
|
});
|
|
|
|
|
2025-05-24 16:47:32 +02:00
|
|
|
document.getElementById('searchForm')?.addEventListener('submit', async (e) => {
|
|
|
|
e.preventDefault();
|
|
|
|
const searchTerm = document.querySelector('#searchForm input').value;
|
|
|
|
const response = await fetch(`/api/ksiazki?search=${encodeURIComponent(searchTerm)}`);
|
|
|
|
const books = await response.json();
|
|
|
|
renderBooks(books);
|
2025-05-23 15:25:48 +02:00
|
|
|
});
|
|
|
|
|
2025-05-24 16:47:32 +02:00
|
|
|
function renderBooks(books) {
|
|
|
|
const container = document.getElementById('books-container');
|
|
|
|
if (!container) return;
|
|
|
|
|
|
|
|
container.innerHTML = books.map(book => `
|
|
|
|
<div class="col-md-4 mb-4">
|
|
|
|
<div class="book-card card h-100">
|
|
|
|
<a href="/book.html?id=${book.id}" class="book-link">
|
|
|
|
<div class="book-cover">
|
|
|
|
<img src="${book.obraz_url}"
|
|
|
|
class="card-img-top"
|
|
|
|
alt="${book.tytul}"
|
|
|
|
onerror="this.src='/images/placeholder.jpg'">
|
|
|
|
<div class="book-overlay">
|
|
|
|
<h5 class="book-title">${book.tytul}</h5>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`).join('');
|
|
|
|
}
|
|
|
|
|
|
|
|
function showError(message) {
|
|
|
|
const container = document.getElementById('books-container');
|
|
|
|
if (!container) return;
|
|
|
|
|
|
|
|
container.innerHTML = `
|
|
|
|
<div class="col-12 text-center py-5">
|
|
|
|
<div class="alert alert-danger">
|
|
|
|
${message}<br>
|
|
|
|
<button class="btn btn-gothic mt-3" onclick="location.reload()">
|
|
|
|
Spróbuj ponownie
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`;
|
|
|
|
}
|
2025-05-23 15:25:48 +02:00
|
|
|
|
2025-05-24 16:47:32 +02:00
|
|
|
document.addEventListener('DOMContentLoaded', updateNavVisibility);
|