From 931b3642ea8eca903510242eca2f2e4733ff0473 Mon Sep 17 00:00:00 2001 From: phamhungd Date: Sat, 29 Nov 2025 22:07:05 +0700 Subject: [PATCH] Revert "fix" This reverts commit d9ac3c2cc51586e48520c9a5c343a069aef836aa. --- static/modules/gallery.js | 137 ++++++++++++++++---------------------- static/script.js | 24 ++++--- 2 files changed, 71 insertions(+), 90 deletions(-) diff --git a/static/modules/gallery.js b/static/modules/gallery.js index e7cfd71..b99e730 100644 --- a/static/modules/gallery.js +++ b/static/modules/gallery.js @@ -1,69 +1,35 @@ import { withCacheBuster } from './utils.js'; import { extractMetadataFromBlob } from './metadata.js'; -const GALLERY_STATE_KEY = 'gemini-app-gallery-state'; -const FILTER_STORAGE_KEY = 'gemini-app-history-filter'; // legacy (single-state) -const SEARCH_STORAGE_KEY = 'gemini-app-history-search'; // legacy (single-state) +const FILTER_STORAGE_KEY = 'gemini-app-history-filter'; +const SEARCH_STORAGE_KEY = 'gemini-app-history-search'; const SOURCE_STORAGE_KEY = 'gemini-app-history-source'; const VALID_SOURCES = ['generated', 'uploads']; export function createGallery({ galleryGrid, onSelect }) { + let currentFilter = 'all'; + let searchQuery = ''; let currentSource = 'generated'; let allImages = []; let favorites = []; - let perSourceState = { - generated: { filter: 'all', search: '', favoritesOnly: false }, - uploads: { filter: 'all', search: '', favoritesOnly: false }, - }; + let showOnlyFavorites = false; // New toggle state - const persistState = () => { - try { - localStorage.setItem(GALLERY_STATE_KEY, JSON.stringify({ - sourceState: perSourceState, - source: currentSource, - })); - } catch (e) { - console.warn('Failed to persist gallery state', e); - } - }; - - // Load saved state (with legacy fallback) + // Load saved filter and search from localStorage try { - const saved = localStorage.getItem(GALLERY_STATE_KEY); - if (saved) { - const parsed = JSON.parse(saved); - if (parsed?.sourceState) { - perSourceState = { - generated: { filter: 'all', search: '', favoritesOnly: false, ...(parsed.sourceState.generated || {}) }, - uploads: { filter: 'all', search: '', favoritesOnly: false, ...(parsed.sourceState.uploads || {}) }, - }; - } - if (parsed?.source && VALID_SOURCES.includes(parsed.source)) { - currentSource = parsed.source; - } - } else { - // Legacy fallback (single state) - const savedFilter = localStorage.getItem(FILTER_STORAGE_KEY); - const savedSearch = localStorage.getItem(SEARCH_STORAGE_KEY); - if (savedFilter) perSourceState.generated.filter = savedFilter; - if (savedSearch) perSourceState.generated.search = savedSearch; - } + const savedFilter = localStorage.getItem(FILTER_STORAGE_KEY); + if (savedFilter) currentFilter = savedFilter; + + const savedSearch = localStorage.getItem(SEARCH_STORAGE_KEY); + if (savedSearch) searchQuery = savedSearch; const savedSource = localStorage.getItem(SOURCE_STORAGE_KEY); if (savedSource && VALID_SOURCES.includes(savedSource)) { currentSource = savedSource; } } catch (e) { - console.warn('Failed to load gallery state', e); + console.warn('Failed to load history filter/search', e); } - const getState = (source = currentSource) => { - if (!perSourceState[source]) { - perSourceState[source] = { filter: 'all', search: '', favoritesOnly: false }; - } - return perSourceState[source]; - }; - // Load favorites from backend async function loadFavorites() { try { @@ -152,29 +118,27 @@ export function createGallery({ galleryGrid, onSelect }) { } function matchesSearch(imageUrl) { - const { search } = getState(); - if (!search) return true; + if (!searchQuery) return true; const filename = imageUrl.split('/').pop().split('?')[0]; - return filename.toLowerCase().includes(search.toLowerCase()); + return filename.toLowerCase().includes(searchQuery.toLowerCase()); } function shouldShowImage(imageUrl) { - const state = getState(); // First check text search if (!matchesSearch(imageUrl)) return false; // Check favorites toggle - if enabled, only show favorites - if (state.favoritesOnly && !isFavorite(imageUrl)) { + if (showOnlyFavorites && !isFavorite(imageUrl)) { return false; } // Then check date filter - if (state.filter === 'all') return true; + if (currentFilter === 'all') return true; const timestamp = getFileTimestamp(imageUrl); - if (!timestamp) return state.filter === 'all'; + if (!timestamp) return currentFilter === 'all'; - switch (state.filter) { + switch (currentFilter) { case 'today': return isToday(timestamp); case 'week': @@ -341,33 +305,35 @@ export function createGallery({ galleryGrid, onSelect }) { function setFilter(filterType) { if (currentFilter === filterType) return; - const state = getState(); - state.filter = filterType; - persistState(); + currentFilter = filterType; + + // Save to localStorage + try { + localStorage.setItem(FILTER_STORAGE_KEY, filterType); + } catch (e) { + console.warn('Failed to save history filter', e); + } + renderGallery(); } function setSearch(query) { - const state = getState(); - state.search = query || ''; - persistState(); + searchQuery = query || ''; + + // Save to localStorage + try { + localStorage.setItem(SEARCH_STORAGE_KEY, searchQuery); + } catch (e) { + console.warn('Failed to save history search', e); + } + renderGallery(); } function toggleFavorites() { - const state = getState(); - state.favoritesOnly = !state.favoritesOnly; - persistState(); + showOnlyFavorites = !showOnlyFavorites; renderGallery(); - return state.favoritesOnly; - } - - function setFavoritesActive(active) { - const state = getState(); - state.favoritesOnly = Boolean(active); - persistState(); - renderGallery(); - return state.favoritesOnly; + return showOnlyFavorites; } function setSource(source, { resetFilters = false } = {}) { @@ -379,22 +345,25 @@ export function createGallery({ galleryGrid, onSelect }) { console.warn('Failed to save history source', e); } if (resetFilters) { - const state = getState(); - state.filter = 'all'; - state.favoritesOnly = false; - state.search = ''; - persistState(); + currentFilter = 'all'; + showOnlyFavorites = false; + searchQuery = ''; + try { + localStorage.setItem(FILTER_STORAGE_KEY, currentFilter); + localStorage.setItem(SEARCH_STORAGE_KEY, searchQuery); + } catch (e) { + console.warn('Failed to reset history filters', e); + } } - persistState(); return load(); } function getCurrentFilter() { - return getState().filter; + return currentFilter; } function getSearchQuery() { - return getState().search; + return searchQuery; } function getCurrentSource() { @@ -402,7 +371,13 @@ export function createGallery({ galleryGrid, onSelect }) { } function isFavoritesActive() { - return getState().favoritesOnly; + return showOnlyFavorites; + } + + function setFavoritesActive(active) { + showOnlyFavorites = Boolean(active); + renderGallery(); + return showOnlyFavorites; } function setSearchQuery(value) { diff --git a/static/script.js b/static/script.js index 62ea9a8..d48b1b6 100644 --- a/static/script.js +++ b/static/script.js @@ -1713,24 +1713,30 @@ document.addEventListener('DOMContentLoaded', () => { b.classList.toggle('active', active); b.setAttribute('aria-pressed', String(active)); }); - await gallery.setSource(targetSource, { resetFilters: false }); + await gallery.setSource(targetSource, { resetFilters: true }); - // Sync UI with persisted state (filter, favorites, search) - const activeFilter = gallery.getCurrentFilter ? gallery.getCurrentFilter() : 'all'; + // Reset filters UI to show all when switching source historyFilterBtns.forEach(b => { if (!b.classList.contains('history-favorites-btn')) { - const isFilterActive = b.dataset.filter === activeFilter; - b.classList.toggle('active', isFilterActive); + b.classList.toggle('active', b.dataset.filter === 'all'); } }); - if (historyFavoritesBtn && gallery.isFavoritesActive) { - historyFavoritesBtn.classList.toggle('active', gallery.isFavoritesActive()); + // Disable favorites toggle on source change + if (historyFavoritesBtn) { + historyFavoritesBtn.classList.remove('active'); + } + if (gallery.setFavoritesActive) { + gallery.setFavoritesActive(false); } + // Clear search box const historySearchInputEl = document.getElementById('history-search-input'); - if (historySearchInputEl && gallery.getSearchQuery) { - historySearchInputEl.value = gallery.getSearchQuery(); + if (historySearchInputEl) { + historySearchInputEl.value = ''; + } + if (gallery.setSearchQuery) { + gallery.setSearchQuery(''); } }); });