commit 93d56a472506454da93a6d12f5df4bfc538040e1 Author: Fabio Date: Sat Feb 21 09:20:13 2026 +0100 first commit diff --git a/app.js b/app.js new file mode 100644 index 0000000..6e4288b --- /dev/null +++ b/app.js @@ -0,0 +1,58 @@ +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(); diff --git a/index.html b/index.html new file mode 100644 index 0000000..350bd86 --- /dev/null +++ b/index.html @@ -0,0 +1,80 @@ + + + + + Galleria foto + + + +

Galleria foto

+ + + + + + +