First pass at use of IndexedDB for publication bookmarks

Scrolling to the bookmark doesn't yet work, so the IndexedDB usage is moot until that is fixed.

IndexedDB access should be moved into a service layer before merging.

src/routes/publication/+page.svelte

@@ -2,12 +2,14 @@
   import Publication from "$lib/components/publications/Publication.svelte";
   import { TextPlaceholder } from "flowbite-svelte";
   import type { PageProps } from "./$types";
-  import { onDestroy, setContext } from "svelte";
+  import { onDestroy, onMount, setContext } from "svelte";
   import Processor from "asciidoctor";
   import ArticleNav from "$components/util/ArticleNav.svelte";
   import { SveltePublicationTree } from "$lib/components/publications/svelte_publication_tree.svelte";
   import { TableOfContents } from "$lib/components/publications/table_of_contents.svelte";
   import { page } from "$app/state";
+  import { goto } from "$app/navigation";
+
   let { data }: PageProps = $props();
 
   const publicationTree = new SveltePublicationTree(data.indexEvent, data.ndk);
@@ -23,7 +25,7 @@
     data.parser?.getIndexTitle(data.parser?.getRootIndexId()) ||
     "Alexandria Publication",
   );
-  let currentUrl = data.url?.href ?? "";
+  let currentUrl = $derived(`${page.url.origin}${page.url.pathname}${page.url.search}`);
 
   // Get image and summary from the event tags if available
   // If image unavailable, use the Alexandria default pic.
@@ -36,6 +38,54 @@
     "Alexandria is a digital library, utilizing Nostr events for curated publications and wiki pages.",
   );
 
+  publicationTree.onBookmarkMoved(address => {
+    goto(`#${address}`, {
+      replaceState: true,
+    });
+
+    // TODO: Extract IndexedDB interaction to a service layer.
+    // Store bookmark in IndexedDB
+    const db = indexedDB.open('alexandria', 1);
+    db.onupgradeneeded = () => {
+      const objectStore = db.result.createObjectStore('bookmarks', { keyPath: 'key' });
+    };
+    
+    db.onsuccess = () => {
+      const transaction = db.result.transaction(['bookmarks'], 'readwrite');
+      const store = transaction.objectStore('bookmarks');
+      const bookmarkKey = `${data.indexEvent.tagAddress()}`;
+      store.put({ key: bookmarkKey, address });
+    };
+  });
+
+  onMount(() => {
+    // TODO: Extract IndexedDB interaction to a service layer.
+    // Read bookmark from IndexedDB
+    const db = indexedDB.open('alexandria', 1);
+    db.onupgradeneeded = () => {
+      const objectStore = db.result.createObjectStore('bookmarks', { keyPath: 'key' });
+    };
+    
+    db.onsuccess = () => {
+      const transaction = db.result.transaction(['bookmarks'], 'readonly');
+      const store = transaction.objectStore('bookmarks');
+      const bookmarkKey = `${data.indexEvent.tagAddress()}`;
+      const request = store.get(bookmarkKey);
+      
+      request.onsuccess = () => {
+        if (request.result?.address) {
+          // Set the bookmark in the publication tree
+          publicationTree.setBookmark(request.result.address);
+          
+          // Jump to the bookmarked element
+          goto(`#${request.result.address}`, {
+            replaceState: true,
+          });
+        }
+      };
+    };
+  });
+
   onDestroy(() => data.parser.reset());
 </script>