diff options
Diffstat (limited to 'src/App.svelte')
| -rw-r--r-- | src/App.svelte | 23 |
1 files changed, 22 insertions, 1 deletions
diff --git a/src/App.svelte b/src/App.svelte index bbc0c43..7d99875 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -2,6 +2,7 @@ import { flashair } from './lib/flashair'; import type { FlashAirFileEntry } from './lib/flashair'; import { imageCache } from './lib/cache'; + import { autoCacheService } from './lib/cache'; import ImageList from './lib/components/ImageList.svelte'; import ImagePreview from './lib/components/ImagePreview.svelte'; @@ -20,11 +21,15 @@ async function loadAllImages() { loading = true; error = undefined; + autoCacheService.stop(); try { images = await flashair.listAllImages('/DCIM'); if (images.length > 0 && selectedFile === undefined) { selectedFile = images[0]; } + if (images.length > 0) { + autoCacheService.start(images); + } } catch (e) { error = e instanceof Error ? e.message : String(e); images = []; @@ -50,9 +55,10 @@ deleting = true; try { await flashair.deleteFile(fileToDelete.path); - // Remove from cache + // Remove from cache and auto-cache queue void imageCache.delete('thumbnail', fileToDelete.path); void imageCache.delete('full', fileToDelete.path); + autoCacheService.removeImage(fileToDelete.path); // Remove from list and select next image const idx = images.findIndex((f) => f.path === fileToDelete.path); images = images.filter((f) => f.path !== fileToDelete.path); @@ -73,6 +79,15 @@ function cancelDelete() { showDeleteConfirm = false; } + + async function clearAllCache() { + autoCacheService.stop(); + await imageCache.clear(); + // Restart auto-caching from scratch + if (images.length > 0) { + autoCacheService.start(images); + } + } </script> <div class="flex h-screen bg-base-200"> @@ -144,6 +159,12 @@ </svg> {/if} </button> + <!-- Clear Cache --> + <button class="btn btn-lg btn-circle btn-warning" onclick={() => void clearAllCache()}> + <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-5"> + <path stroke-linecap="round" stroke-linejoin="round" d="M20.25 7.5l-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5m6 4.125l2.25 2.25m0 0l2.25 2.25M12 13.875l2.25-2.25M12 13.875l-2.25 2.25M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z" /> + </svg> + </button> <!-- Refresh --> <button class="btn btn-lg btn-circle btn-secondary" onclick={() => loadAllImages()}> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-5"> |