Canvas

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_222":223,"_224":225},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_18":19,"_17":-7,"_165":-5,"_20":166,"_22":167,"_168":169,"_170":171,"_25":172,"_24":-5,"_173":174,"_175":176,"_177":50,"_178":179,"_180":73,"_181":-5,"_182":-5,"_183":184},"routes/_app.x.$handle.$name.branch.$branch.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":-7,"_25":26,"_27":28,"_29":-5,"_30":31,"_32":33,"_34":-5},"handle","zakattack3289","name","graphics-demo","branchName","main","version","path","","project",{"_35":121,"_13":14,"_37":122,"_48":-5,"_123":50,"_51":52,"_124":52,"_125":126,"_127":-5,"_128":129,"_130":92,"_131":73,"_132":-5,"_133":-5,"_134":33,"_55":135,"_136":-5,"_137":-5,"_138":-5,"_139":-5,"_140":141,"_142":141,"_143":144,"_145":144,"_146":144,"_147":141,"_148":141,"_149":150,"_151":152,"_153":154,"_49":50},"tree",[104,105,106,107],"file","contents",[59,60,61,62],"upstream",{"_35":36,"_37":38,"_39":40,"_13":16,"_41":42,"_17":43,"_44":-5,"_45":-5,"_46":47,"_48":-5,"_49":50,"_51":52,"_53":54,"_55":56,"_57":58},"pull","ahead",5,"behind",0,"envVars","id","70f419a8-ea65-11f0-9dd5-42dde27851f2","createdAt",["D",1767638185506],"updatedAt",["D",1773840962156],"projectId","70ea5fe4-ea65-11f0-9dd5-42dde27851f2",230,"forkedBranchId","forkedBranchVersion","lockfileKey","1773840990063-esm.town_v_ceculbe_html-css-js-template@230-main","deletedAt","isOwned",false,"privacy","public","userHandle","ceculbe","orgId","019b8c31-c867-72d0-a0f3-3af4d1c41815","projectName","html-css-js-template",{"_35":97,"_13":98,"_65":99,"_67":-5,"_68":69,"_70":86,"_72":73,"_37":100,"_17":101,"_75":24,"_76":102,"_78":50,"_79":-5,"_18":103},{"_35":90,"_13":91,"_65":92,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":93,"_17":33,"_75":94,"_76":95,"_78":50,"_79":-5,"_18":96},{"_35":81,"_13":82,"_65":83,"_67":-5,"_68":69,"_70":84,"_72":73,"_37":85,"_17":86,"_75":87,"_76":88,"_78":50,"_79":-5,"_18":89},{"_35":63,"_13":64,"_65":66,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":74,"_17":33,"_75":24,"_76":77,"_78":50,"_79":-5,"_18":80},"ffec0742-29e4-11f1-afd5-42dde27851f2","style.css","fileId","019d2f96-a40c-733f-be78-548c95ecf67c","parentId","branchId","ffe70418-29e4-11f1-afd5-42dde27851f2","branchVersion",1,"latest",true,["D",1774619894649],"fileType","content","* {\n box-sizing: border-box;\n}","deleted","label",[64],"1fafe140-29e8-11f1-98f7-42dde27851f2","script.js","019d2f96-a40c-733f-be78-51c9bb1cd4ac",6,["D",1774621236559],3,"script","const canvas = document.getElementById(\"myCanvas\") as HTMLCanvasElement\nconst ctx= canvas.getContext(\"2d\");\n\nctx.fillStyle = \"#001144\";\nctx.fillRect(50, 40, 200, 100);\nctx.fillRect(50, 40, 200, 100);\n\nctx.strokeStyle = \"red\";\nctx.beginPath();\nctx.moveTo(50, 40);\nctx.lineTo(100, 120);\n\nctx.moveTo(50, 40);\nctx.lineTo(75, 120);\nctx.lineTo(50, 120);\nctx.lineTo(25, 120);\nctx.stroke();",[82],"ffec009e-29e4-11f1-afd5-42dde27851f2","main.ts","019d2f96-a40c-733f-be78-4f0da6e013a6",["D",1774619894649],"http","import { staticHTTPServer } from \"https://esm.town/v/std/utils/index.ts\";\nexport default staticHTTPServer(import.meta.url);",[91],"da8f0b9c-29e5-11f1-b19e-42dde27851f2","index.html","019d2f96-a40c-733f-be78-49de5ad3c02a",["D",1774620261610],2,"\n\n \n Canvas\n \n \n \n \n \n \n

