[{"_1":2,"_248":-5,"_249":-5},"loaderData",{"_3":4,"_92":93,"_235":236,"_247":-5},"root",{"_5":6,"_33":34,"_59":60,"_90":91},"ctx",{"_7":8,"_18":19,"_20":-5,"_21":22,"_23":24,"_25":26,"_27":26,"_28":26,"_29":30,"_31":32},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"sessionClaims","sessionId","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","environmentVariableKeys",[],"user","preferences_keybindings","default","preferences_theme","light","preferences_fixers",false,"preferences_copilot","preferences_selection_ai","preferences_model","claude-3-5-haiku-20241022","notification_count",0,"ENV",{"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_49":50,"_51":52,"_53":54,"_55":56,"_57":58},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","4a6cf7de2f6415ba1b99e16e2b6953262c3d8375","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","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","API_URL","https://api.val.town","WORKER_FINGERPRINT","d0746fd0512e0614e3f717607f0da4cd","clerkState",{"_61":62},"__internal_clerk_state",{"_63":64,"_65":44,"_66":67,"_68":67,"_69":26,"_70":67,"_71":67,"_72":67,"_73":67,"_74":67,"_75":67,"_76":67,"_77":67,"_78":79,"_88":26,"_89":26},"__clerk_ssr_state",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__signInForceRedirectUrl","__signUpForceRedirectUrl","__signInFallbackRedirectUrl","__signUpFallbackRedirectUrl","__clerk_debug",{"_80":26,"_81":67,"_82":83,"_84":67,"_85":44,"_86":26,"_87":67},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","remixVersion",2,"routes/_app.v.$handle.$name",{"_94":95,"_96":97,"_95":98,"_230":-5,"_231":-5,"_232":233,"_130":131,"_138":139,"_101":102,"_99":100,"_118":-7,"_51":52,"_234":26},"type","val","author","b85dcfbf-50f1-466c-9e2b-28ac90e0dd23",{"_99":100,"_96":97,"_101":102,"_103":-5,"_104":-5,"_105":106,"_107":-5,"_108":109,"_110":111,"_112":26,"_113":111,"_114":115,"_116":117,"_118":119,"_120":26,"_121":91,"_122":32,"_123":32,"_124":125,"_126":32,"_127":32,"_128":-5,"_20":129,"_134":-5,"_135":-7,"_136":137,"_138":139,"_140":141},"name","judgeWordsDash","valNameId","fd297990-f3a3-11ef-980a-569c3dd06744","parentFolderId","isOwned","privacy","public","readme","valType","http","currentVersion","442c3be4-f3ee-11ef-8d7e-569c3dd06744","legacyPrivate","id","code","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\nfunction PieChart({ percentage }) {\n const angle = percentage * 360;\n return (\n \n );\n}\n\nfunction BarChart({ distribution }) {\n const maxValue = Math.max(...Object.values(distribution));\n const barWidth = 6;\n const gap = 2;\n const height = 40;\n\n const colors = {\n \"0\": \"#607D8B\",\n \"1\": \"#FF9800\",\n \"2\": \"#FFEB3B\",\n \"3\": \"#4CAF50\",\n \"4\": \"#2196F3\",\n \"5\": \"#9C27B0\",\n };\n\n return (\n \n );\n}\n\nfunction IntroBox() {\n return (\n

\n To one day improve my little word games, I \"made\"{\" \"}\n an app{\" \"}\n to let me rate whether words in the Wordnik word game list are \"real words\" or not. This page let's me track my\n progress as I judge. Both the Judge Words app and this dashboard were built leaning quite heavily on Val Town's\n Townie AI interface. If you're in the mood for a very simple word game, check out{\" \"}\n Loopy Letters{\" \"}- Alex.\n

\n );\n}\n\nfunction Dashboard() {\n const [stats, setStats] = useState([]);\n\n useEffect(() => {\n fetch(\"/stats\")\n .then(response => response.json())\n .then(setStats);\n }, []);\n\n const grandTotal = stats.length > 0 ? stats[0] : null;\n\n return (\n

Word Judgment Dashboard

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {grandTotal && (\n \n \n \n \n \n \n \n \n \n )}\n {stats.slice(1).map(stat => (\n \n \n \n \n \n \n \n \n \n ))}\n \n

Word Length	Total Words	Judged Words	% Judged	Pie Chart	Avg Rating	Rating Distribution
Grand Total	{grandTotal.totalWords}	{grandTotal.judgedWords}	{(grandTotal.percentJudged * 100).toFixed(2)}%	\n \n	{grandTotal.avgRating.toFixed(2)}	\n \n
{stat.wordLength}	{stat.totalWords}	{stat.judgedWords}	{(stat.percentJudged * 100).toFixed(2)}%	\n \n	{stat.avgRating.toFixed(2)}	\n \n

\n \n View Source\n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}\n\nconst styles = {\n container: {\n fontFamily: \"\\\"Roboto Mono\\\", monospace\",\n maxWidth: \"1100px\",\n margin: \"0 auto\",\n padding: \"20px\",\n },\n introBox: {\n backgroundColor: \"#f0f0f0\",\n border: \"1px solid #ddd\",\n borderRadius: \"5px\",\n padding: \"15px\",\n marginBottom: \"20px\",\n },\n table: {\n width: \"100%\",\n borderCollapse: \"collapse\",\n marginBottom: \"20px\",\n },\n cell: {\n padding: \"8px\",\n border: \"1px solid #ddd\",\n },\n cellNumber: {\n padding: \"8px\",\n border: \"1px solid #ddd\",\n textAlign: \"right\",\n },\n cellCenter: {\n padding: \"8px\",\n border: \"1px solid #ddd\",\n textAlign: \"center\",\n },\n grandTotal: {\n backgroundColor: \"#f5f5f5\",\n fontWeight: \"bold\",\n },\n grandTotalCell: {\n padding: \"8px\",\n border: \"2px solid #aaa\",\n },\n grandTotalCellNumber: {\n padding: \"8px\",\n border: \"2px solid #aaa\",\n textAlign: \"right\",\n },\n grandTotalCellCenter: {\n padding: \"8px\",\n border: \"2px solid #aaa\",\n textAlign: \"center\",\n },\n sourceLink: {\n color: \"#666\",\n textDecoration: \"none\",\n fontSize: \"0.8em\",\n },\n};","createdAt",["D",1740539014307],"version",22,"currentUserHasLiked","likeCount","forkCount","referenceCount","dependencyCount",1,"commentCount","prCount","mergedPr",{"_130":131,"_132":133},"handle","alexwein","profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18ycjh6emNHdk9mMnY5djU3OFZBbEdleGhQZFAifQ","forkedVal","interval","slug","alexwein/judgeWordsDash","description","@jsxImportSource https://esm.sh/react@18.2.0","versions",[142,145,149,153,157,161,165,169,173,177,181,185,189,193,197,201,205,209,213,217,221,224,227],{"_118":119,"_143":-5,"_116":144,"_113":111},"prId",["D",1740539014307],{"_118":146,"_143":-5,"_116":147,"_113":148},21,["D",1740527628997],"c1ffdece-f3d3-11ef-9773-569c3dd06744",{"_118":150,"_143":-5,"_116":151,"_113":152},20,["D",1740527585418],"a806017e-f3d3-11ef-a00f-569c3dd06744",{"_118":154,"_143":-5,"_116":155,"_113":156},19,["D",1740521146143],"a9eb115a-f3c4-11ef-b6f9-569c3dd06744",{"_118":158,"_143":-5,"_116":159,"_113":160},18,["D",1740520655790],"85a57480-f3c3-11ef-8766-569c3dd06744",{"_118":162,"_143":-5,"_116":163,"_113":164},17,["D",1740519885426],"ba7842ac-f3c1-11ef-89d6-569c3dd06744",{"_118":166,"_143":-5,"_116":167,"_113":168},16,["D",1740517274188],"a60ce418-f3bb-11ef-8921-569c3dd06744",{"_118":170,"_143":-5,"_116":171,"_113":172},15,["D",1740511840724],"ff743c48-f3ae-11ef-8314-569c3dd06744",{"_118":174,"_143":-5,"_116":175,"_113":176},14,["D",1740511757245],"cdb242a4-f3ae-11ef-9c67-569c3dd06744",{"_118":178,"_143":-5,"_116":179,"_113":180},13,["D",1740511578574],"6332f748-f3ae-11ef-8220-569c3dd06744",{"_118":182,"_143":-5,"_116":183,"_113":184},12,["D",1740509345142],"2ff7e780-f3a9-11ef-ba44-569c3dd06744",{"_118":186,"_143":-5,"_116":187,"_113":188},11,["D",1740509312484],"1c809b16-f3a9-11ef-b03c-569c3dd06744",{"_118":190,"_143":-5,"_116":191,"_113":192},10,["D",1740509296225],"12d03fb8-f3a9-11ef-86a0-569c3dd06744",{"_118":194,"_143":-5,"_116":195,"_113":196},9,["D",1740509181744],"ce96f36e-f3a8-11ef-bdde-569c3dd06744",{"_118":198,"_143":-5,"_116":199,"_113":200},8,["D",1740508521874],"45437d9a-f3a7-11ef-8230-569c3dd06744",{"_118":202,"_143":-5,"_116":203,"_113":204},7,["D",1740507880962],"c7401990-f3a5-11ef-a32f-569c3dd06744",{"_118":206,"_143":-5,"_116":207,"_113":208},6,["D",1740507781569],"8c0228e6-f3a5-11ef-8c50-569c3dd06744",{"_118":210,"_143":-5,"_116":211,"_113":212},5,["D",1740507602960],"218c1b8e-f3a5-11ef-8e36-569c3dd06744",{"_118":214,"_143":-5,"_116":215,"_113":216},4,["D",1740507507477],"e8a46858-f3a4-11ef-8e36-569c3dd06744",{"_118":218,"_143":-5,"_116":219,"_113":220},3,["D",1740507339125],"844b09fc-f3a4-11ef-8db1-569c3dd06744",{"_118":91,"_143":-5,"_116":222,"_113":223},["D",1740507221176],"3dfcff50-f3a4-11ef-a1ba-569c3dd06744",{"_118":125,"_143":-5,"_116":225,"_113":226},["D",1740507155864],"170f776a-f3a4-11ef-91c9-569c3dd06744",{"_118":32,"_143":-5,"_116":228,"_113":229},["D",1740507112430],"fd2c6d58-f3a3-11ef-980a-569c3dd06744","recentThread","breadcrumbs","comments",[],"isOwner","routes/_app.v.$handle.$name.versions.$(version)",{"_94":237,"_238":239,"_95":240},"single","redirect","/v/alexwein/judgeWordsDash/versions",{"_113":180,"_114":241,"_118":178,"_116":242,"_243":100,"_101":102,"_108":109,"_130":131,"_11":97,"_244":-5,"_245":-5,"_246":-5,"_234":26,"_136":137},"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\nfunction PieChart({ percentage }) {\n const angle = percentage * 360;\n return (\n \n );\n}\n\nfunction BarChart({ distribution }) {\n const maxValue = Math.max(...Object.values(distribution));\n const barWidth = 6;\n const gap = 2;\n const height = 40;\n\n const colors = {\n \"0\": \"#607D8B\",\n \"1\": \"#FF9800\",\n \"2\": \"#FFEB3B\",\n \"3\": \"#4CAF50\",\n \"4\": \"#2196F3\",\n \"5\": \"#9C27B0\",\n };\n\n return (\n \n );\n}\n\nfunction AreaChart({ timeSeriesData }) {\n const width = 1000;\n const height = 300;\n const margin = { top: 20, right: 20, bottom: 30, left: 50 };\n const chartWidth = width - margin.left - margin.right;\n const chartHeight = height - margin.top - margin.bottom;\n\n const dates = timeSeriesData.map(d => new Date(d.date));\n const minDate = new Date(Math.min(...dates));\n const maxDate = new Date(Math.max(...dates));\n\n const xScale = (date) => (\n ((date - minDate) / (maxDate - minDate)) * chartWidth\n );\n\n const yScale = (value) => (\n chartHeight - (value / timeSeriesData[timeSeriesData.length - 1].total) * chartHeight\n );\n\n const area = (judgment) => {\n let d = `M${xScale(new Date(timeSeriesData[0].date))},${chartHeight}`;\n for (let point of timeSeriesData) {\n d += `L${xScale(new Date(point.date))},${yScale(point[judgment])}`;\n }\n d += `L${xScale(new Date(timeSeriesData[timeSeriesData.length - 1].date))},${chartHeight}Z`;\n return d;\n };\n\n const colors = {\n judgment0: \"#607D8B\",\n judgment1: \"#FF9800\",\n judgment2: \"#FFEB3B\",\n judgment3: \"#4CAF50\",\n judgment4: \"#2196F3\",\n judgment5: \"#9C27B0\",\n };\n\n return (\n \n );\n}\n\nfunction IntroBox() {\n return (\n

\n );\n}\n\nfunction Dashboard() {\n const [stats, setStats] = useState([]);\n const [timeSeriesData, setTimeSeriesData] = useState([]);\n\n useEffect(() => {\n fetch(\"/stats\")\n .then(response => response.json())\n .then(setStats);\n\n fetch(\"/time-series\")\n .then(response => response.json())\n .then(setTimeSeriesData);\n }, []);\n\n const grandTotal = stats.length > 0 ? stats[0] : null;\n\n return (\n

Word Judgment Dashboard

\n \n

Cumulative Judgments Over Time

\n {timeSeriesData.length > 0 && }\n

\n \n \n \n \n \n \n \n \n \n \n \n \n \n {grandTotal && (\n \n \n \n \n \n \n \n \n \n )}\n {stats.slice(1).map(stat => (\n \n \n \n \n \n \n \n \n \n ))}\n \n

Word Length	Total Words	Judged Words	% Judged	Pie Chart	Avg Rating	Rating Distribution
Grand Total	{grandTotal.totalWords}	{grandTotal.judgedWords}	{(grandTotal.percentJudged * 100).toFixed(2)}%	\n \n	{grandTotal.avgRating.toFixed(2)}	\n \n
{stat.wordLength}	{stat.totalWords}	{stat.judgedWords}	{(stat.percentJudged * 100).toFixed(2)}%	\n \n	{stat.avgRating.toFixed(2)}	\n \n

\n \n View Source\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n\n // Handle stats request\n if (new URL(request.url).pathname === \"/stats\") {\n const stats = await sqlite.execute(`\n WITH WordStats AS (\n SELECT \n length(word) as wordLength,\n COUNT(*) as totalWords,\n COUNT(judgment) as judgedWords,\n AVG(judgment) as avgRating,\n json_object(\n '0', COUNT(CASE WHEN judgment = 0 THEN 1 END),\n '1', COUNT(CASE WHEN judgment = 1 THEN 1 END),\n '2', COUNT(CASE WHEN judgment = 2 THEN 1 END),\n '3', COUNT(CASE WHEN judgment = 3 THEN 1 END),\n '4', COUNT(CASE WHEN judgment = 4 THEN 1 END),\n '5', COUNT(CASE WHEN judgment = 5 THEN 1 END)\n ) as distribution\n FROM judgments\n GROUP BY length(word)\n\n UNION ALL\n\n SELECT \n 'total' as wordLength,\n COUNT(*) as totalWords,\n COUNT(judgment) as judgedWords,\n AVG(CASE WHEN judgment > 0 THEN judgment END) as avgRating,\n json_object(\n '0', COUNT(CASE WHEN judgment = 0 THEN 1 END),\n '1', COUNT(CASE WHEN judgment = 1 THEN 1 END),\n '2', COUNT(CASE WHEN judgment = 2 THEN 1 END),\n '3', COUNT(CASE WHEN judgment = 3 THEN 1 END),\n '4', COUNT(CASE WHEN judgment = 4 THEN 1 END),\n '5', COUNT(CASE WHEN judgment = 5 THEN 1 END)\n ) as distribution\n FROM judgments\n )\n SELECT \n wordLength, \n totalWords, \n judgedWords, \n CAST(judgedWords AS FLOAT) / totalWords as percentJudged, \n COALESCE(avgRating, 0) as avgRating,\n distribution\n FROM WordStats\n ORDER BY \n CASE WHEN wordLength = 'total' THEN 0 ELSE 1 END,\n CAST(wordLength AS INTEGER)\n `);\n\n return new Response(JSON.stringify(stats.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Handle time series request\n if (new URL(request.url).pathname === \"/time-series\") {\n const timeSeries = await sqlite.execute(`\n WITH RECURSIVE\n dates(date) AS (\n SELECT DATE(MIN(judged_at)) FROM judgments\n UNION ALL\n SELECT DATE(date, '+1 day')\n FROM dates\n WHERE date < DATE(CURRENT_DATE)\n ),\n daily_counts AS (\n SELECT\n DATE(judged_at) as date,\n SUM(CASE WHEN judgment = 0 THEN 1 ELSE 0 END) as judgment0,\n SUM(CASE WHEN judgment = 1 THEN 1 ELSE 0 END) as judgment1,\n SUM(CASE WHEN judgment = 2 THEN 1 ELSE 0 END) as judgment2,\n SUM(CASE WHEN judgment = 3 THEN 1 ELSE 0 END) as judgment3,\n SUM(CASE WHEN judgment = 4 THEN 1 ELSE 0 END) as judgment4,\n SUM(CASE WHEN judgment = 5 THEN 1 ELSE 0 END) as judgment5\n FROM judgments\n GROUP BY DATE(judged_at)\n )\n SELECT\n dates.date,\n COALESCE(SUM(daily_counts.judgment0) OVER (ORDER BY dates.date), 0) as judgment0,\n COALESCE(SUM(daily_counts.judgment1) OVER (ORDER BY dates.date), 0) as judgment1,\n COALESCE(SUM(daily_counts.judgment2) OVER (ORDER BY dates.date), 0) as judgment2,\n COALESCE(SUM(daily_counts.judgment3) OVER (ORDER BY dates.date), 0) as judgment3,\n COALESCE(SUM(daily_counts.judgment4) OVER (ORDER BY dates.date), 0) as judgment4,\n COALESCE(SUM(daily_counts.judgment5) OVER (ORDER BY dates.date), 0) as judgment5,\n COALESCE(SUM(daily_counts.judgment0 + daily_counts.judgment1 + daily_counts.judgment2 + daily_counts.judgment3 + daily_counts.judgment4 + daily_counts.judgment5) OVER (ORDER BY dates.date), 0) as total\n FROM dates\n LEFT JOIN daily_counts ON dates.date = daily_counts.date\n ORDER BY dates.date\n `);\n\n return new Response(JSON.stringify(timeSeries.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Render HTML\n return new Response(\n `\n \n \n Word Judgment Dashboard\n \n \n \n \n

judgeWordsDash

Version 13