Also check local file

src/lib/check-dduf.ts

@@ -2,10 +2,10 @@ import { checkFilename } from './check-filename';
 import { WebBlob } from './WebBlob';
 
 export async function* checkDduf(
-	url: string,
+	url: Blob | string,
 	opts?: { log?: (x: string) => void }
 ): AsyncGenerator<{ type: 'file'; name: string; size: number; fileHeaderOffset: number }> {
-	const blob = await WebBlob.create(new URL(url));
+	const blob = url instanceof Blob ? url : await WebBlob.create(new URL(url));
 
 	opts?.log?.('File size: ' + blob.size);
 

src/routes/+page.svelte

@@ -2,7 +2,10 @@
 	import { checkDduf } from '$lib/check-dduf';
 	import { tick } from 'svelte';
 
-	let url = $state('https://huggingface.co/DDUF/Flux.1-Dev-Tnf4-TE2NF4/resolve/main/Flux.1-Dev-Tnf4-TE2NF4.dduf');
+	let url = $state(
+		'https://huggingface.co/DDUF/Flux.1-Dev-Tnf4-TE2NF4/resolve/main/Flux.1-Dev-Tnf4-TE2NF4.dduf'
+	);
+	let blob = $state<Blob | null>(null);
 	let output = $state('');
 	let error = $state('');
 	let files: Array<{ position: number; size: number; name: string }> = $state([]);
@@ -14,7 +17,7 @@
 		files = [];
 
 		try {
-			for await (const file of checkDduf(url, {
+			for await (const file of checkDduf(blob ?? url, {
 				log: (s) => {
 					output += '\n' + s;
 					tick().then(() => {
@@ -48,6 +51,22 @@
 				name="url"
 				placeholder="https://huggingface.co/spaces/coyotte508/dduf-check/resolve/main/file.dduf"
 				bind:value={url}
+				class="w-full rounded-md border border-gray-300 p-2 disabled:opacity-50"
+				disabled={blob !== null}
+			/>
+		</label>
+
+		or
+
+		<label class="flex flex-col gap-2">
+			DDUF File
+			<input
+				type="file"
+				name="file"
+				accept=".dduf"
+				onchange={async (event) => {
+					blob = (event.target as HTMLInputElement).files?.[0] ?? null;
+				}}
 				class="w-full rounded-md border border-gray-300 p-2"
 			/>
 		</label>