\n \n",[98],{"_35":97,"_13":98,"_65":99,"_67":-5,"_68":69,"_70":86,"_72":73,"_37":118,"_17":101,"_75":24,"_76":102,"_78":50,"_79":-5,"_109":119,"_18":120},{"_35":90,"_13":91,"_65":92,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":115,"_17":33,"_75":94,"_76":95,"_78":50,"_79":-5,"_109":116,"_18":117},{"_35":81,"_13":82,"_65":83,"_67":-5,"_68":69,"_70":84,"_72":73,"_37":112,"_17":86,"_75":87,"_76":88,"_78":50,"_79":-5,"_109":113,"_18":114},{"_35":63,"_13":64,"_65":66,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":108,"_17":33,"_75":24,"_76":77,"_78":50,"_79":-5,"_109":110,"_18":111},["D",1774619894649],"children",[],[64],["D",1774621236559],[],[82],["D",1774619894649],[],[91],["D",1774620261610],[],[98],"ffde1196-29e4-11f1-afd5-42dde27851f2",["D",1774619894649],"legacyEnvVars","httpPrivacy","description","Template for a basic HTML + CSS + JavaScript static website","imageUrl","userId","019b8ed8-ddf9-70cb-ad0a-074c87731d15","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","019b8ed8-ddf9-70cb-ad0a-095617756859","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_164":160},"org",{"_11":12,"_158":-5,"_159":160,"_128":129,"_161":162,"_163":50},"branch",{"_17":84,"_13":16,"_35":69,"_41":121,"_44":36,"_45":43,"_155":52,"_156":42,"_157":56,"_57":14,"_53":12},"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18zN3FRTmdsd21LZkJwMzhQT2V4dWNyVlE0a28ifQ","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_35":121,"_13":14,"_37":218,"_48":-5,"_123":50,"_51":52,"_124":52,"_125":126,"_127":-5,"_128":129,"_130":92,"_131":73,"_132":-5,"_133":-5,"_134":33,"_55":135,"_136":-5,"_137":-5,"_138":-5,"_139":-5,"_140":141,"_142":141,"_143":144,"_145":144,"_146":144,"_147":141,"_148":141,"_149":219,"_151":220,"_153":221,"_49":50},[206,207,208,209],"files",[206,207,208,209],"counts",{"_197":33,"_198":71,"_199":33,"_34":200,"_201":202},[189,190,191,192],"upstreamProject",{"_35":42,"_13":58,"_125":126,"_127":-5,"_51":52,"_149":187},"upstreamBranch",{"_35":36,"_37":185,"_39":186,"_13":16,"_41":42,"_17":43,"_44":-5,"_45":-5,"_46":47,"_48":-5,"_49":50,"_51":52,"_53":54,"_55":56,"_57":58},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1767638185506],["D",1773840962156],{"_11":54,"_164":188},"https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18zN294dm1HMFFyZ0NhbWJUNmpBeEN3U0s1QWgifQ",{"_35":97,"_13":98,"_65":99,"_67":-5,"_68":69,"_70":86,"_72":73,"_37":100,"_17":101,"_75":24,"_76":102,"_78":50,"_79":-5,"_18":196},{"_35":90,"_13":91,"_65":92,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":93,"_17":33,"_75":94,"_76":95,"_78":50,"_79":-5,"_18":195},{"_35":81,"_13":82,"_65":83,"_67":-5,"_68":69,"_70":84,"_72":73,"_37":85,"_17":86,"_75":87,"_76":88,"_78":50,"_79":-5,"_18":194},{"_35":63,"_13":64,"_65":66,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":74,"_17":33,"_75":24,"_76":77,"_78":50,"_79":-5,"_18":193},[64],[82],[91],[98],"pulls","branches","forks",{"_203":33,"_205":33},"connections",{"_203":33,"_204":33},"count","unfilledCount","emptyCount",{"_35":97,"_13":98,"_65":99,"_67":-5,"_68":69,"_70":86,"_72":73,"_37":118,"_17":101,"_75":24,"_76":102,"_78":50,"_79":-5,"_109":216,"_18":217},{"_35":90,"_13":91,"_65":92,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":115,"_17":33,"_75":94,"_76":95,"_78":50,"_79":-5,"_109":214,"_18":215},{"_35":81,"_13":82,"_65":83,"_67":-5,"_68":69,"_70":84,"_72":73,"_37":112,"_17":86,"_75":87,"_76":88,"_78":50,"_79":-5,"_109":212,"_18":213},{"_35":63,"_13":64,"_65":66,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":108,"_17":33,"_75":24,"_76":77,"_78":50,"_79":-5,"_109":210,"_18":211},[],[64],[],[82],[],[91],[],[98],["D",1774619894649],{"_11":12,"_164":160},{"_11":12,"_158":-5,"_159":160,"_128":129,"_161":162,"_163":50},{"_17":84,"_13":16,"_35":69,"_41":121,"_44":36,"_45":43,"_155":52,"_156":42,"_157":56,"_57":14,"_53":12},"ctx",{"_149":-5,"_182":255,"_256":257,"_258":259,"_260":50,"_261":50,"_262":50,"_263":73,"_264":-5,"_265":-7,"_266":-7,"_267":33,"_268":50,"_269":50,"_270":-5,"_271":50,"_272":50,"_273":50,"_274":-5},"ENV",{"_226":227,"_228":229,"_230":16,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242,"_243":244,"_245":246,"_247":248,"_249":250,"_251":252,"_253":254},"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",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Code