Participant proposals

\n Most-upvoted first. Review and edit a draft before adding it to the\n live survey.\n

\n {(error || loadError) && (\n

{error || loadError}

\n {loadError && (\n void refresh()}\n className=\"underline\"\n >\n Retry loading\n \n )}\n

\n )}\n {message && (\n

{message}

\n )}\n {selected && (\n

Review draft

\n setSelected({ ...selected, question })}\n />\n

\n {!stillPending && (\n

\n This proposal is no longer pending.\n

\n )}\n

\n \n {busy ? \"Approving...\" : \"Approve and add question\"}\n \n setSelected(null)}\n disabled={busy}\n className=\"text-gray-600\"\n >\n Cancel review\n \n

\n )}\n {!data && !loadError && (\n

Loading proposals...

\n )}\n {data?.proposals.length === 0 && (\n

\n No pending proposals. Participants can suggest questions from the\n survey intro or completion screen.\n

\n )}\n {data?.proposals.map((proposal) => (\n \n \n review(proposal)}\n className=\"ml-auto text-indigo-700 underline text-sm\"\n >\n Review\n \n \n ))}\n

\n );\n}\n",1,"da56dbbc-ab15-11f1-90b2-1607ee4eb77e",["D",1788825191362],"branchVersion","label",[174,175,176,64],"frontend","components","proposals","pulls","branches","forks","envVars",{"_184":26,"_186":26},"connections",{"_184":26,"_185":26},"count","unfilledCount","emptyCount",{"_33":498,"_13":462,"_62":457,"_43":-5,"_35":36,"_171":168,"_231":98,"_37":499,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":500,"_17":501},{"_33":491,"_13":492,"_62":493,"_43":457,"_35":36,"_171":168,"_231":98,"_37":494,"_39":26,"_65":66,"_166":495,"_67":24,"_172":-5,"_235":496,"_17":497},{"_33":484,"_13":485,"_62":486,"_43":457,"_35":36,"_171":73,"_231":98,"_37":487,"_39":249,"_65":66,"_166":488,"_67":24,"_172":-5,"_235":489,"_17":490},{"_33":477,"_13":478,"_62":479,"_43":457,"_35":36,"_171":73,"_231":98,"_37":480,"_39":168,"_65":66,"_166":481,"_67":24,"_172":-5,"_235":482,"_17":483},{"_33":470,"_13":471,"_62":472,"_43":457,"_35":36,"_171":73,"_231":98,"_37":473,"_39":168,"_65":66,"_166":474,"_67":24,"_172":-5,"_235":475,"_17":476},{"_33":463,"_13":464,"_62":465,"_43":457,"_35":36,"_171":73,"_231":98,"_37":466,"_39":168,"_65":66,"_166":467,"_67":24,"_172":-5,"_235":468,"_17":469},{"_33":454,"_13":455,"_62":456,"_43":457,"_35":36,"_171":73,"_231":98,"_37":458,"_39":249,"_65":66,"_166":459,"_67":24,"_172":-5,"_235":460,"_17":461},{"_33":450,"_13":174,"_62":291,"_43":-5,"_35":36,"_171":168,"_231":98,"_37":451,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":452,"_17":453},{"_33":446,"_13":175,"_62":374,"_43":291,"_35":36,"_171":168,"_231":98,"_37":447,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":448,"_17":449},{"_33":442,"_13":441,"_62":436,"_43":374,"_35":36,"_171":168,"_231":98,"_37":443,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":444,"_17":445},{"_33":433,"_13":434,"_62":435,"_43":436,"_35":36,"_171":73,"_231":98,"_37":437,"_39":249,"_65":66,"_166":438,"_67":24,"_172":-5,"_235":439,"_17":440},{"_33":429,"_13":421,"_62":416,"_43":374,"_35":36,"_171":168,"_231":98,"_37":430,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":431,"_17":432},{"_33":422,"_13":423,"_62":424,"_43":416,"_35":36,"_171":168,"_231":98,"_37":425,"_39":26,"_65":66,"_166":426,"_67":24,"_172":-5,"_235":427,"_17":428},{"_33":413,"_13":414,"_62":415,"_43":416,"_35":36,"_171":168,"_231":98,"_37":417,"_39":26,"_65":66,"_166":418,"_67":24,"_172":-5,"_235":419,"_17":420},{"_33":409,"_13":176,"_62":169,"_43":374,"_35":36,"_171":249,"_231":98,"_37":410,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":411,"_17":412},{"_33":402,"_13":403,"_62":404,"_43":169,"_35":36,"_171":73,"_231":98,"_37":405,"_39":168,"_65":66,"_166":406,"_67":24,"_172":-5,"_235":407,"_17":408},{"_33":395,"_13":396,"_62":397,"_43":169,"_35":36,"_171":73,"_231":98,"_37":398,"_39":168,"_65":66,"_166":399,"_67":24,"_172":-5,"_235":400,"_17":401},{"_33":165,"_13":64,"_62":63,"_43":169,"_35":36,"_171":73,"_231":98,"_37":392,"_39":168,"_65":66,"_166":167,"_67":24,"_172":-5,"_235":393,"_17":394},{"_33":388,"_13":387,"_62":382,"_43":374,"_35":36,"_171":168,"_231":98,"_37":389,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":390,"_17":391},{"_33":379,"_13":380,"_62":381,"_43":382,"_35":36,"_171":168,"_231":98,"_37":383,"_39":26,"_65":66,"_166":384,"_67":24,"_172":-5,"_235":385,"_17":386},{"_33":371,"_13":372,"_62":373,"_43":374,"_35":36,"_171":168,"_231":98,"_37":375,"_39":26,"_65":66,"_166":376,"_67":24,"_172":-5,"_235":377,"_17":378},{"_33":367,"_13":359,"_62":354,"_43":291,"_35":36,"_171":168,"_231":98,"_37":368,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":369,"_17":370},{"_33":360,"_13":361,"_62":362,"_43":354,"_35":36,"_171":73,"_231":98,"_37":363,"_39":249,"_65":66,"_166":364,"_67":24,"_172":-5,"_235":365,"_17":366},{"_33":351,"_13":352,"_62":353,"_43":354,"_35":36,"_171":73,"_231":98,"_37":355,"_39":249,"_65":66,"_166":356,"_67":24,"_172":-5,"_235":357,"_17":358},{"_33":347,"_13":318,"_62":313,"_43":291,"_35":36,"_171":168,"_231":98,"_37":348,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":349,"_17":350},{"_33":340,"_13":341,"_62":342,"_43":313,"_35":36,"_171":73,"_231":98,"_37":343,"_39":40,"_65":66,"_166":344,"_67":24,"_172":-5,"_235":345,"_17":346},{"_33":333,"_13":334,"_62":335,"_43":313,"_35":36,"_171":168,"_231":98,"_37":336,"_39":26,"_65":66,"_166":337,"_67":24,"_172":-5,"_235":338,"_17":339},{"_33":326,"_13":327,"_62":328,"_43":313,"_35":36,"_171":168,"_231":98,"_37":329,"_39":26,"_65":66,"_166":330,"_67":24,"_172":-5,"_235":331,"_17":332},{"_33":319,"_13":320,"_62":321,"_43":313,"_35":36,"_171":73,"_231":98,"_37":322,"_39":249,"_65":66,"_166":323,"_67":24,"_172":-5,"_235":324,"_17":325},{"_33":310,"_13":311,"_62":312,"_43":313,"_35":36,"_171":168,"_231":98,"_37":314,"_39":26,"_65":66,"_166":315,"_67":24,"_172":-5,"_235":316,"_17":317},{"_33":303,"_13":304,"_62":305,"_43":291,"_35":36,"_171":168,"_231":98,"_37":306,"_39":26,"_65":21,"_166":307,"_67":24,"_172":-5,"_235":308,"_17":309},{"_33":296,"_13":297,"_62":298,"_43":291,"_35":36,"_171":168,"_231":98,"_37":299,"_39":26,"_65":66,"_166":300,"_67":24,"_172":-5,"_235":301,"_17":302},{"_33":288,"_13":289,"_62":290,"_43":291,"_35":36,"_171":168,"_231":98,"_37":292,"_39":26,"_65":66,"_166":293,"_67":24,"_172":-5,"_235":294,"_17":295},{"_33":283,"_13":275,"_62":270,"_43":-5,"_35":36,"_171":168,"_231":98,"_37":284,"_39":26,"_65":285,"_166":-5,"_67":24,"_172":-5,"_235":286,"_17":287},{"_33":276,"_13":277,"_62":278,"_43":270,"_35":36,"_171":73,"_231":98,"_37":279,"_39":168,"_65":66,"_166":280,"_67":24,"_172":-5,"_235":281,"_17":282},{"_33":267,"_13":268,"_62":269,"_43":270,"_35":36,"_171":73,"_231":98,"_37":271,"_39":249,"_65":66,"_166":272,"_67":24,"_172":-5,"_235":273,"_17":274},{"_33":260,"_13":261,"_62":262,"_43":-5,"_35":36,"_171":73,"_231":98,"_37":263,"_39":168,"_65":21,"_166":264,"_67":24,"_172":-5,"_235":265,"_17":266},{"_33":253,"_13":254,"_62":255,"_43":-5,"_35":36,"_171":73,"_231":98,"_37":256,"_39":168,"_65":21,"_166":257,"_67":24,"_172":-5,"_235":258,"_17":259},{"_33":245,"_13":246,"_62":247,"_43":-5,"_35":36,"_171":73,"_231":98,"_37":248,"_39":249,"_65":21,"_166":250,"_67":24,"_172":-5,"_235":251,"_17":252},{"_33":238,"_13":239,"_62":240,"_43":-5,"_35":36,"_171":73,"_231":98,"_37":241,"_39":168,"_65":21,"_166":242,"_67":24,"_172":-5,"_235":243,"_17":244},{"_33":228,"_13":229,"_62":230,"_43":-5,"_35":36,"_171":73,"_231":98,"_37":232,"_39":40,"_65":233,"_166":234,"_67":24,"_172":-5,"_235":236,"_17":237},"f6bb13be-96c3-4bf6-a0dd-6ecc9641b7ce","index.ts","01a07e3e-21e5-7478-815c-16a3fdd3d9b8","latest",["D",1788825191362],"http","import { parseVal, serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { bodyLimit } from \"npm:hono/body-limit\";\nimport { HTTPException } from \"npm:hono/http-exception\";\nimport { getCookie, setCookie } from \"npm:hono/cookie\";\nimport QRCode from \"npm:qrcode\";\nimport { buildResults } from \"./backend/aggregate.ts\";\nimport { randomId } from \"./backend/db.ts\";\nimport {\n clearResponses,\n createSurvey,\n deleteSurvey,\n getAllResponses,\n getResponse,\n getSurveyByAdminKey,\n getSurveyBySlug,\n sanitizeAnswers,\n updateSurvey,\n upsertResponse,\n} from \"./backend/surveys.ts\";\nimport { Root } from \"./frontend/root.tsx\";\nimport { approveProposal, createProposal, listProposals, setProposalVote } from \"./backend/proposals.ts\";\nimport { RequestError } from \"./backend/errors.ts\";\nimport { QuestionValidationError } from \"./shared/questions.ts\";\nimport type { Survey } from \"./shared/types.ts\";\n\nconst app = new Hono();\n\n// ---- Frontend shell (client-side routing handles the rest) ----\nconst SHELL_PATHS = [\"/\", \"/new\", \"/s/:slug\", \"/s/:slug/results\", \"/s/:slug/present\", \"/admin/:key\"];\nfor (const p of SHELL_PATHS) app.get(p, (c) => c.html(Root()));\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// ---- Respondent identity cookie ----\nconst SID_COOKIE = \"survey_sid\";\nfunction getOrSetSid(c: any): string {\n let sid = getCookie(c, SID_COOKIE);\n if (!sid || !/^[a-z0-9]{24}$/.test(sid)) {\n sid = randomId(24);\n setCookie(c, SID_COOKIE, sid, {\n path: \"/\",\n httpOnly: true,\n sameSite: \"Lax\",\n secure: true,\n maxAge: 60 * 60 * 24 * 365,\n });\n }\n return sid;\n}\n\n// ---- Public API ----\nconst proposalBodyLimit = bodyLimit({\n maxSize: 16 * 1024,\n onError: (c) => c.json({ error: \"Question requests must be smaller than 16 KB.\" }, 413),\n});\n\nasync function questionBody(req: Request): Promise> {\n let body: unknown;\n try {\n body = await req.json();\n } catch (error) {\n if (error instanceof SyntaxError) throw new RequestError(\"Provide valid JSON.\", 400);\n throw error;\n }\n if (!body || typeof body !== \"object\" || Array.isArray(body)) {\n throw new RequestError(\"Provide a JSON object.\", 400);\n }\n return body as Record;\n}\n\napp.post(\"/api/surveys\", async (c) => {\n const body = await c.req.json().catch(() => ({}));\n const title = String(body.title ?? \"\").slice(0, 120);\n const { survey, adminKey } = await createSurvey(title);\n return c.json({ slug: survey.slug, adminKey });\n});\n\n// Survey for respondents (strips nothing sensitive: admin key never leaves the DB)\napp.get(\"/api/s/:slug\", async (c) => {\n const survey = await getSurveyBySlug(c.req.param(\"slug\"));\n if (!survey) return c.json({ error: \"Not found\" }, 404);\n const sid = getOrSetSid(c);\n const existing = await getResponse(survey.id, sid);\n return c.json({ survey, existing });\n});\n\napp.post(\"/api/s/:slug/respond\", async (c) => {\n const survey = await getSurveyBySlug(c.req.param(\"slug\"));\n if (!survey) return c.json({ error: \"Not found\" }, 404);\n if (!survey.acceptingResponses) return c.json({ error: \"This survey is closed.\" }, 403);\n const sid = getOrSetSid(c);\n const body = await c.req.json().catch(() => ({}));\n const answers = sanitizeAnswers(survey, body.answers);\n await upsertResponse(survey.id, sid, answers);\n return c.json({ ok: true, answers });\n});\n\napp.get(\"/api/s/:slug/proposals\", async (c) => {\n const survey = await getSurveyBySlug(c.req.param(\"slug\"));\n if (!survey) return c.json({ error: \"Not found\" }, 404);\n const proposals = await listProposals(survey.id, getOrSetSid(c));\n return c.json({ proposals, acceptingResponses: survey.acceptingResponses });\n});\n\napp.post(\"/api/s/:slug/proposals\", proposalBodyLimit, async (c) => {\n const survey = await getSurveyBySlug(c.req.param(\"slug\"));\n if (!survey) return c.json({ error: \"Not found\" }, 404);\n if (!survey.acceptingResponses) return c.json({ error: \"This survey is closed.\" }, 403);\n const body = await questionBody(c.req.raw);\n await createProposal(survey.id, getOrSetSid(c), body.question);\n return c.json({ ok: true }, 201);\n});\n\napp.put(\"/api/s/:slug/proposals/:proposalId/vote\", proposalBodyLimit, async (c) => {\n const survey = await getSurveyBySlug(c.req.param(\"slug\"));\n if (!survey) return c.json({ error: \"Not found\" }, 404);\n if (!survey.acceptingResponses) return c.json({ error: \"This survey is closed.\" }, 403);\n const body = await questionBody(c.req.raw);\n if (typeof body.voted !== \"boolean\") return c.json({ error: \"voted must be a boolean.\" }, 400);\n await setProposalVote(survey.id, c.req.param(\"proposalId\"), getOrSetSid(c), body.voted);\n return c.json({ ok: true });\n});\n\napp.get(\"/api/s/:slug/results\", async (c) => {\n const survey = await getSurveyBySlug(c.req.param(\"slug\"));\n if (!survey) return c.json({ error: \"Not found\" }, 404);\n if (!survey.resultsVisible) return c.json({ error: \"Results are not visible yet.\" }, 403);\n const groupBy = survey.audienceFacets ? c.req.query(\"groupBy\") || null : null;\n const responses = await getAllResponses(survey.id);\n const visible = survey.questions.filter((q) => !q.hidden);\n return c.json({\n survey,\n totalResponses: responses.length,\n groupBy,\n groups: buildResults(survey, responses, groupBy, visible),\n });\n});\n\n// QR code (SVG) pointing to the respondent URL\napp.get(\"/api/s/:slug/qr.svg\", async (c) => {\n const url = new URL(c.req.url);\n const target = `${url.origin}/s/${c.req.param(\"slug\")}`;\n const svg = await QRCode.toString(target, { type: \"svg\", margin: 1, width: 512, errorCorrectionLevel: \"M\" });\n return c.body(svg, 200, { \"Content-Type\": \"image/svg+xml\", \"Cache-Control\": \"public, max-age=3600\" });\n});\n\n// ---- Admin API (gated by secret key) ----\nconst admin = new Hono();\nadmin.use(\"*\", async (c, next) => {\n const survey = await getSurveyByAdminKey(c.req.param(\"key\") as string);\n if (!survey) return c.json({ error: \"Invalid admin link\" }, 404);\n c.set(\"survey\" as never, survey as never);\n await next();\n});\n\nadmin.get(\"/\", async (c) => {\n const survey = c.get(\"survey\" as never) as any;\n const responses = await getAllResponses(survey.id);\n return c.json({ survey, totalResponses: responses.length });\n});\n\nadmin.patch(\"/\", async (c) => {\n const survey = c.get(\"survey\" as never) as any;\n const body = await c.req.json().catch(() => ({}));\n const fresh = await updateSurvey(survey.id, body);\n return c.json({ survey: fresh ?? survey });\n});\n\nadmin.get(\"/proposals\", async (c) => {\n const survey = c.get(\"survey\" as never) as Survey;\n return c.json({ proposals: await listProposals(survey.id), acceptingResponses: survey.acceptingResponses });\n});\n\nadmin.post(\"/proposals/:proposalId/approve\", proposalBodyLimit, async (c) => {\n const survey = c.get(\"survey\" as never) as Survey;\n const body = await questionBody(c.req.raw);\n await approveProposal(survey.id, c.req.param(\"proposalId\"), body.question);\n return c.json({ survey: await getSurveyBySlug(survey.slug) });\n});\n\nadmin.get(\"/results\", async (c) => {\n const survey = c.get(\"survey\" as never) as any;\n const groupBy = c.req.query(\"groupBy\") || null;\n const responses = await getAllResponses(survey.id);\n const all = c.req.query(\"includeHidden\") === \"1\";\n const visible = all ? survey.questions : survey.questions.filter((q: any) => !q.hidden);\n return c.json({\n survey,\n totalResponses: responses.length,\n groupBy,\n groups: buildResults(survey, responses, groupBy, visible),\n });\n});\n\nadmin.get(\"/export.csv\", async (c) => {\n const survey = c.get(\"survey\" as never) as any;\n const responses = await getAllResponses(survey.id);\n const esc = (s: unknown) => `\"${String(s ?? \"\").replace(/\"/g, '\"\"')}\"`;\n const header = survey.questions.map((q: any) => esc(q.prompt)).join(\",\");\n const optLabel = (q: any, id: string) => q.options.find((o: any) => o.id === id)?.label ?? id;\n const rows = responses.map((r) =>\n survey.questions.map((q: any) => {\n const v = r[q.id];\n if (Array.isArray(v)) return esc(v.map((x) => optLabel(q, x)).join(\" > \"));\n if (typeof v === \"string\" && q.options.length) return esc(optLabel(q, v));\n return esc(v);\n }).join(\",\")\n );\n return c.body([header, ...rows].join(\"\\n\"), 200, {\n \"Content-Type\": \"text/csv\",\n \"Content-Disposition\": `attachment; filename=\"${survey.slug}-responses.csv\"`,\n });\n});\n\nadmin.delete(\"/responses\", async (c) => {\n const survey = c.get(\"survey\" as never) as any;\n await clearResponses(survey.id);\n return c.json({ ok: true });\n});\n\nadmin.delete(\"/\", async (c) => {\n const survey = c.get(\"survey\" as never) as any;\n await deleteSurvey(survey.id);\n return c.json({ ok: true });\n});\n\napp.route(\"/api/admin/:key\", admin);\n\napp.onError((err, c) => {\n if (err instanceof RequestError) return c.json({ error: err.message }, err.status);\n if (err instanceof QuestionValidationError) return c.json({ error: err.message }, 400);\n if (err instanceof HTTPException) return err.getResponse();\n throw err;\n});\n\nexport default app.fetch;\n","children",[],[229],"b196f658-d85b-4516-b2c2-407d51d70532","deno.json","da983ea4-ab15-11f1-8b1b-1607ee4eb77e",["D",1788825191362],"{\n \"$schema\": \"https://raw.githubusercontent.com/denoland/deno/98f62cee78e85bfc47c62ed703777c6bc8794f1c/cli/schemas/config-file.v1.json\",\n \"lock\": false,\n \"compilerOptions\": {\n \"noImplicitAny\": false,\n \"strict\": true,\n \"types\": [\"https://www.val.town/types/valtown.d.ts\"],\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"dom.asynciterable\",\n \"deno.ns\",\n \"deno.unstable\"\n ]\n },\n \"lint\": {\n \"include\": [\"deno:/https/esm.town/**/*\"],\n \"rules\": {\n \"exclude\": [\"no-explicit-any\"]\n }\n },\n \"node_modules_dir\": false,\n \"experimental\": {\n \"unstable-node-globals\": true,\n \"unstable-temporal\": true,\n \"unstable-worker-options\": true,\n \"unstable-sloppy-imports\": true\n }\n}",[],[239],"e3a20cef-d50b-4aba-9789-8f5bfff5e1ba","README.md","01a07e3e-21e5-7478-815c-126b7052e16e",["D",1788825191362],2,"# 📊 Audience Survey\n\nLive polling for talks. Show a QR code, let the room answer on their phones with **no login**, then reveal results on the projector — with ranked-choice runoffs, word clouds, and breakdowns by who's in the audience.\n\n**[Create a survey](url:index.ts)** · no account needed\n\n## How a talk goes\n\n1. **Create** — hit the homepage, name your survey. You get a **secret admin link** (bookmark it — it's the only way back).\n2. **Build** — add questions. Mark ones like *\"What's your profession?\"* as **Demographic** so you can group everything else by them later.\n3. **Share** — put the fullscreen **join slide** (`/s//present`) on the projector. It shows a big QR code + short URL.\n4. **Collect** — the audience answers one question per screen. Each phone gets a cookie so answers are one-per-device and editable; no accounts.\n5. **Reveal** — flip **Show results to audience**. Open `/s//results` on the projector; it live-updates every 3s. Use **Group by** to split every chart by a demographic question, or click a group chip to isolate it.\n6. **Co-create** — participants suggest complete questions and upvote others from the intro or thank-you screen. In the admin **Proposals** tab, review a draft, edit it, then approve it to append a live question. Finished participants see an invitation to answer newly added questions rather than being moved away from the community queue.\n\n## Community questions\n\nParticipants can propose any supported question type, including options or scale bounds. Pending proposals are public, sorted by upvotes (oldest first on ties), and refresh every 5 seconds while the page is visible. Each device can toggle one upvote per proposal; submitting a proposal does not automatically vote for it. Proposals do not require answering the survey first, and participants may upvote their own ideas.\n\nThe presenter sets required, demographic, and result-visibility flags during review. Approval is manual regardless of vote count, immediately appends the edited question, and removes its proposal from the pending queue. Votes are not survey answers. There are no comments, participant edits, rejection actions, or automatic approvals.\n\nClosing **Accepting responses** also closes proposals and voting, but leaves pending ideas readable. Admins may still approve while closed; participants can answer those questions when the survey reopens. Clearing responses keeps proposals and votes; deleting the survey removes them.\n\nProposal prompts are limited to 500 characters. Choice questions require 2–20 distinct nonempty options of up to 120 characters each. Scales use integer bounds between -100 and 100 and contain 2–21 steps. Submission and approval requests are limited to 16 KB.\n\n## Question types\n\n| Type | Respondent sees | Results visualization |\n| --- | --- | --- |\n| Multiple choice (one / many) | Tappable cards | Colored bar chart; grouped bars when faceted |\n| Scale / rating (e.g. 1–5, 0–10 NPS) | Number grid | Heat-colored histogram + animated mean |\n| **Ranked choice** | Tap-to-rank list with reorder | **Instant-runoff animation** — step through elimination rounds, or switch to Borda points / first choices. Per-group winners when faceted |\n| Word cloud | Single word/phrase | Sized, tilted word cloud |\n| Free text | Textarea | Sticky-note wall |\n| Emoji reaction | Emoji grid | Floating emoji bubbles scaled by count |\n\n## Admin controls\n\n- **Accepting responses** — close the survey when you move on\n- **Show results to audience** — survey-wide reveal toggle\n- **Hide results** (per question) — keeps a question out of the audience view even when results are on\n- **Audience can group results** — let respondents use the facet controls too (off by default, keeps the projector clean)\n- **Focus one question** — projector-sized single-question view for pacing a talk\n- **Proposals** — review the audience's most-upvoted question drafts, edit, and approve\n- CSV export, clear responses, delete survey\n\n## Architecture\n\n```mermaid\ngraph LR\n subgraph Browser\n Home[/ Home/] --> Admin[\"/admin/:secretKey\"]\n QR[\"/s/:slug/present
QR slide\"] -.scan.-> Respond[\"/s/:slug
one question per screen\"]\n Results[\"/s/:slug/results
live charts + facets\"]\n end\n subgraph \"index.ts (Hono)\"\n API[\"/api/s/:slug/*
cookie sid\"]\n AdminAPI[\"/api/admin/:key/*
SHA-256 key check\"]\n Agg[\"backend/aggregate.ts
IRV · Borda · facets\"]\n end\n Respond --> API --> DB[(SQLite)]\n Results -->|poll 3s| API --> Agg\n Admin --> AdminAPI --> DB\n AdminAPI --> Agg\n```\n\n**Security model:** the admin key is a 28-char random token stored only as a SHA-256 hash. Respondents are identified by an `HttpOnly` cookie; clearing it or switching devices allows a second response or another proposal vote (acceptable trade-off for a login-free live poll — a \"welcome back\" banner nudges returning devices to edit instead). Public proposal payloads never expose device identifiers. Votes are unique per device and proposal, not per verified person; this is not strong abuse prevention.\n\nApproval claims the pending proposal and appends its question in a single SQLite write transaction. Question-builder saves compare their last saved question snapshot to prevent stale tabs from overwriting an approval; conflicts retain local edits and offer a reload rather than silently losing questions.\n\n## Files\n\n```\nindex.ts Hono server: shell routes, public + admin API, QR SVG\nbackend/db.ts SQLite schema, hashing, random ids\nbackend/surveys.ts CRUD, response upsert, answer sanitization\nbackend/aggregate.ts per-type aggregation, instant-runoff, facet bucketing\nbackend/proposals.ts proposal normalization, queries, approval workflow\nbackend/proposal-sql.ts proposal/vote schema and atomic mutation statements\nbackend/errors.ts expected API error types\nshared/types.ts Question/answer/result types shared by client & server\nshared/questions.ts shared question defaults and proposal validation\nfrontend/\n root.tsx HTML shell\n index.tsx React mount\n lib/api.ts typed fetch helpers\n lib/useProposals.ts abortable live proposal polling\n components/App.tsx path router\n pages/Home.tsx create a survey\n pages/Admin.tsx build · share · results tabs\n pages/Respond.tsx one-question-per-screen flow\n pages/Results.tsx public live results\n pages/Present.tsx fullscreen QR join slide\n components/builder/ QuestionEditor\n components/proposals/ participant composer, proposal cards, admin review\n components/respond/ QuestionInput (all types, ranked drag/tap)\n components/charts/ Charts (recharts + custom), ResultsView (polling, facets)\n```\n\n## Proposal regression tests\n\nThe tests use Deno's built-in runner and real in-memory SQLite through `node:sqlite`; the test configuration redirects only the Val Town SQLite import. No live survey data is used. The placeholder environment value lets the existing Val Town asset utility initialize without real credentials.\n\n```sh\nVAL_TOWN_API_KEY=local-test-placeholder deno test --allow-import --allow-env=VAL_TOWN_API_KEY \\\n --config tests/deno.json tests/api_test.ts shared/questions_test.ts backend/proposal-sql_test.ts\n```\n",[],[246],"5d519a2b-3624-4ca6-aeda-fc61e0d3ed41","AGENTS.md","daebcfd8-ab15-11f1-b1c0-1607ee4eb77e",["D",1788825191362],"You are an advanced assistant specialized in generating Val Town code.\n\n## Core Guidelines\n\n- Ask clarifying questions when requirements are ambiguous\n- Provide complete, functional solutions rather than skeleton implementations\n- Test your logic against edge cases before presenting the final solution\n- Ensure all code follows Val Town's specific platform requirements\n- If a section of code that you're working on is getting too complex, consider\n refactoring it into subcomponents\n\n## Code Standards\n\n- Generate code in TypeScript or TSX\n- Add appropriate TypeScript types and interfaces for all data structures\n- Prefer official SDKs or libraries than writing API calls directly\n- Ask the user to supply API or library documentation if you are at all unsure\n about it\n- **Never bake in secrets into the code** - always use environment variables\n- Include comments explaining complex logic (avoid commenting obvious\n operations)\n- Follow modern ES6+ conventions and functional programming practices if\n possible\n\n## Types of triggers\n\n### 1. HTTP Trigger\n\n- Create web APIs and endpoints\n- Handle HTTP requests and responses\n- Example structure:\n\n```ts\nexport default async function (req: Request) {\n return new Response(\"Hello World\");\n}\n```\n\nFiles that are HTTP triggers have http in their name like `foobar.http.tsx`\n\n### 2. Cron Triggers\n\n- Run on a schedule\n- Use cron expressions for timing\n- Example structure:\n\n```ts\nexport default async function () {\n // Scheduled task code\n}\n```\n\nFiles that are Cron triggers have cron in their name like `foobar.cron.tsx`\n\n### 3. Email Triggers\n\n- Process incoming emails\n- Handle email-based workflows\n- Example structure:\n\n```ts\nexport default async function (email: Email) {\n // Process email\n}\n```\n\nFiles that are Email triggers have email in their name like `foobar.email.tsx`\n\n## Val Town Standard Libraries\n\nVal Town provides several hosted services and utility functions.\n\n### Blob Storage\n\n```ts\nimport { blob } from \"https://esm.town/v/std/blob/main.ts\";\nawait blob.setJSON(\"myKey\", { hello: \"world\" });\nlet blobDemo = await blob.getJSON(\"myKey\");\nlet appKeys = await blob.list(\"app_\");\nawait blob.delete(\"myKey\");\n```\n\n### SQLite\n\n```ts\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nconst TABLE_NAME = \"todo_app_users_2\";\n// Create table - do this before usage and change table name when modifying schema\nawait sqlite.execute(`CREATE TABLE IF NOT EXISTS ${TABLE_NAME} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL\n)`);\n// Query data\nconst result = await sqlite.execute(\n `SELECT * FROM ${TABLE_NAME} WHERE id = ?`,\n [1],\n);\n```\n\n### OpenAI\n\n```ts\nimport { OpenAI } from \"https://esm.town/v/std/openai\";\nconst openai = new OpenAI();\nconst completion = await openai.chat.completions.create({\n messages: [\n { role: \"user\", content: \"Say hello in a creative way\" },\n ],\n model: \"gpt-4o-mini\",\n max_tokens: 30,\n});\n```\n\n### Email\n\n```ts\nimport { email } from \"https://esm.town/v/std/email\";\n// By default emails the owner of the val\nawait email({\n subject: \"Hi\",\n text: \"Hi\",\n html: \"

