58 lines
1.3 KiB
JavaScript
58 lines
1.3 KiB
JavaScript
const API_URL = 'https://prova.patachina.it/photos';
|
|
|
|
async function loadPhotos() {
|
|
const res = await fetch(API_URL);
|
|
if (!res.ok) {
|
|
console.error('Errore nel fetch', res.status);
|
|
return;
|
|
}
|
|
const data = await res.json();
|
|
renderGallery(data);
|
|
}
|
|
|
|
function renderGallery(photos) {
|
|
const gallery = document.getElementById('gallery');
|
|
gallery.innerHTML = '';
|
|
|
|
photos.forEach(photo => {
|
|
const thumbDiv = document.createElement('div');
|
|
thumbDiv.className = 'thumb';
|
|
|
|
const img = document.createElement('img');
|
|
// anteprima
|
|
img.src = `https://prova.patachina.it/${photo.thub1}`;
|
|
img.alt = photo.name || '';
|
|
|
|
thumbDiv.appendChild(img);
|
|
|
|
// click: apri immagine grande
|
|
thumbDiv.addEventListener('click', () => {
|
|
openModal(`https://prova.patachina.it/${photo.path}`);
|
|
});
|
|
|
|
gallery.appendChild(thumbDiv);
|
|
});
|
|
}
|
|
|
|
// Modal
|
|
const modal = document.getElementById('modal');
|
|
const modalImg = document.getElementById('modalImage');
|
|
const modalClose = document.getElementById('modalClose');
|
|
|
|
function openModal(src) {
|
|
modalImg.src = src;
|
|
modal.classList.add('open');
|
|
}
|
|
|
|
function closeModal() {
|
|
modal.classList.remove('open');
|
|
modalImg.src = '';
|
|
}
|
|
|
|
modalClose.addEventListener('click', closeModal);
|
|
modal.addEventListener('click', (e) => {
|
|
if (e.target === modal) closeModal();
|
|
});
|
|
|
|
// avvio
|
|
loadPhotos();
|