docker/nginx.conf

@@ -1,9 +1,3 @@
-# This file is included at http level, so this adds to nginx's MIME table.
-# Browsers refuse to run module scripts (the pdf.js worker) served as octet-stream.
-types {
-	text/javascript mjs;
-}
-
 server {
 	listen 80;
 	server_name _;

src/lib/components/PdfBackground.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { MissingSourceError, loadSource, renderPage } from '$lib/pdf/render';
+	import { loadSource, renderPage } from '$lib/pdf/render';
 	import { vault } from '$lib/storage/vault.svelte';
 	import type { Origin } from '$lib/model/types';
 
@@ -13,7 +13,7 @@
 
 	let { origin, width, height, scale }: Props = $props();
 	let canvas: HTMLCanvasElement;
-	let failure = $state<'missing' | 'error' | null>(null);
+	let failed = $state(false);
 
 	// Render at a stepped resolution so zooming doesn't re-render constantly.
 	const STEPS = [0.25, 0.5, 1, 1.5, 2, 3, 4];
@@ -35,13 +35,9 @@
 				const doc = await loadSource(sourceId, () => vault.getSource(sourceId));
 				if (cancelled) return;
 				job = renderPage(doc, pageIndex, canvas, res);
-				failure = null;
+				failed = false;
-			} catch (e) {
+			} catch {
-				if (e instanceof MissingSourceError) failure = 'missing';
+				failed = true;
-				else {
-					failure = 'error';
-					console.error(`Could not render source PDF “${origin.name}”`, e);
-				}
 			}
 		}, 120);
 		return () => {
@@ -52,11 +48,9 @@
 	});
 </script>
 
-<canvas bind:this={canvas} class="bg"></canvas>
+<canvas bind:this={canvas} class="bg" class:failed></canvas>
-{#if failure === 'missing'}
+{#if failed}
-	<div class="missing">Source PDF “{origin.name}” is not stored on this device</div>
+	<div class="missing">Source PDF “{origin.name}” is not available</div>
-{:else if failure === 'error'}
-	<div class="missing">Could not display “{origin.name}” (see the browser console)</div>
 {/if}
 
 <style>

src/lib/pdf/render.ts

@@ -8,15 +8,12 @@ pdfjs.GlobalWorkerOptions.workerSrc = workerUrl;
 
 const docs = new Map<string, Promise<PDFDocumentProxy>>();
 
-/** The source PDF's bytes aren't stored on this device (as opposed to pdf.js failing on them). */
-export class MissingSourceError extends Error {}
-
 export function loadSource(sourceId: string, getBytes: () => Promise<Uint8Array | undefined>) {
 	let p = docs.get(sourceId);
 	if (!p) {
 		p = (async () => {
 			const bytes = await getBytes();
-			if (!bytes) throw new MissingSourceError(`Missing source PDF ${sourceId}`);
+			if (!bytes) throw new Error(`Missing source PDF ${sourceId}`);
 			// pdf.js transfers the buffer to its worker, so hand it a copy.
 			return pdfjs.getDocument({ data: bytes.slice() }).promise;
 		})();