File size: 2,513 Bytes
075be5d
 
8d0e117
075be5d
a5fa4af
 
 
 
0914da1
 
 
075be5d
 
 
73f1392
b5430db
9de404d
075be5d
b5430db
a5fa4af
0914da1
 
 
 
 
 
 
 
 
 
 
8d0e117
b5430db
 
 
 
73f1392
075be5d
8d0e117
 
075be5d
 
 
 
 
 
 
 
 
 
 
723c3de
075be5d
a5fa4af
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
075be5d
 
 
 
 
 
8d0e117
 
 
 
 
075be5d
b5430db
 
 
 
0914da1
 
 
 
 
 
 
 
 
 
 
602ce48
 
 
 
 
 
075be5d
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<script lang="ts">
	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 blob = $state<Blob | null>(null);
	let output = $state('');
	let error = $state('');
	let files: Array<{ position: number; size: number; name: string }> = $state([]);

	async function handleSubmit(event: Event) {
		event.preventDefault();
		output = 'Checking...';
		error = '';
		files = [];

		try {
			for await (const file of checkDduf(blob ?? url, {
				log: (s) => {
					output += '\n' + s;
					tick().then(() => {
						textarea.scrollTop = textarea.scrollHeight;
					});
				}
			})) {
				files.push({
					position: file.fileHeaderOffset,
					size: file.size,
					name: file.name
				});
			}
		} catch (e) {
			console.error(e);
			error = (e as Error).message;
		}
	}

	let textarea: HTMLTextAreaElement;
</script>

<div class="flex flex-col gap-4 p-4">
	<h1 class="text-xl font-bold">DDUF Check</h1>

	<form class="flex flex-col gap-4" onsubmit={handleSubmit}>
		<label class="flex flex-col gap-2">
			DDUF URL (resolved url)
			<input
				type="url"
				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>

		<button type="submit" class="self-start rounded-md bg-blue-500 p-2 text-white">Check</button>

		<textarea
			bind:this={textarea}
			class="w-full rounded-md border border-gray-300 p-2"
			rows="10"
			readonly>{output}</textarea
		>

		{#if error}
			<p class="text-red-500">{error}</p>
		{/if}

		{#if files.length > 0}
			<h2 class="text-lg font-bold">Files</h2>
			<ul class="ml-4 list-disc">
				{#each files as file}
					<li style="margin-left: {file.name.slice(0, -1).split('/').length - 1}rem">
						{file.name} - {file.size} B
					</li>
				{/each}
			</ul>
		{/if}

		<p>
			To create a zip file with 0 compression you can do <span
				class="rounded-md bg-gray-100 p-1 font-mono">cd folder && zip -r -0 ../file.dduf .</span
			>
		</p>
	</form>
</div>