TAG! Multiplayer

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_152":153,"_154":155},"routes/_app.x.$handle.$name",{"_93":92,"_32":44,"_101":83,"_27":102,"_13":14,"_103":-5,"_11":104,"_105":106,"_107":108,"_109":110,"_111":112,"_20":-5,"_113":-5,"_114":-5,"_115":25,"_116":117,"_118":119,"_120":-5,"_121":-5,"_122":123},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_42":43,"_32":44,"_37":45,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":-5,"_52":-5,"_18":53,"_54":-5,"_55":25,"_56":-5,"_57":-5,"_58":59,"_60":61,"_62":-5,"_63":-5,"_64":-5,"_65":-5,"_66":67,"_68":67,"_69":70,"_71":70,"_72":70,"_73":67,"_74":67,"_75":76,"_77":78,"_79":80,"_81":25},"version",9,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":36,"_37":38,"_39":14,"_40":41,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","main.ts","latestPath","fileId","fff39ebe-141b-11f1-96a7-42dde27851f2","name","fileType","http","content","// TAG! Multiplayer — Val Town edition\n// Uses blob storage so rooms survive between requests\n\nimport { blob } from \"https://esm.town/v/std/blob\";\n\nconst COLORS = ['#00e5ff','#ffe600','#ff6cf7','#39ff14','#ff9500','#c77dff','#ff4757','#ffffff'];\nconst WW=800,WH=600,PAD=45,PR=18,TAG_D=PR*2+6,INV_MS=2200;\nconst SPD=3.8,IT_SPD=4.4,DUR=120;\nconst WORDS=['WOLF','HAWK','BEAR','LION','LYNX','CROW','PUMA','BULL','FOX','VIPER'];\n\nfunction genCode(){return WORDS[Math.floor(Math.random()*WORDS.length)]+(10+Math.floor(Math.random()*90));}\nfunction pickColor(room:any){const used=Object.values(room.players).map((p:any)=>p.color);return COLORS.find(c=>!used.includes(c))||'#aaa';}\nfunction uid(){return Math.random().toString(36).slice(2,10);}\n\nasync function getRoom(code:string){\n try{const r=await blob.getJSON('room_'+code);return r||null;}catch{return null;}\n}\nasync function saveRoom(room:any){\n await blob.setJSON('room_'+room.code, room);\n}\nasync function deleteRoom(code:string){\n try{await blob.delete('room_'+code);}catch{}\n}\n\nfunction tickRoom(room:any, ms:number){\n // Advance the game simulation by ms milliseconds\n if(room.phase==='countdown'){\n room.cdMs=(room.cdMs||0)+ms;\n room.countdown=Math.max(0, 3-Math.floor(room.cdMs/1000));\n if(room.cdMs>=3000){\n room.phase='playing';\n room.timer=DUR;\n room.tickedAt=Date.now();\n room.elapsed=0;\n }\n return;\n }\n if(room.phase!=='playing')return;\n const dt=ms/(1000/60);\n // Remove stale players\n const now=Date.now();\n for(const id in room.players){\n if(now-room.players[id].lastSeen>12000)delete room.players[id];\n }\n if(Object.keys(room.players).length===0){room.phase='ended';room.results=[];return;}\n\n // Move players\n for(const id in room.players){\n const p=room.players[id],speed=p.isIt?IT_SPD:SPD;\n let vx=p.inputX||0,vy=p.inputY||0,len=Math.sqrt(vx*vx+vy*vy);\n if(len>1){vx/=len;vy/=len;}\n p.x=Math.max(PR+PAD,Math.min(WW-PR-PAD,p.x+vx*speed*dt));\n p.y=Math.max(PR+PAD,Math.min(WH-PR-PAD,p.y+vy*speed*dt));\n }\n // Tag detection\n const it=Object.values(room.players).find((p:any)=>p.isIt) as any;\n if(it&&now>it.invincibleUntil){\n for(const id in room.players){\n const p=room.players[id] as any;\n if(p.id===it.id||now<(p.invincibleUntil||0))continue;\n const dx=p.x-it.x,dy=p.y-it.y;\n if(Math.sqrt(dx*dx+dy*dy)p.isIt);\n if(!stillHasIt){\n const ids=Object.keys(room.players);\n if(ids.length>0){room.players[ids[0]].isIt=true;room.players[ids[0]].invincibleUntil=now+INV_MS;}\n }\n }\n // Timer\n room.elapsed=(room.elapsed||0)+ms;\n if(room.elapsed>=1000){\n room.elapsed-=1000;\n room.timer--;\n if(room.timer<=0){\n room.phase='ended';\n room.results=Object.values(room.players).sort((a:any,b:any)=>b.score-a.score).map((p:any)=>({id:p.id,name:p.name,color:p.color,score:p.score}));\n }\n }\n}\n\n// ── HTML ──────────────────────────────────────────────────────\nconst HTML=`\n\n\n\n\n\nTAG! Multiplayer\n\n\n\n\n

