217 lines
5.7 KiB
JavaScript
217 lines
5.7 KiB
JavaScript
// ===============================
|
|
// GALLERY — Rendering + Filtri + Ordinamento
|
|
// ===============================
|
|
|
|
// ===============================
|
|
// 1. ORDINAMENTO
|
|
// ===============================
|
|
function sortByDate(photos, direction = "desc") {
|
|
return photos.slice().sort((a, b) => {
|
|
const da = a?.taken_at ? new Date(a.taken_at) : 0;
|
|
const db = b?.taken_at ? new Date(b.taken_at) : 0;
|
|
return direction === "asc" ? (da - db) : (db - da);
|
|
});
|
|
}
|
|
|
|
// ===============================
|
|
// 2. FILTRI
|
|
// ===============================
|
|
function applyFilters(photos) {
|
|
const filter = window.currentFilter;
|
|
if (!filter) return photos;
|
|
|
|
switch (filter) {
|
|
case "folder":
|
|
return photos.filter(p => p.cartella);
|
|
|
|
case "location":
|
|
return photos.filter(p => p?.gps?.lat && p?.gps?.lng);
|
|
|
|
case "type":
|
|
return photos.filter(p => p?.mime_type?.startsWith("image/"));
|
|
|
|
default:
|
|
return photos;
|
|
}
|
|
}
|
|
|
|
// ===============================
|
|
// 3. RAGGRUPPAMENTO
|
|
// ===============================
|
|
function groupByDate(photos, mode = "auto") {
|
|
const sections = [];
|
|
const now = new Date();
|
|
|
|
function getLabel(photo) {
|
|
const date = photo?.taken_at ? new Date(photo.taken_at) : null;
|
|
if (!date || isNaN(+date)) return "Senza data";
|
|
|
|
const diffDays = Math.floor((now - date) / 86400000);
|
|
|
|
if (mode === "day") return formatDay(date);
|
|
if (mode === "month") return formatMonth(date);
|
|
if (mode === "year") return String(date.getFullYear());
|
|
|
|
if (diffDays === 0) return "Oggi";
|
|
if (diffDays === 1) return "Ieri";
|
|
if (diffDays <= 7) return "Questa settimana";
|
|
if (diffDays <= 14) return "La settimana scorsa";
|
|
if (diffDays <= 30) return "Questo mese";
|
|
if (diffDays <= 60) return "Mese scorso";
|
|
|
|
if (date.getFullYear() === now.getFullYear()) return formatMonth(date);
|
|
return String(date.getFullYear());
|
|
}
|
|
|
|
for (const photo of photos) {
|
|
const label = getLabel(photo);
|
|
let section = sections.find(s => s.label === label);
|
|
if (!section) {
|
|
section = { label, photos: [] };
|
|
sections.push(section);
|
|
}
|
|
section.photos.push(photo);
|
|
}
|
|
|
|
return sections;
|
|
}
|
|
|
|
// ===============================
|
|
// 4. FORMATTATORI
|
|
// ===============================
|
|
function formatDay(date) {
|
|
return date.toLocaleDateString("it-IT", {
|
|
weekday: "long",
|
|
day: "numeric",
|
|
month: "long"
|
|
});
|
|
}
|
|
|
|
function formatMonth(date) {
|
|
return date.toLocaleDateString("it-IT", {
|
|
month: "long",
|
|
year: "numeric"
|
|
});
|
|
}
|
|
|
|
// ===============================
|
|
// 5. RENDER GALLERY
|
|
// ===============================
|
|
function renderGallery(sections) {
|
|
const gallery = document.getElementById("gallery");
|
|
if (!gallery) return;
|
|
|
|
gallery.innerHTML = "";
|
|
|
|
for (const section of sections) {
|
|
const h = document.createElement("h2");
|
|
h.className = "gallery-section-title";
|
|
h.textContent = section.label;
|
|
gallery.appendChild(h);
|
|
|
|
const container = document.createElement("div");
|
|
container.className = "gallery-section";
|
|
|
|
section.photos.forEach((photo, idx) => {
|
|
const thumbDiv = document.createElement("div");
|
|
thumbDiv.className = "thumb";
|
|
thumbDiv.id = "photo_" + photo.id;
|
|
|
|
// 🔥 NUOVO: se soft-deleted → aggiungi classe
|
|
if (photo.deleted_at) {
|
|
thumbDiv.classList.add("soft-deleted");
|
|
}
|
|
|
|
|
|
const thumb = toAbsoluteUrl(
|
|
photo.thub2 || photo.thub1 || photo.path,
|
|
photo.name,
|
|
"thumbs",
|
|
photo.cartella
|
|
);
|
|
|
|
const original = toAbsoluteUrl(
|
|
photo.path,
|
|
photo.name,
|
|
"original",
|
|
photo.cartella
|
|
);
|
|
|
|
const img = document.createElement("img");
|
|
img.src = thumb;
|
|
img.alt = photo?.name || "";
|
|
img.loading = "lazy";
|
|
thumbDiv.appendChild(img);
|
|
|
|
if (photo?.mime_type?.startsWith("video/")) {
|
|
const play = document.createElement("div");
|
|
play.className = "play-icon";
|
|
play.textContent = "▶";
|
|
thumbDiv.appendChild(play);
|
|
}
|
|
|
|
thumbDiv.addEventListener("click", () => {
|
|
window.closeBottomSheet?.();
|
|
|
|
if (typeof window.openModalFromList === "function") {
|
|
window.openModalFromList(section.photos, idx);
|
|
} else {
|
|
window.openModal?.(original, thumb, photo);
|
|
}
|
|
});
|
|
|
|
container.appendChild(thumbDiv);
|
|
});
|
|
|
|
gallery.appendChild(container);
|
|
}
|
|
}
|
|
|
|
// ===============================
|
|
// 6. REFRESH GALLERY
|
|
// ===============================
|
|
function refreshGallery() {
|
|
let photos = getLocalPhotos();
|
|
console.log("[refreshGallery] numero foto:", photos.length);
|
|
|
|
// 🔥 NUOVO: flag per mostrare i soft delete
|
|
const showDeleted = document.getElementById("showDeleted")?.checked;
|
|
|
|
if (!showDeleted) {
|
|
photos = photos.filter(p => !p.deleted_at);
|
|
}
|
|
|
|
const filtered = applyFilters(photos);
|
|
const sorted = sortByDate(filtered, window.currentSort || "desc");
|
|
const sections = groupByDate(sorted, window.currentGroup || "auto");
|
|
|
|
renderGallery(sections);
|
|
}
|
|
|
|
// EXPORT
|
|
window.sortByDate = sortByDate;
|
|
window.applyFilters = applyFilters;
|
|
window.groupByDate = groupByDate;
|
|
window.renderGallery = renderGallery;
|
|
window.refreshGallery = refreshGallery;
|
|
|
|
// ===============================
|
|
// TOGGLE "MOSTRA ELIMINATE"
|
|
// ===============================
|
|
window.addEventListener("DOMContentLoaded", () => {
|
|
const checkbox = document.getElementById("showDeleted");
|
|
if (!checkbox) return;
|
|
|
|
// Ripristina stato salvato
|
|
const saved = localStorage.getItem("showDeleted") === "1";
|
|
checkbox.checked = saved;
|
|
|
|
// Rinfresca la gallery al primo avvio
|
|
refreshGallery();
|
|
|
|
// Salva e aggiorna quando cambia
|
|
checkbox.addEventListener("change", () => {
|
|
localStorage.setItem("showDeleted", checkbox.checked ? "1" : "0");
|
|
refreshGallery();
|
|
});
|
|
});
|