Add prefetching for images and audio. Add cover image to mediasession

svelte/src/filesystem/viewers/Image.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 import { swipe_nav } from "lib/SwipeNavigate";
-import { fs_path_url } from "lib/FilesystemAPI.svelte";
+import { fs_path_url, fs_node_type, type FSNode } from "lib/FilesystemAPI.svelte";
 import type { FSNavigator } from "filesystem/FSNavigator";
 import { loading_finish, loading_start } from "lib/Loading";
 
@@ -56,11 +56,22 @@ export const update = async () => {
 		if (siblings[i].name === nav.base.name) {
 			swipe_prev = i > 0
 			swipe_next = i < siblings.length-1
+			preload(siblings[i-1])
+			preload(siblings[i+1])
 			break
 		}
 	}
 }
 
+// Preloads a neighbouring image into the browser cache so that swiping to it
+// doesn't have to wait for the network. Files are served with a one year cache
+// lifetime, so the <img> element picks the data straight out of the cache
+const preload = (node: FSNode | undefined) => {
+	if (node !== undefined && fs_node_type(node) === "image") {
+		new Image().src = fs_path_url(node.path)
+	}
+}
+
 const on_load = () => loading_finish()
 
 const clamp = (val: number, min: number, max: number) => Math.min(Math.max(val, min), max)