second day

view/src/stores/activeImage.ts

@@ -1,7 +0,0 @@
-import { writable } from "svelte/store";
-
-const r = "route" in localStorage ? localStorage.getItem("route"):"main";
-
-const store = writable<string>(r);
-
-export default store;

view/src/stores/images.ts

@@ -1,18 +1,12 @@
 import { writable } from "svelte/store";
+import Toast from "../components/Toast"
 import { openDB, DBSchema } from 'idb';
 
-interface Image {
-  name: string,
-  filename: string
-  lastModified: number
-  type: string
-  data: ArrayBuffer
-}
 
 interface ImageDB extends DBSchema {
   images: {
     value: Image;
-    key: string;
+    key: number;
     indexes: { 'filename': string };
   };
 }
@@ -38,26 +32,46 @@ const store = writable<Image[]>([]);
 
 async function add(img: Image | Image[]) {
 
+
   const images = Array.isArray(img) ? [...img] : [img];
+  if (!images.length) return;
 
   const tx = (await db).transaction('images', 'readwrite');
 
-  await Promise.all(images.map(img => tx.store.add(img)));
+  await Promise.all(images.map(img => {
+    delete img.id;
+    return tx.store.add(img);
+  }));
+
+  Toast.info("Loaded <b>" + images.length + "</b> images")
+
+  store.set(await getAll())
 
   await tx.done;
 
 }
 
-async function get(name: string): Promise<Image> {
-  return new Promise((res, rej) => {
-    res({} as Image);
-  })
+async function updateImage(img: Image) {
+  img.lastModified = Date.now();
+  (await db).put("images", img);
+  store.update(images => images.map(i => i.id === img.id ? img : i));
+}
+
+async function get(id: number): Promise<Image> {
+  return (await db).get("images", id);
 }
 
 async function getAll(): Promise<Image[]> {
   return (await db).getAll("images");
 }
 
-(async () => store.set(await getAll()))()
+async function deleteImage(img: Image): Promise<void> {
+  (await db).delete("images", img.id);
+  store.update(images => images.filter(i => i.id !== img.id));
+}
 
-export { store, add, get, getAll };
+(async () => {
+  store.set(await getAll())
+})()
+
+export { store, add, get, getAll, updateImage, deleteImage };

view/src/stores/route.ts

@@ -1,18 +1,22 @@
 import { writable } from "svelte/store";
 
-let r = "main";
-
-if (window.location.hash.length) {
-  r = window.location.hash.replace("#", "");
-} else {
-  r = "main";
+const getHash = () => {
+  if (window.location.hash.length) {
+    return window.location.hash.replace("#", "");
+  } else {
+    return "main";
+  }
 }
 
-const store = writable<string>(r);
+const store = writable<string>(getHash());
 
 store.subscribe(s => {
   if (s === "main") s = ""
   window.location.hash = s;
 })
 
+window.addEventListener("hashchange", () => {
+  store.set(getHash())
+}, false);
+
 export default store;