[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_109":110,"_111":112},"routes/embed.x.$handle.$name.$",{"_9":10,"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":-5},"handle","Et12eqtf","name","foundry-epic","path","views/app.ts","project",{"_22":48,"_11":12,"_35":49,"_50":-5,"_51":44,"_52":53,"_54":53,"_55":56,"_57":-5,"_58":59,"_60":61,"_62":34,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":70,"_71":72,"_73":74,"_75":-5,"_76":77,"_78":77,"_79":80,"_81":80,"_82":80,"_83":77,"_84":77,"_85":86,"_87":88,"_89":90,"_91":44},"file",{"_22":23,"_11":24,"_25":26,"_27":28,"_29":30,"_31":32,"_33":34,"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":-5,"_13":46},"permalink","https://www.val.town/x/Et12eqtf/foundry-epic/code/views/app.ts","extension","id","6cc0831c-b6ac-4121-a230-69e6750e8b83","app.ts","fileId","6277971e-9baa-11f1-8d0b-1607ee4eb77e","parentId","5bcfd898-d4b2-4f34-b83b-e07f962670b8","branchId","ee22e3ae-218e-4882-89bb-63b59fd716fd","branchVersion",34,"latest",true,"createdAt",["D",1787129681965],"version",8,"fileType","script","content","// Foundry client — drives the workshop console, preview, and records.\n\nconst $ = (id: string): T => document.getElementById(id) as T;\n\nconst promptEl = $(\"prompt\");\nconst providerEl = $(\"provider\");\nconst buildBtn = $(\"build\");\nconst buildLabel = $(\"buildLabel\");\nconst logEl = $(\"log\");\nconst preview = $(\"preview\");\nconst previewEmpty = $(\"previewEmpty\");\nconst previewMeta = $(\"previewMeta\");\nconst recordList = $(\"recordList\");\nconst recordsEmpty = $(\"recordsEmpty\");\nconst clearBtn = $(\"clearRecords\");\nconst errorBanner = $(\"errorBanner\");\nconst errorText = $(\"errorText\");\nconst charCount = $(\"charCount\");\nconst launchBtn = $(\"launchBtn\");\nconst downloadBtn = $(\"downloadBtn\");\nconst shareBtn = $(\"shareBtn\");\nconst toastEl = $(\"toast\");\n\ntype Provider = { id: string; label: string; model: string; available: boolean };\ntype Build = { id: number; prompt: string; html: string; created_at: number };\n\nlet records: Build[] = [];\nlet busy = false;\nlet activeId: number | null = null;\nlet currentBuild: Build | null = null;\nconst stageEls: Record = {};\n\nfunction setLaunchState(b: Build | null): void {\n currentBuild = b;\n const ready = !!b;\n if (ready) {\n launchBtn.href = `/p/${b.id}`;\n launchBtn.removeAttribute(\"aria-disabled\");\n launchBtn.tabIndex = 0;\n downloadBtn.disabled = false;\n } else {\n launchBtn.href = \"#\";\n launchBtn.setAttribute(\"aria-disabled\", \"true\");\n launchBtn.tabIndex = -1;\n downloadBtn.disabled = true;\n }\n}\n\nfunction downloadCurrent(): void {\n if (!currentBuild) return;\n const blob = new Blob([currentBuild.html], { type: \"text/html;charset=utf-8\" });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = `foundry-${currentBuild.id}.html`;\n document.body.appendChild(a);\n a.click();\n a.remove();\n URL.revokeObjectURL(url);\n}\n\nconst EXEMPLARS: Array<{ label: string; text: string }> = [\n { label: \"focus timer\", text: \"A pomodoro timer that tracks daily focus time, lets you set work and break lengths, and logs a history of finished sessions with a running total.\" },\n { label: \"memory game\", text: \"A memory-match card game where you flip tiles to find pairs in the fewest moves, with a timer, a moves counter, a win screen, and a new-game shuffle.\" },\n { label: \"habit tracker\", text: \"A habit tracker with check-in toggles for each day of the week, a streak counter per habit, and a compact weekly progress bar.\" },\n { label: \"password mint\", text: \"A password generator with toggles for length and character types, a live strength meter, and a one-click copy button.\" },\n { label: \"ledger\", text: \"A simple income-and-expense ledger that sums rows in real time, shows a running balance, and can flag an overdraft in red.\" },\n];\n\n// ---- init ---------------------------------------------------------------\n\nasync function init(): Promise {\n populateProviders();\n renderExemplars();\n promptEl.addEventListener(\"input\", () => {\n charCount.textContent = String(promptEl.value.length);\n });\n\n buildBtn.addEventListener(\"click\", runBuild);\n promptEl.addEventListener(\"keydown\", (e) => {\n if ((e.metaKey || e.ctrlKey) && e.key === \"Enter\") runBuild();\n });\n clearBtn.addEventListener(\"click\", clearRecords);\n downloadBtn.addEventListener(\"click\", downloadCurrent);\n shareBtn.addEventListener(\"click\", shareFoundry);\n setLaunchState(null);\n registerSW();\n\n await loadRecords();\n}\n\nconst SHARE_TEXT = \"Foundry Epic — describe an app in plain English, watch it build live, preview it, and launch it.\";\n\nfunction notify(msg: string): void {\n toastEl.textContent = msg;\n toastEl.hidden = false;\n clearTimeout((notify as any)._t);\n (notify as any)._t = setTimeout(() => {\n toastEl.hidden = true;\n }, 2600);\n}\n\nasync function shareFoundry(): Promise {\n const url = location.origin + \"/\";\n if (navigator.share) {\n try {\n await navigator.share({ title: \"Foundry Epic\", text: SHARE_TEXT, url });\n return;\n } catch (e) {\n if (/abort|dismiss/i.test(String(e))) return; // user closed the sheet\n }\n }\n // Fallback for desktop / non-supporting browsers: copy the link.\n try {\n await navigator.clipboard.writeText(`${SHARE_TEXT} ${url}`);\n notify(\"Link copied — paste it anywhere.\");\n } catch {\n notify(url);\n }\n}\n\nfunction registerSW(): void {\n if (\"serviceWorker\" in navigator) {\n navigator.serviceWorker.register(\"/sw.js\").catch(() => {});\n }\n}\n\nfunction populateProviders(): void {\n const meta = { providers: [] as Provider[] };\n // fetched synchronously below\n void fetch(\"/api/meta\")\n .then((r) => r.json())\n .then((m) => {\n const provs: Provider[] = m.providers ?? [];\n providerEl.innerHTML = \"\";\n let firstAvailable: string | null = null;\n for (const p of provs) {\n const opt = document.createElement(\"option\");\n opt.value = p.id;\n opt.textContent = p.available ? `${p.label} · ${p.model}` : `${p.label} · needs a key`;\n if (p.available && !firstAvailable) firstAvailable = p.id;\n providerEl.appendChild(opt);\n }\n if (firstAvailable) providerEl.value = firstAvailable;\n else if (provs.length === 0) {\n const opt = document.createElement(\"option\");\n opt.value = \"claude\";\n opt.textContent = \"Claude\";\n providerEl.appendChild(opt);\n }\n });\n}\n\nfunction renderExemplars(): void {\n const row = document.querySelector(\".chip-row\")!;\n for (const ex of EXEMPLARS) {\n const b = document.createElement(\"button\");\n b.type = \"button\";\n b.className = \"chip\";\n b.textContent = ex.label;\n b.setAttribute(\"aria-label\", `Use example prompt: ${ex.text}`);\n b.addEventListener(\"click\", () => {\n promptEl.value = ex.text;\n charCount.textContent = String(ex.text.length);\n promptEl.focus();\n });\n row.appendChild(b);\n }\n}\n\n// ---- records ------------------------------------------------------------\n\nasync function loadRecords(): Promise {\n try {\n const r = await fetch(\"/api/history\");\n const data = await r.json();\n records = (data.builds ?? []).map((b: Build) => b);\n renderRecords();\n } catch (e) {\n addLogEntry(\"note\", \"records\", `couldn't load history (${String(e)})`);\n }\n}\n\nfunction renderRecords(): void {\n recordList.innerHTML = \"\";\n recordsEmpty.hidden = records.length > 0;\n for (const b of records) {\n const li = document.createElement(\"li\");\n const btn = document.createElement(\"button\");\n btn.type = \"button\";\n btn.className = \"record\" + (b.id === activeId ? \" active\" : \"\");\n btn.addEventListener(\"click\", () => openRecord(b, btn));\n const time = new Date(b.created_at).toLocaleTimeString([], { hour: \"2-digit\", minute: \"2-digit\" });\n btn.innerHTML = \"\";\n const p = document.createElement(\"span\");\n p.className = \"record-prompt\";\n p.textContent = b.prompt.length > 90 ? b.prompt.slice(0, 90) + \"…\" : b.prompt;\n const t = document.createElement(\"span\");\n t.className = \"record-time\";\n t.textContent = time;\n btn.append(p, t);\n li.appendChild(btn);\n recordList.appendChild(li);\n }\n}\n\nfunction openRecord(b: Build, el: HTMLButtonElement): void {\n activeId = b.id;\n preview.srcdoc = b.html;\n previewEmpty.classList.add(\"hidden\");\n previewMeta.textContent = b.prompt.length > 60 ? b.prompt.slice(0, 60) + \"…\" : b.prompt;\n document.querySelectorAll(\".record\").forEach((n) => n.classList.remove(\"active\"));\n el.classList.add(\"active\");\n setLaunchState(b);\n}\n\nasync function clearRecords(): Promise {\n if (records.length === 0) return;\n await fetch(\"/api/history\", { method: \"DELETE\" });\n records = [];\n renderRecords();\n}\n\n// ---- console ------------------------------------------------------------\n\nfunction ts(): string {\n return new Date().toLocaleTimeString([], { hour12: false, hour: \"2-digit\", minute: \"2-digit\", second: \"2-digit\" });\n}\n\nfunction addLogEntry(kind: \"stage\" | \"ok\" | \"err\" | \"note\", tag: string, msg: string): HTMLLIElement {\n const li = document.createElement(\"li\");\n li.className = kind;\n const time = document.createElement(\"span\");\n time.className = \"t-time\";\n time.textContent = ts();\n const tagEl = document.createElement(\"span\");\n tagEl.className = \"t-tag\";\n tagEl.textContent = tag;\n const msgEl = document.createElement(\"span\");\n msgEl.className = \"t-msg\";\n msgEl.textContent = msg;\n li.append(time, tagEl, msgEl);\n logEl.appendChild(li);\n logEl.scrollTop = logEl.scrollHeight;\n return li;\n}\n\nfunction updateStage(stage: string, chars: number, lines: number): void {\n let li = stageEls[stage];\n const msg = `streaming ${chars.toLocaleString()} chars · ${lines} lines`;\n if (!li) {\n li = addLogEntry(\"stage\", stage, \"\");\n stageEls[stage] = li;\n }\n li.querySelector(\".t-msg\")!.innerHTML = msg;\n logEl.scrollTop = logEl.scrollHeight;\n}\n\nfunction handleEvent(ev: any): void {\n switch (ev?.type) {\n case \"log\":\n addLogEntry(\"note\", ev.stage ?? \"engine\", ev.detail ?? \"\");\n break;\n case \"progress\":\n updateStage(ev.stage, Number(ev.chars) || 0, Number(ev.lines) || 0);\n break;\n case \"result\": {\n for (const k of Object.keys(stageEls)) stageEls[k].classList.add(\"ok\");\n addLogEntry(\"ok\", \"built\", `ready — opened in preview.`);\n activeId = ev.id ?? null;\n preview.srcdoc = ev.html;\n previewEmpty.classList.add(\"hidden\");\n previewMeta.textContent = (ev.prompt ?? \"\").slice(0, 60) + \"…\";\n // move to front of local records + save\n records = [\n { id: ev.id, prompt: ev.prompt, html: ev.html, created_at: Date.now() },\n ...records.filter((r) => r.id !== ev.id),\n ];\n renderRecords();\n setLaunchState(records[0]);\n break;\n }\n case \"error\":\n addLogEntry(\"err\", \"error\", ev.message ?? \"Unknown error\");\n errorText.textContent = ev.message ?? \"Unknown error\";\n errorBanner.hidden = false;\n break;\n }\n}\n\nfunction resetConsole(): void {\n logEl.innerHTML = \"\";\n for (const k of Object.keys(stageEls)) delete stageEls[k];\n errorBanner.hidden = true;\n addLogEntry(\"note\", \"session\", `started · engine ${providerEl.value}`);\n}\n\n// ---- build --------------------------------------------------------------\n\nasync function runBuild(): Promise {\n if (busy) return;\n const prompt = promptEl.value.trim();\n if (!prompt) {\n errorText.textContent = \"Enter a prompt describing the app you want to build first.\";\n errorBanner.hidden = false;\n promptEl.focus();\n return;\n }\n busy = true;\n buildBtn.disabled = true;\n buildLabel.textContent = \"Forging…\";\n errorBanner.hidden = true;\n resetConsole();\n\n try {\n const res = await fetch(\"/api/build\", {\n method: \"POST\",\n headers: { \"content-type\": \"application/json\" },\n body: JSON.stringify({ prompt, provider: providerEl.value }),\n });\n if (!res.ok || !res.body) {\n addLogEntry(\"err\", \"error\", `Request failed (HTTP ${res.status}). Try again.`);\n return;\n }\n const reader = res.body.getReader();\n const dec = new TextDecoder();\n let buf = \"\";\n while (true) {\n const { done, value } = await reader.read();\n if (done) break;\n buf += dec.decode(value, { stream: true });\n let i: number;\n while ((i = buf.indexOf(\"\\n\")) >= 0) {\n const line = buf.slice(0, i);\n buf = buf.slice(i + 1);\n if (line.trim()) {\n try {\n handleEvent(JSON.parse(line));\n } catch { /* skip partial */ }\n }\n }\n }\n } catch (e) {\n addLogEntry(\"err\", \"error\", `Connection error: ${String(e)}`);\n errorText.textContent = `Connection error: ${String(e)}`;\n errorBanner.hidden = false;\n } finally {\n busy = false;\n buildBtn.disabled = false;\n buildLabel.textContent = \"Build app\";\n }\n}\n\nvoid init();\n","deleted",false,"label",[47,24],"views","05fc5caf-cbe7-40bf-8abe-7c6f1dc57ed5",["D",1787129097801],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Foundry Epic — AI app workshop with live preview.","imageUrl","userId","56113ce4-0f2b-402f-b46c-fc61db5ac8a6","pinnedFileId","41fa0a8a-9baa-11f1-a031-1607ee4eb77e","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","01a0191e-7c9f-73d4-b196-82a6c48eaa8a","tursoName","05fc5cafcbe740bf8abe7c6f1dc57ed5","tursoHostname","05fc5cafcbe740bf8abe7c6f1dc57ed5-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789476648181],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_9":10,"_108":104},"org",{"_9":10,"_101":102,"_103":104,"_58":59,"_105":106,"_107":44},"branch",{"_37":32,"_11":92,"_22":30,"_93":48,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":12,"_100":10},"isOwned","main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","nakkazi esther","avatar","https://lh3.googleusercontent.com/a/ACg8ocLzKaL-buMuULchK5wzcmIw74PtZiEMRxDQwszsTALglBlsIw=s96-c","tier","free","canRestrictVals","profileImageUrl","ctx",{"_85":-5,"_142":143,"_144":145,"_146":147,"_148":44,"_149":44,"_150":44,"_151":34,"_152":-5,"_153":-7,"_154":-7,"_155":66,"_156":44,"_157":44,"_158":-5,"_159":44,"_160":44,"_161":44,"_162":-5},"ENV",{"_113":114,"_115":116,"_117":92,"_118":119,"_120":121,"_122":123,"_124":125,"_126":127,"_128":129,"_130":131,"_132":133,"_134":135,"_136":137,"_138":139,"_140":141},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town","orgs",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]