Hi

\",\n});\n```\n\n## Val Town Utility Functions\n\nVal Town provides several utility functions to help with common project tasks.\n\n### Importing Utilities\n\nAlways import utilities with version pins to avoid breaking changes:\n\n```ts\nimport {\n parseProject,\n readFile,\n serveFile,\n} from \"https://esm.town/v/std/utils@85-main/index.ts\";\n```\n\n### Available Utilities\n\n#### **serveFile** - Serve project files with proper content types\n\nFor example, in Hono:\n\n```ts\n// serve all files in frontend/ and shared/\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n```\n\n#### **readFile** - Read files from within the project:\n\n```ts\n// Read a file from the project\nconst fileContent = await readFile(\"/frontend/index.html\", import.meta.url);\n```\n\n#### **listFiles** - List all files in the project\n\n```ts\nconst files = await listFiles(import.meta.url);\n```\n\n#### **parseProject** - Extract information about the current project from import.meta.url\n\nThis is useful for including info for linking back to a val, ie in \"view source\"\nurls:\n\n```ts\nconst projectVal = parseProject(import.meta.url);\nconsole.log(projectVal.username); // Owner of the project\nconsole.log(projectVal.name); // Project name\nconsole.log(projectVal.version); // Version number\nconsole.log(projectVal.branch); // Branch name\nconsole.log(projectVal.links.self.project); // URL to the project page\n```\n\nHowever, it's _extremely importing_ to note that `parseProject` and other\nStandard Library utilities ONLY RUN ON THE SERVER. If you need access to this\ndata on the client, run it in the server and pass it to the client by splicing\nit into the HTML page or by making an API request for it.\n\n## Val Town Platform Specifics\n\n- **Redirects:** Use\n `return new Response(null, { status: 302, headers: { Location: \"/place/to/redirect\" }})`\n instead of `Response.redirect` which is broken\n- **Images:** Avoid external images or base64 images. Use emojis, unicode\n symbols, or icon fonts/libraries instead\n- **AI Image:** To inline generate an AI image use:\n `

