99 lines
2.6 KiB
JavaScript
99 lines
2.6 KiB
JavaScript
// ===============================
|
|
// BOTTOM SHEET (Google Photos Web)
|
|
// ===============================
|
|
|
|
// Striscia foto (MAPPA)
|
|
const bottomSheet = document.getElementById("bottomSheet");
|
|
const sheetGallery = document.getElementById("sheetGallery");
|
|
|
|
// Menu ⋮ (OPZIONI) — NON usare const se già definito altrove
|
|
let optionsSheetRef = document.getElementById("optionsSheet");
|
|
|
|
// Overlay per chiudere i bottom sheet
|
|
let sheetOverlay = document.getElementById("sheetOverlay");
|
|
if (!sheetOverlay) {
|
|
sheetOverlay = document.createElement("div");
|
|
sheetOverlay.id = "sheetOverlay";
|
|
sheetOverlay.className = "sheet-overlay";
|
|
document.body.appendChild(sheetOverlay);
|
|
}
|
|
|
|
// ===============================
|
|
// STRISCIA FOTO (MAPPA)
|
|
// ===============================
|
|
|
|
function openBottomSheet(photoList) {
|
|
sheetGallery.innerHTML = "";
|
|
|
|
photoList.forEach(photo => {
|
|
const div = document.createElement("div");
|
|
div.className = "sheet-item";
|
|
|
|
div.innerHTML = `
|
|
<img src="https://prova.patachina.it/${photo.thub1}">
|
|
`;
|
|
|
|
div.addEventListener("click", () => {
|
|
openModal(
|
|
`https://prova.patachina.it/${photo.path}`,
|
|
photo.thub2
|
|
? `https://prova.patachina.it/${photo.thub2}`
|
|
: `https://prova.patachina.it/${photo.thub1}`,
|
|
photo
|
|
);
|
|
});
|
|
|
|
sheetGallery.appendChild(div);
|
|
});
|
|
|
|
bottomSheet.classList.add("open");
|
|
sheetOverlay.classList.add("open");
|
|
}
|
|
|
|
function closeBottomSheet() {
|
|
bottomSheet.classList.remove("open");
|
|
sheetOverlay.classList.remove("open");
|
|
}
|
|
|
|
// ===============================
|
|
// MENU ⋮ (OPZIONI)
|
|
// ===============================
|
|
|
|
function openOptionsSheet() {
|
|
optionsSheetRef.classList.add("open");
|
|
sheetOverlay.classList.add("open");
|
|
}
|
|
|
|
function closeOptionsSheet() {
|
|
optionsSheetRef.classList.remove("open");
|
|
sheetOverlay.classList.remove("open");
|
|
}
|
|
|
|
// ===============================
|
|
// CHIUSURA CLICCANDO FUORI
|
|
// ===============================
|
|
|
|
sheetOverlay.addEventListener("click", () => {
|
|
closeBottomSheet();
|
|
closeOptionsSheet();
|
|
});
|
|
|
|
// ===============================
|
|
// CHIUSURA TOCCANDO LA MANIGLIA
|
|
// ===============================
|
|
|
|
document.querySelectorAll(".sheet-header").forEach(header => {
|
|
header.addEventListener("click", () => {
|
|
closeBottomSheet();
|
|
closeOptionsSheet();
|
|
});
|
|
});
|
|
|
|
// ===============================
|
|
// ESPORTIAMO LE FUNZIONI
|
|
// ===============================
|
|
|
|
window.openBottomSheet = openBottomSheet;
|
|
window.closeBottomSheet = closeBottomSheet;
|
|
window.openOptionsSheet = openOptionsSheet;
|
|
window.closeOptionsSheet = closeOptionsSheet;
|