); } function measureImage(url: string): Promise<{ width: number; height: number }> { return new Promise((resolve) => { const img = new Image(); img.onload = () => resolve({ width: img.naturalWidth, height: img.naturalHeight }); img.onerror = () => resolve({ width: 0, height: 0 }); img.src = url; }); } async function putToR2( url: string, body: Blob, contentType: string, ): Promise { // Three retries with exponential backoff. fetch() throws a generic // "Failed to fetch" with no diagnostic on network drop, so we wrap it // in XMLHttpRequest which gives us status / abort detection. const delays = [0, 800, 2000]; let lastErr: Error | null = null; for (const delay of delays) { if (delay > 0) await new Promise((r) => setTimeout(r, delay)); try { return await xhrPut(url, body, contentType); } catch (err) { lastErr = err as Error; } } throw new Error( `R2 PUT network error: ${lastErr?.message ?? "unknown"} (size=${body.size}, type=${contentType})`, ); } function xhrPut( url: string, body: Blob, contentType: string, ): Promise { return new Promise((resolve, reject) => { const xhr = new XMLHttpRequest(); xhr.open("PUT", url, true); xhr.setRequestHeader("Content-Type", contentType); xhr.timeout = 60_000; // 60s for a 3MB sprite is generous. xhr.onload = () => { // Construct a Response-like object the caller already expects. resolve( new Response(xhr.responseText, { status: xhr.status, statusText: xhr.statusText, }), ); }; xhr.onerror = () => reject(new Error("xhr network error")); xhr.ontimeout = () => reject(new Error("xhr timeout")); xhr.onabort = () => reject(new Error("xhr aborted")); xhr.send(body); }); } function slugify(value: string): string { return value .toLowerCase() .trim() .replace(/[^a-z0-9]+/g, "-") .replace(/^-+|-+$/g, "") .slice(0, 40); } function buildIssueUrl( parsed: ParsedPet | null, message: string | undefined, userId: string | null, ): string { const title = parsed?.displayName ? `[Submit fail] ${parsed.displayName}` : "[Submit fail] Petdex upload"; const description = parsed?.description?.trim(); const sizeText = parsed?.spritesheetWidth ? `${parsed.spritesheetWidth}×${parsed.spritesheetHeight}` : "n/a"; const body = [ "## ⚠️ BEFORE YOU SUBMIT THIS ISSUE", "", "Without your pet files I cannot recover the upload. Please:", "", "- [ ] **Attach your zipped pet folder below** (drag-and-drop the .zip into the comment box). It must contain `pet.json` + `spritesheet.webp` (or `.png`).", "- [ ] If the pet has a backstory or tags I should add, paste them in a comment.", "", "Issues without a zip get closed after 48h because there is nothing for me to import.", "", "---", "", "## What the form captured", "", `- **Pet name:** ${parsed?.displayName ?? "n/a"}`, `- **Pet id:** ${parsed?.petId ?? "n/a"}`, `- **Sprite size:** ${sizeText}`, `- **Source:** ${parsed?.source ?? "n/a"}`, `- **Error:** ${message ?? "Unknown"}`, userId ? `- **User id:** \`${userId}\`` : "- **User id:** (not signed in)", description ? `- **Description:**\n > ${description.replace(/\n/g, "\n > ")}` : "- **Description:** (none captured)", "", "", ].join("\n"); const params = new URLSearchParams({ title, body, labels: "submit-fallback", }); return `https://github.com/crafter-station/petdex/issues/new?${params.toString()}`; } // Resolve a DataTransfer to a flat FileList-like array. If the user dropped a // folder, recursively walks it via webkitGetAsEntry and stamps each File with // `webkitRelativePath` so handleFiles() can detect folder mode and find files // by their basename. async function readDataTransfer(dt: DataTransfer): Promise { const items = Array.from(dt.items); const hasEntry = items.some((it) => "webkitGetAsEntry" in it); if (!hasEntry) { return dt.files; } const collected: File[] = []; await Promise.all( items.map(async (item) => { const entry = ( item as DataTransferItem & { webkitGetAsEntry?: () => FileSystemEntry | null; } ).webkitGetAsEntry?.(); if (!entry) { const f = item.getAsFile?.(); if (f) collected.push(f); return; } await walkEntry(entry, "", collected); }), ); // Build a synthetic FileList from the collected array const dt2 = new DataTransfer(); for (const f of collected) dt2.items.add(f); return dt2.files; } async function walkEntry( entry: FileSystemEntry, prefix: string, out: File[], ): Promise { if (entry.isFile) { const fileEntry = entry as FileSystemFileEntry; const file = await new Promise((resolve, reject) => fileEntry.file(resolve, reject), ); // Patch webkitRelativePath so the handler treats this as folder-mode const path = `${prefix}${entry.name}`; Object.defineProperty(file, "webkitRelativePath", { value: path, writable: false, configurable: true, }); out.push(file); return; } if (entry.isDirectory) { const dirEntry = entry as FileSystemDirectoryEntry; const reader = dirEntry.createReader(); const entries = await new Promise((resolve, reject) => reader.readEntries(resolve, reject), ); await Promise.all( entries.map((child) => walkEntry(child, `${prefix}${entry.name}/`, out)), ); } }