`\n- **Storage:** DO NOT use the Deno KV module for storage\n- **Browser APIs:** DO NOT use the `alert()`, `prompt()`, or `confirm()` methods\n- **Weather Data:** Use open-meteo for weather data (doesn't require API keys)\n unless otherwise specified\n- **View Source:** Add a view source link by importing & using\n `import.meta.url.replace(\"esm.sh\", \"val.town)\"` (or passing this data to the\n client) and include `target=\"_top\"` attribute\n- **Error Debugging:** Add\n `` to HTML to capture\n client-side errors\n- **Error Handling:** Only use try...catch when there's a clear local\n resolution; Avoid catches that merely log or return 500s. Let errors bubble up\n with full context\n- **Environment Variables:** Use `Deno.env.get('keyname')` when you need to, but\n generally prefer APIs that don't require keys\n- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure\n compatibility on server and browser\n- **Storage Strategy:** Only use backend storage if explicitly required; prefer\n simple static client-side sites\n- **React Configuration:** When using React libraries, pin versions with\n `?deps=react@18.2.0,react-dom@18.2.0` and start the file with\n `/** @jsxImportSource https://esm.sh/react@18.2.0 */`\n- Ensure all React dependencies and sub-dependencies are pinned to the same\n version\n- **Styling:** Default to using TailwindCSS via\n `` unless otherwise\n specified\n\n## Project Structure and Design Patterns\n\n### Recommended Directory Structure\n\n```\n├── backend/\n│ ├── database/\n│ │ ├── migrations.ts # Schema definitions\n│ │ ├── queries.ts # DB query functions\n│ │ └── README.md\n│ └── routes/ # Route modules\n│ ├── [route].ts\n│ └── static.ts # Static file serving\n│ ├── index.ts # Main entry point\n│ └── README.md\n├── frontend/\n│ ├── components/\n│ │ ├── App.tsx\n│ │ └── [Component].tsx\n│ ├── favicon.svg\n│ ├── index.html # Main HTML template\n│ ├── index.tsx # Frontend JS entry point\n│ ├── README.md\n│ └── style.css\n├── README.md\n└── shared/\n ├── README.md\n └── utils.ts # Shared types and functions\n```\n\n### Backend (Hono) Best Practices\n\n- Hono is the recommended API framework\n- Main entry point should be `backend/index.ts`\n- **Static asset serving:** Use the utility functions to read and serve project\n files:\n ```ts\n import {\n readFile,\n serveFile,\n } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\n // serve all files in frontend/ and shared/\n app.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\n app.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n // For index.html, often you'll want to bootstrap with initial data\n app.get(\"/\", async (c) => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n\n // Inject data to avoid extra round-trips\n const initialData = await fetchInitialData();\n const dataScript = ``;\n\n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n });\n ```\n- Create RESTful API routes for CRUD operations\n- Always include this snippet at the top-level Hono app to re-throwing errors to\n see full stack traces:\n ```ts\n // Unwrap Hono errors to see original error details\n app.onError((err, c) => {\n throw err;\n });\n ```\n\n### Database Patterns\n\n- Run migrations on startup or comment out for performance\n- Change table names when modifying schemas rather than altering\n- Export clear query functions with proper TypeScript typing\n\n## Common Gotchas and Solutions\n\n1. **Environment Limitations:**\n - Val Town runs on Deno in a serverless context, not Node.js\n - Code in `shared/` must work in both frontend and backend environments\n - Cannot use `Deno` keyword in shared code\n - Use `https://esm.sh` for imports that work in both environments\n\n2. **SQLite Peculiarities:**\n - Limited support for ALTER TABLE operations\n - Create new tables with updated schemas and copy data when needed\n - Always run table creation before querying\n\n3. **React Configuration:**\n - All React dependencies must be pinned to 18.2.0\n - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of\n React files\n - Rendering issues often come from mismatched React versions\n\n4. **File Handling:**\n - Val Town only supports text files, not binary\n - Use the provided utilities to read files across branches and forks\n - For files in the project, use `readFile` helpers\n\n5. **API Design:**\n - `fetch` handler is the entry point for HTTP vals\n - Run the Hono app with\n `export default app.fetch // This is the entry point for HTTP vals`",[],[254],"4eb38784-e284-4f12-900f-c2c987e63100",".vtignore","db06bd98-ab15-11f1-9e11-1607ee4eb77e",["D",1788825191362],".git\n.vscode\n.cursorrules\n.DS_Store\nnode_modules\nvendor\n.github\n.gitignore\n**/*_test.ts\ntests\n",[],[261],"60cf18b7-c6a9-4462-a8f1-a131362572b7","types.ts","01a07e3e-21e5-7478-815c-0b327146627b","01a07e3e-21e5-7478-815c-0c49bc751c75",["D",1788825191362],"export type QuestionType =\n | \"single_choice\"\n | \"multi_choice\"\n | \"scale\"\n | \"free_text\"\n | \"ranked_choice\"\n | \"word_cloud\"\n | \"emoji_reaction\";\n\nexport interface Option {\n id: string;\n label: string;\n}\n\nexport interface Question {\n id: string;\n position: number;\n type: QuestionType;\n prompt: string;\n options: Option[]; // for choice/ranked/emoji types\n scaleMin?: number; // for scale\n scaleMax?: number;\n isDemographic: boolean;\n required: boolean;\n hidden: boolean; // per-question hide override on results\n}\n\nexport interface Survey {\n id: string;\n slug: string;\n title: string;\n description: string;\n resultsVisible: boolean;\n acceptingResponses: boolean;\n audienceFacets: boolean; // can the audience use group-by on results?\n createdAt: string;\n questions: Question[];\n}\n\nexport type QuestionDraft = Pick;\n\nexport interface QuestionProposal {\n id: string;\n draft: QuestionDraft;\n status: \"pending\" | \"approved\";\n createdAt: string;\n voteCount: number;\n voted: boolean;\n}\n\nexport interface ProposalsPayload {\n proposals: QuestionProposal[];\n acceptingResponses: boolean;\n}\n\n/** Answer values: single -> optionId; multi -> optionId[]; scale -> number;\n * free_text/word_cloud -> string; ranked_choice -> optionId[] (ordered); emoji -> optionId */\nexport type AnswerValue = string | number | string[];\n\nexport type Answers = Record;\n\nexport interface IRVRound {\n round: number;\n tallies: Record;\n eliminated: string | null;\n winner: string | null;\n}\n\nexport interface QuestionAggregate {\n questionId: string;\n type: QuestionType;\n responseCount: number;\n /** For choice/emoji: counts by optionId. */\n counts?: Record;\n /** For scale: counts by value, plus mean. */\n distribution?: Record;\n mean?: number | null;\n /** For text/word cloud. */\n texts?: string[];\n words?: { text: string; value: number }[];\n /** For ranked choice. */\n irv?: IRVRound[];\n borda?: Record;\n firstChoice?: Record;\n}\n\nexport interface FacetGroup {\n key: string; // optionId or scale value, or \"__all__\"\n label: string;\n responseCount: number;\n aggregates: QuestionAggregate[];\n}\n\nexport interface ResultsPayload {\n survey: Survey;\n totalResponses: number;\n groupBy: string | null;\n groups: FacetGroup[];\n}\n\nexport const QUESTION_TYPE_LABELS: Record = {\n single_choice: \"Multiple choice (pick one)\",\n multi_choice: \"Multiple choice (pick many)\",\n scale: \"Scale / rating\",\n free_text: \"Free text\",\n ranked_choice: \"Ranked choice\",\n word_cloud: \"Word cloud (one word/phrase)\",\n emoji_reaction: \"Emoji reaction\",\n};\n\nexport const DEFAULT_EMOJIS = [\"🔥\", \"😍\", \"🤔\", \"😴\", \"😂\", \"🤯\"];\n\nexport function hasOptions(t: QuestionType) {\n return t === \"single_choice\" || t === \"multi_choice\" || t === \"ranked_choice\" || t === \"emoji_reaction\";\n}\n",[],[275,268],"shared","67895d8b-b08a-4fef-a06c-4923e8b777cd","questions.ts","daf68964-ab15-11f1-9e2f-1607ee4eb77e",["D",1788825191362],"import { DEFAULT_EMOJIS, hasOptions, QUESTION_TYPE_LABELS } from \"./types.ts\";\nimport type { Question, QuestionDraft, QuestionType } from \"./types.ts\";\n\nexport const QUESTION_LIMITS = {\n prompt: 500,\n optionLabel: 120,\n options: 20,\n scaleSteps: 21,\n};\n\nexport class QuestionValidationError extends Error {}\n\nexport function newQuestion(type: QuestionType = \"single_choice\"): Question {\n return {\n id: crypto.randomUUID(),\n position: 0,\n type,\n prompt: \"\",\n options: hasOptions(type)\n ? (type === \"emoji_reaction\" ? DEFAULT_EMOJIS : [\"\", \"\"]).map((\n label,\n ) => ({\n id: crypto.randomUUID(),\n label,\n }))\n : [],\n ...(type === \"scale\" ? { scaleMin: 1, scaleMax: 5 } : {}),\n isDemographic: false,\n required: false,\n hidden: false,\n };\n}\n\nfunction record(raw: unknown): Record {\n if (!raw || typeof raw !== \"object\" || Array.isArray(raw)) {\n throw new QuestionValidationError(\"Provide a question object.\");\n }\n return raw as Record;\n}\n\nfunction text(raw: unknown, max: number, label: string): string {\n if (typeof raw !== \"string\" || !raw.trim() || raw.trim().length > max) {\n throw new QuestionValidationError(\n `${label} must contain 1-${max} characters.`,\n );\n }\n return raw.trim();\n}\n\n/** Ignore client IDs and admin flags; every approved question gets fresh identifiers. */\nexport function normalizeDraft(raw: unknown): QuestionDraft {\n const input = record(raw);\n if (\n typeof input.type !== \"string\" ||\n !Object.hasOwn(QUESTION_TYPE_LABELS, input.type)\n ) {\n throw new QuestionValidationError(\"Choose a supported question type.\");\n }\n const type = input.type as QuestionType;\n const draft: QuestionDraft = {\n type,\n prompt: text(input.prompt, QUESTION_LIMITS.prompt, \"Question prompt\"),\n options: [],\n };\n if (hasOptions(type)) {\n if (\n !Array.isArray(input.options) || input.options.length < 2 ||\n input.options.length > QUESTION_LIMITS.options\n ) {\n throw new QuestionValidationError(\n `Provide 2-${QUESTION_LIMITS.options} options.`,\n );\n }\n draft.options = input.options.map((option) => ({\n id: crypto.randomUUID(),\n label: text(record(option).label, QUESTION_LIMITS.optionLabel, \"Option\"),\n }));\n if (\n new Set(draft.options.map((o) => o.label.toLowerCase())).size !==\n draft.options.length\n ) {\n throw new QuestionValidationError(\"Options must have distinct labels.\");\n }\n }\n if (type === \"scale\") {\n const min = input.scaleMin;\n const max = input.scaleMax;\n if (\n typeof min !== \"number\" || typeof max !== \"number\" ||\n !Number.isSafeInteger(min) ||\n !Number.isSafeInteger(max) || min < -100 || max > 100 || min >= max ||\n max - min + 1 > QUESTION_LIMITS.scaleSteps\n ) {\n throw new QuestionValidationError(\n \"Use integer scale bounds from -100 to 100, with 2-21 steps.\",\n );\n }\n draft.scaleMin = min;\n draft.scaleMax = max;\n }\n return draft;\n}\n\nexport function questionFromDraft(draft: QuestionDraft): Question {\n return { ...newQuestion(draft.type), ...draft };\n}\n\nexport function normalizeApprovedQuestion(raw: unknown): Question {\n const input = record(raw);\n const question = questionFromDraft(normalizeDraft(raw));\n for (const key of [\"required\", \"hidden\", \"isDemographic\"] as const) {\n if (input[key] !== undefined && typeof input[key] !== \"boolean\") {\n throw new QuestionValidationError(`${key} must be a boolean.`);\n }\n question[key] = input[key] === true;\n }\n const canFacet = [\"single_choice\", \"multi_choice\", \"scale\", \"emoji_reaction\"]\n .includes(question.type);\n question.isDemographic = canFacet && question.isDemographic;\n return question;\n}\n",[],[275,277],"645f2502-dca9-4898-993a-679851959aa0",["D",1788824396262],"directory",[221,222],[275],"59c6ed52-5618-494f-b1d7-515660b3bf2c","root.tsx","01a07e3e-21e5-7478-815c-028cd619b5c9","01a07e3e-21e5-7478-815c-07aae2b6009b",["D",1788824396262],"/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\nimport { immutableFileUrl } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport function Root() {\n return (\n <>\n {raw(\"\")}\n \n \n \n \n Audience Survey\n

History · ProposalReview.tsx