don't make requests in sibling navigation

svelte/src/filesystem/viewers/Audio.svelte

@@ -17,7 +17,7 @@ const update_session_meta = name => {
 	if (media_session) {
 		navigator.mediaSession.metadata = new MediaMetadata({
 			title: name,
-			artist: "unknown",
+			artist: "pixeldrain",
 			album: "unknown",
 		});
 	}
@@ -38,7 +38,7 @@ onMount(() => {
 </script>
 
 <div class="container">
-	<button on:click={() =>  dispatch("open_sibling", -1) }><i class="icon">skip_previous</i></button>
+	<button on:click={() => dispatch("open_sibling", -1) }><i class="icon">skip_previous</i></button>
 	<button on:click={() => player.currentTime -= 10 }><i class="icon">replay_10</i></button>
 	<button on:click={toggle_play}>
 		{#if playing}

svelte/src/filesystem/viewers/PDF.svelte

@@ -0,0 +1,22 @@
+<script>
+import { fs_get_file_url } from "../FilesystemAPI.svelte";
+export let state
+</script>
+
+<iframe
+	class="container"
+	src={"/res/misc/pdf-viewer/web/viewer.html?file="+encodeURIComponent(fs_get_file_url(state.bucket.id, state.base.path))}
+	title="PDF viewer">
+</iframe>
+
+<style>
+.container {
+	position: relative;
+	display: block;
+	height: 100%;
+	width: 100%;
+	text-align: center;
+	overflow: hidden;
+	border: none;
+}
+</style>

svelte/src/filesystem/viewers/Video.svelte

@@ -1,13 +1,42 @@
 <script>
 import { fs_get_file_url } from "../FilesystemAPI.svelte";
-import { createEventDispatcher } from 'svelte'
+import { createEventDispatcher, onMount } from 'svelte'
 let dispatch = createEventDispatcher()
 
 export let state;
+let player
+let media_session = false
+
+// Detect when the song changes
+$: update_session_meta(state.base.name)
+
+const update_session_meta = name => {
+	if (media_session) {
+		navigator.mediaSession.metadata = new MediaMetadata({
+			title: name,
+			artist: "pixeldrain",
+			album: "unknown",
+		});
+	}
+}
+
+onMount(() => {
+	if ('mediaSession' in navigator) {
+		media_session = true
+		update_session_meta(state.base.name)
+
+		navigator.mediaSession.setActionHandler('play', () => player.play());
+		navigator.mediaSession.setActionHandler('pause', () => player.pause());
+		navigator.mediaSession.setActionHandler('stop', () => player.stop());
+		navigator.mediaSession.setActionHandler('previoustrack', () => dispatch("open_sibling", -1));
+		navigator.mediaSession.setActionHandler('nexttrack', () => dispatch("open_sibling", 1));
+	}
+})
 </script>
 
 <div class="container">
 	<video
+		bind:this={player}
 		class="player"
 		src={fs_get_file_url(state.bucket.id, state.base.path)}
 		autoplay="autoplay"