web/FileReceiver: define input in component to prevent losing it to GC

This commit is contained in:
dumbmoron 2024-09-08 16:55:58 +00:00
parent a351264ede
commit a613f1402d
No known key found for this signature in database

View file

@ -10,18 +10,16 @@
export let acceptTypes: string[]; export let acceptTypes: string[];
export let acceptExtensions: string[]; export let acceptExtensions: string[];
let fileInput: HTMLInputElement;
const openFile = async () => { const openFile = async () => {
const fileInput = document.createElement("input"); fileInput = document.createElement("input");
fileInput.type = "file"; fileInput.type = "file";
fileInput.accept = acceptTypes.join(","); fileInput.accept = acceptTypes.join(",");
fileInput.click(); fileInput.click();
fileInput.onchange = async () => {
fileInput.onchange = async (e: Event) => { if (fileInput.files?.length === 1) {
const target = e.target as HTMLInputElement; file = fileInput.files[0];
if (target.files?.length === 1) {
file = target.files[0];
return file; return file;
} }
}; };
@ -31,7 +29,7 @@
<div class="open-file-container" class:dragged-over={draggedOver}> <div class="open-file-container" class:dragged-over={draggedOver}>
<Meowbalt emotion="question" /> <Meowbalt emotion="question" />
<button class="open-file-button" on:click={() => openFile()}> <button class="open-file-button" on:click={openFile}>
<div class="dashed-stroke"> <div class="dashed-stroke">
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"> <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
<rect width="100%" height="100%" fill="none" rx="24" ry="24" /> <rect width="100%" height="100%" fill="none" rx="24" ry="24" />