[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_194":195,"_196":197},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_70":140,"_40":-7,"_141":-5,"_17":142,"_143":144,"_145":146,"_147":148,"_149":150,"_99":-5,"_151":152,"_153":154,"_155":49,"_156":157,"_158":26,"_159":-5,"_160":-5,"_161":162},"routes/_app.x.$handle.$name.compare.$branch",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":26,"_27":28,"_29":30,"_31":-5},"handle","andreterron","name","graffitiWebsite","branchName","main","project",{"_32":58,"_13":14,"_34":103,"_47":-5,"_104":26,"_50":51,"_105":51,"_106":-5,"_107":-5,"_108":109,"_110":77,"_111":26,"_112":-5,"_113":-5,"_114":44,"_53":54,"_115":-5,"_116":-5,"_117":-5,"_118":-5,"_119":120,"_121":120,"_122":123,"_124":123,"_125":123,"_126":120,"_127":120,"_128":129,"_130":131,"_132":28,"_48":49},"ahead",30,"behind",48,"diff",{"_62":63,"_64":65,"_66":67},"hasChanges",true,"sourceBranch",{"_40":20,"_13":16,"_32":57,"_38":58,"_41":33,"_43":44,"_59":51,"_60":39,"_61":54,"_55":14,"_52":12},"targetBranch",{"_32":33,"_34":35,"_36":37,"_13":16,"_38":39,"_40":22,"_41":42,"_43":44,"_45":46,"_47":-5,"_48":49,"_50":51,"_52":12,"_53":54,"_55":56},"pull","id","0989cb34-27b3-11f0-aecd-569c3dd06744","createdAt",["D",1746231036110],"updatedAt",["D",1725480515616],"projectId","09898d22-27b3-11f0-aecd-569c3dd06744","version","forkedBranchId","eac96080-250d-11f0-acaf-569c3dd06744","forkedBranchVersion",0,"lockfileKey","1746243257013-esm.town_v_andreterron_genval@48-main","deletedAt","isOwned",false,"privacy","public","userHandle","orgId","e3e17235-151f-4b9a-87b3-8c6b339f259e","projectName","genval","3382e3da-27b3-11f0-aecd-569c3dd06744","3382a2d0-27b3-11f0-aecd-569c3dd06744","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","added",[68,69],"deleted",[],"modified",[],{"_70":93,"_72":-7,"_73":94},{"_70":71,"_72":-7,"_73":74},"path","main.tsx","targetFile","sourceFile",{"_32":75,"_13":71,"_76":77,"_78":-5,"_79":57,"_80":20,"_81":26,"_34":82,"_40":83,"_84":85,"_86":87,"_64":49,"_88":-5,"_89":-7,"_70":90,"_91":92},"34070566-27b3-11f0-aecd-569c3dd06744","fileId","3385e7ba-27b3-11f0-aecd-569c3dd06744","parentId","branchId","branchVersion","latest",["D",1698082250000],29,"fileType","http","content","import { runVal } from \"https://esm.town/v/std/runVal\";\n\nexport let graffitiWebsite = async (req: express.Request, res: express.Response) => {\n const { default: htm } = await import(\"npm:htm\");\n const { default: vhtml } = await import(\"npm:vhtml\");\n const html = htm.bind(vhtml);\n const head = html`\n Graffiti Wall\n \n \n \n \n `;\n const formClass =\n \"p-2 pt-16 group min-h-screen animate-all bg-emerald-50 w-full max-w-2xl mx-auto\";\n const inputClass = \"p-2 border rounded w-full\";\n const labelClass = \"w-full flex flex-col gap-2\";\n const inputNameClass = \"pl-0.5 text-sm font-bold uppercase text-emerald-800\";\n const inputDescriptionClass = \"pl-0.5 text-xs text-emerald-700\";\n if (req.method === \"POST\") {\n const value = req.body;\n if (\n !(\"x\" in value) ||\n !value.x ||\n !(\"y\" in value) ||\n !value.y ||\n !(\"color\" in value) ||\n !value.color\n ) {\n return res.end(\"Bad input\");\n }\n await runVal(\n \"andreterron.paintGraffitiPixel\",\n value.x,\n value.y,\n value.color,\n );\n await new Promise((resolve) => setTimeout(() => resolve(), 150));\n }\n const code = `await api(\n @andreterron.paintGraffitiPixel,\n ${Math.min(Math.floor(Math.random() * 64), 64)}, // x\n ${Math.min(Math.floor(Math.random() * 32), 32)}, // y\n \"#ffffff\", // color\n);`;\n const query = new URLSearchParams({ code });\n const url = `https://www.val.town/embed/new?${query.toString()}`;\n return res.end(html`\n ${head}\n \n

\n Graffiti Wall\n

\n \n X\n 0 ≤ x ${\"<\"} 64\n \n \n \n Y\n 0 ≤ y ${\"<\"} 32\n \n \n \n Color\n \"#ff0000\" or \"rgb(255,0,0)\"\n \n \n \n

\n or\n

\n \n Create a val\n reload the page after running the code\n \n

Compare

MergegraffitiWebsite/mainintogenval/main

README.md+1-0

Hmain.tsx+89-0