\n\n

TAG!

Real-time · Multiplayer · Mobile Ready

Your Name

\n \n

Room Code

\n \n

\n\n

Waiting Room

Share the code with friends

Room Code

----

Share this with friends

Players

\n \n

\n\n

Get Ready!

\n\n

IT: —

2:00

— players

YOU ARE IT — TAG SOMEONE!

\n\n

\n\n\n\n`;\n\n// ── Request handler ───────────────────────────────────────────\nexport default async function handler(req: Request): Promise {\n const url = new URL(req.url);\n const action = url.searchParams.get('action');\n\n if (!action) {\n return new Response(HTML, { headers: { 'content-type': 'text/html;charset=utf-8' } });\n }\n\n let body: any = {};\n try { body = await req.json(); } catch {}\n\n if (action === 'create') {\n let code = genCode();\n // make sure code is unique\n for (let i = 0; i < 10; i++) {\n const existing = await getRoom(code);\n if (!existing) break;\n code = genCode();\n }\n const room: any = { code, players: {}, phase: 'lobby', timer: DUR, countdown: 3, cdMs: 0, elapsed: 0, tickedAt: Date.now(), lastTag: null, results: null };\n const color = pickColor(room);\n room.players[body.id] = { id: body.id, name: body.name || 'Player', color, x: WW/2, y: WH/2, inputX: 0, inputY: 0, isIt: false, score: 0, invincibleUntil: 0, isHost: true, lastSeen: Date.now() };\n await saveRoom(room);\n return J({ code, color, players: room.players });\n }\n\n if (action === 'join') {\n const code = body.code?.toUpperCase();\n const room = await getRoom(code);\n if (!room) return J({ error: 'Room not found — check the code!' });\n if (room.phase !== 'lobby') return J({ error: 'Game already started' });\n if (Object.keys(room.players).length >= 8) return J({ error: 'Room is full' });\n const color = pickColor(room);\n room.players[body.id] = { id: body.id, name: body.name || 'Player', color, x: WW/2+(Math.random()-.5)*200, y: WH/2+(Math.random()-.5)*200, inputX: 0, inputY: 0, isIt: false, score: 0, invincibleUntil: 0, isHost: false, lastSeen: Date.now() };\n await saveRoom(room);\n return J({ code, color, players: room.players });\n }\n\n if (action === 'start') {\n const room = await getRoom(body.code);\n if (!room) return J({ error: 'Room not found' });\n if (room.phase !== 'lobby') return J({ error: 'Already started' });\n if (!room.players[body.id]?.isHost) return J({ error: 'Only host can start' });\n if (Object.keys(room.players).length < 2) return J({ error: 'Need at least 2 players!' });\n // Pick IT\n const ids = Object.keys(room.players);\n const itId = ids[Math.floor(Math.random() * ids.length)];\n for (const id in room.players) room.players[id].isIt = false;\n room.players[itId].isIt = true;\n room.players[itId].invincibleUntil = Date.now() + INV_MS;\n ids.forEach((id, i) => { const a=(i/ids.length)*Math.PI*2; room.players[id].x=WW/2+Math.cos(a)*160; room.players[id].y=WH/2+Math.sin(a)*160; room.players[id].score=0; });\n room.phase = 'countdown';\n room.countdown = 3;\n room.cdMs = 0;\n room.tickedAt = Date.now();\n await saveRoom(room);\n return J({ ok: true });\n }\n\n if (action === 'state') {\n const room = await getRoom(body.code);\n if (!room) return J({ error: 'Room not found' });\n // Update this player's lastSeen\n if (room.players[body.id]) room.players[body.id].lastSeen = Date.now();\n // Advance simulation based on time elapsed since last tick\n if (room.phase === 'countdown' || room.phase === 'playing') {\n const now = Date.now();\n const ms = Math.min(now - (room.tickedAt || now), 2000); // cap at 2s\n room.tickedAt = now;\n tickRoom(room, ms);\n await saveRoom(room);\n }\n return J({ phase: room.phase, players: room.players, timer: room.timer, countdown: room.countdown, lastTag: room.lastTag, results: room.results });\n }\n\n if (action === 'input') {\n const room = await getRoom(body.code);\n if (!room || room.phase !== 'playing') return J({ ok: true });\n const p = room.players[body.id];\n if (p) { p.inputX = body.x; p.inputY = body.y; p.lastSeen = Date.now(); }\n await saveRoom(room);\n return J({ ok: true });\n }\n\n if (action === 'restart') {\n const room = await getRoom(body.code);\n if (!room || room.phase !== 'ended') return J({ error: 'Not ended yet' });\n if (!room.players[body.id]?.isHost) return J({ error: 'Only host can restart' });\n room.phase = 'lobby'; room.results = null; room.lastTag = null;\n for (const id in room.players) { room.players[id].score = 0; room.players[id].isIt = false; }\n await saveRoom(room);\n return J({ ok: true, players: room.players });\n }\n\n return J({ error: 'Unknown action' });\n}\n\nfunction J(data: any) {\n return new Response(JSON.stringify(data), { headers: { 'content-type': 'application/json', 'access-control-allow-origin': '*' } });\n}","createdAt",["D",1772224764637],"branchVersion","branchId","fff09c3c-141b-11f1-96a7-42dde27851f2","id","fff02a72-141b-11f1-96a7-42dde27851f2","untitled-3357",["D",1772224591574],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","019ca087-498a-778f-a6ff-f903af6eea80","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","019ca087-498a-778f-a6ff-feed8f31f20f","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_93":92,"_100":96},"org",{"_93":92,"_94":-5,"_95":96,"_18":53,"_97":98,"_99":25},"branch",{"_13":82,"_32":83,"_42":41,"_84":43,"_85":-5,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":44,"_91":92},"isOwned",12,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","peopleeattoes","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzNBR1hCOENsY2tMa05FY25HdmpiZUtOckhxdSJ9","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_42":43,"_32":44,"_37":148,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":-5,"_52":-5,"_18":53,"_54":-5,"_55":25,"_56":-5,"_57":-5,"_58":59,"_60":61,"_62":-5,"_63":-5,"_64":-5,"_65":-5,"_66":67,"_68":67,"_69":70,"_71":70,"_72":70,"_73":67,"_74":67,"_75":149,"_77":150,"_79":151,"_81":25},"tree",[143],"files",[143],"counts",{"_132":59,"_133":134,"_135":59,"_136":137,"_138":139},"contents",[124],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_42":125,"_32":28,"_30":31,"_126":-5,"_40":41,"_39":14,"_127":25,"_37":128,"_13":129,"_33":34,"_35":36,"_24":25,"_130":-5,"_27":131},"67183a00-141c-11f1-ac78-42dde27851f2","parentId","latest",["D",1772224764637],8,"label",[28],"pulls","branches",1,"forks","envVars",{"_140":59,"_142":59},"connections",{"_140":59,"_141":59},"count","unfilledCount","emptyCount",{"_42":125,"_32":28,"_30":31,"_126":-5,"_40":41,"_39":14,"_127":25,"_37":144,"_13":129,"_33":34,"_35":36,"_24":25,"_130":-5,"_145":146,"_27":147},["D",1772224764637],"children",[],[28],["D",1772224591574],{"_93":92,"_100":96},{"_93":92,"_94":-5,"_95":96,"_18":53,"_97":98,"_99":25},{"_13":82,"_32":83,"_42":41,"_84":43,"_85":-5,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":44,"_91":92},"ctx",{"_75":-5,"_121":185,"_186":187,"_188":189,"_190":25,"_191":25,"_192":25,"_193":119,"_194":-5,"_195":-7,"_196":-7,"_197":59,"_198":25,"_199":25,"_200":-5,"_201":25,"_202":25,"_203":25,"_204":-5},"ENV",{"_156":157,"_158":159,"_160":83,"_161":162,"_163":164,"_165":166,"_167":168,"_169":170,"_171":172,"_173":174,"_175":176,"_177":178,"_179":180,"_181":182,"_183":184},"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"]

Diff · v9