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",{"_11":12,"_13":14,"_15":16,"_18":19,"_17":-7,"_115":-5,"_20":116,"_22":117,"_118":119,"_120":121,"_25":122,"_24":-5,"_123":-5,"_124":-5,"_125":53,"_126":127,"_128":44,"_129":-5,"_130":-5,"_131":132},"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":-5,"_28":-5,"_29":-5,"_30":-5,"_31":-5},"handle","peopleeattoes","name","untitled-2420","branchName","main","version","path","","project",{"_33":61,"_13":14,"_45":62,"_63":-5,"_64":53,"_65":66,"_67":66,"_68":-5,"_69":-5,"_70":71,"_72":-5,"_73":53,"_74":-5,"_75":-5,"_76":77,"_78":79,"_80":-5,"_81":-5,"_82":-5,"_83":-5,"_84":85,"_86":85,"_87":88,"_89":88,"_90":88,"_91":85,"_92":85,"_93":94,"_95":96,"_97":98,"_99":53},"tree",[56],"file","contents",[32],"upstream","pull","ahead","behind","envVars",{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":46,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_18":55},"id","32c75628-1412-11f1-8834-42dde27851f2","main.ts","fileId","c7b8a88c-1411-11f1-85dd-42dde27851f2","parentId","branchId","c7b548c2-1411-11f1-85dd-42dde27851f2","branchVersion",5,"latest",true,"createdAt",["D",1772220381889],4,"fileType","http","content","import { serve } from \"https://deno.land/std@0.208.0/http/server.ts\";\n\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 below

Room Code

----

Share with friends to play together

Players

\n \n

\n\n

Get Ready!

\n\n

IT: —

2:00

— players

\n \n

\n\n

\n\n\n\n`;\n\n// Game state\nconst rooms: Record = {};\nconst socketToRoom = new Map();\n\nconst GAME_DURATION = 120;\nconst TICK_MS = 50;\nconst PLAYER_SPEED = 3.8;\nconst IT_SPEED = 4.4;\nconst PLAYER_R = 18;\nconst TAG_DIST = PLAYER_R * 2 + 6;\nconst INVINCIBLE_MS = 2200;\nconst ARENA_PAD = 45;\nconst WORLD_W = 800;\nconst WORLD_H = 600;\nconst COLORS = [\n \"#00e5ff\",\n \"#ffe600\",\n \"#ff6cf7\",\n \"#39ff14\",\n \"#ff9500\",\n \"#c77dff\",\n \"#ff4757\",\n \"#ffffff\",\n];\n\nfunction genCode() {\n const w = [\n \"WOLF\",\n \"HAWK\",\n \"BEAR\",\n \"LION\",\n \"LYNX\",\n \"CROW\",\n \"PUMA\",\n \"BULL\",\n \"VIPER\",\n \"FOX\",\n ];\n return w[Math.floor(Math.random() * w.length)] +\n (10 + Math.floor(Math.random() * 90));\n}\nfunction pickColor(room: any) {\n const used = Object.values(room.players).map((p: any) => p.color);\n return COLORS.find((c) => !used.includes(c)) || \"#aaa\";\n}\nfunction bcast(room: any, data: any, exceptId?: string) {\n const msg = JSON.stringify(data);\n for (const id in room.sockets) {\n if (id === exceptId) continue;\n try {\n room.sockets[id].send(msg);\n } catch (e) {}\n }\n}\nfunction sendState(room: any) {\n bcast(room, {\n type: \"STATE\",\n players: room.players,\n phase: room.phase,\n timer: room.timer,\n });\n}\n\nfunction startGame(room: any) {\n room.phase = \"countdown\";\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() + INVINCIBLE_MS;\n ids.forEach((id, i) => {\n const angle = (i / ids.length) * Math.PI * 2;\n room.players[id].x = WORLD_W / 2 + Math.cos(angle) * 160;\n room.players[id].y = WORLD_H / 2 + Math.sin(angle) * 160;\n room.players[id].vx = room.players[id].vy = 0;\n room.players[id].score = 0;\n });\n let cd = 3;\n bcast(room, { type: \"COUNTDOWN\", val: cd });\n const cdIv = setInterval(() => {\n cd--;\n if (cd <= 0) {\n clearInterval(cdIv);\n room.phase = \"playing\";\n room.timer = GAME_DURATION;\n bcast(room, { type: \"COUNTDOWN\", val: 0 });\n let elapsed = 0;\n room.tickIv = setInterval(() => {\n elapsed += TICK_MS;\n if (elapsed >= 1000) {\n elapsed -= 1000;\n room.timer--;\n if (room.timer <= 0) {\n endGame(room);\n return;\n }\n }\n gameTick(room);\n sendState(room);\n }, TICK_MS);\n sendState(room);\n } else {\n bcast(room, { type: \"COUNTDOWN\", val: cd });\n }\n }, 1000);\n}\n\nfunction gameTick(room: any) {\n const now = Date.now();\n const dt = TICK_MS / (1000 / 60);\n for (const id in room.players) {\n const p = room.players[id];\n const speed = p.isIt ? IT_SPEED : PLAYER_SPEED;\n let vx = p.inputX || 0, vy = p.inputY || 0;\n const len = Math.sqrt(vx * vx + vy * vy);\n if (len > 1) {\n vx /= len;\n vy /= len;\n }\n p.x = Math.max(\n PLAYER_R + ARENA_PAD,\n Math.min(WORLD_W - PLAYER_R - ARENA_PAD, p.x + vx * speed * dt),\n );\n p.y = Math.max(\n PLAYER_R + ARENA_PAD,\n Math.min(WORLD_H - PLAYER_R - ARENA_PAD, p.y + vy * speed * dt),\n );\n }\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];\n if (p.id === it.id || now < p.invincibleUntil) continue;\n const dx = p.x - it.x, dy = p.y - it.y;\n if (Math.sqrt(dx * dx + dy * dy) < TAG_DIST) {\n it.score++;\n it.isIt = false;\n p.isIt = true;\n p.invincibleUntil = now + INVINCIBLE_MS;\n bcast(room, { type: \"TAG\", taggerId: it.id, taggedId: p.id });\n break;\n }\n }\n }\n}\n\nfunction endGame(room: any) {\n if (room.tickIv) {\n clearInterval(room.tickIv);\n room.tickIv = null;\n }\n room.phase = \"ended\";\n const results = Object.values(room.players)\n .sort((a: any, b: any) => b.score - a.score)\n .map((p: any) => ({\n id: p.id,\n name: p.name,\n color: p.color,\n score: p.score,\n }));\n bcast(room, { type: \"GAMEOVER\", results });\n}\n\nfunction removePlayer(room: any, playerId: string) {\n delete room.players[playerId];\n delete room.sockets[playerId];\n if (Object.keys(room.players).length === 0) {\n if (room.tickIv) clearInterval(room.tickIv);\n delete rooms[room.code];\n return;\n }\n if (room.phase === \"playing\") {\n const hasIt = Object.values(room.players).some((p: any) => p.isIt);\n if (!hasIt) {\n const ids = Object.keys(room.players);\n room.players[ids[0]].isIt = true;\n room.players[ids[0]].invincibleUntil = Date.now() + INVINCIBLE_MS;\n }\n }\n bcast(room, { type: \"PLAYER_LEFT\", id: playerId, players: room.players });\n}\n\nfunction handleMsg(ws: WebSocket, msg: any) {\n if (msg.type === \"CREATE\") {\n let code = genCode();\n while (rooms[code]) code = genCode();\n const room = {\n code,\n players: {},\n sockets: {},\n phase: \"lobby\",\n timer: GAME_DURATION,\n tickIv: null,\n };\n rooms[code] = room;\n const color = pickColor(room);\n const player = {\n id: msg.id,\n name: msg.name,\n color,\n x: WORLD_W / 2,\n y: WORLD_H / 2,\n vx: 0,\n vy: 0,\n inputX: 0,\n inputY: 0,\n isIt: false,\n score: 0,\n invincibleUntil: 0,\n isHost: true,\n };\n room.players[msg.id] = player;\n room.sockets[msg.id] = ws;\n socketToRoom.set(ws, { code, playerId: msg.id });\n ws.send(\n JSON.stringify({ type: \"CREATED\", code, player, players: room.players }),\n );\n } else if (msg.type === \"JOIN\") {\n const room = rooms[msg.code?.toUpperCase()];\n if (!room) {\n ws.send(JSON.stringify({ type: \"ERROR\", msg: \"Room not found\" }));\n return;\n }\n if (room.phase !== \"lobby\") {\n ws.send(JSON.stringify({ type: \"ERROR\", msg: \"Game already started\" }));\n return;\n }\n if (Object.keys(room.players).length >= 8) {\n ws.send(JSON.stringify({ type: \"ERROR\", msg: \"Room is full\" }));\n return;\n }\n const color = pickColor(room);\n const player = {\n id: msg.id,\n name: msg.name,\n color,\n x: WORLD_W / 2 + (Math.random() - .5) * 200,\n y: WORLD_H / 2 + (Math.random() - .5) * 200,\n vx: 0,\n vy: 0,\n inputX: 0,\n inputY: 0,\n isIt: false,\n score: 0,\n invincibleUntil: 0,\n isHost: false,\n };\n room.players[msg.id] = player;\n room.sockets[msg.id] = ws;\n socketToRoom.set(ws, { code: msg.code.toUpperCase(), playerId: msg.id });\n ws.send(\n JSON.stringify({\n type: \"JOINED\",\n code: msg.code.toUpperCase(),\n player,\n players: room.players,\n }),\n );\n bcast(\n room,\n { type: \"PLAYER_JOINED\", player, players: room.players },\n msg.id,\n );\n } else if (msg.type === \"START\") {\n const info = socketToRoom.get(ws);\n if (!info) return;\n const room = rooms[info.code];\n if (!room || room.phase !== \"lobby\") return;\n if (!room.players[info.playerId]?.isHost) return;\n if (Object.keys(room.players).length < 2) {\n ws.send(\n JSON.stringify({ type: \"ERROR\", msg: \"Need at least 2 players!\" }),\n );\n return;\n }\n startGame(room);\n } else if (msg.type === \"INPUT\") {\n const info = socketToRoom.get(ws);\n if (!info) return;\n const room = rooms[info.code];\n if (!room || room.phase !== \"playing\") return;\n const p = room.players[info.playerId];\n if (p) {\n p.inputX = msg.x;\n p.inputY = msg.y;\n }\n } else if (msg.type === \"RESTART\") {\n const info = socketToRoom.get(ws);\n if (!info) return;\n const room = rooms[info.code];\n if (!room || room.phase !== \"ended\") return;\n if (!room.players[info.playerId]?.isHost) return;\n room.phase = \"lobby\";\n for (const id in room.players) {\n room.players[id].score = 0;\n room.players[id].isIt = false;\n }\n bcast(room, { type: \"RESTART\", players: room.players });\n }\n}\n\nserve((req) => {\n const upgrade = req.headers.get(\"upgrade\") || \"\";\n if (upgrade.toLowerCase() === \"websocket\") {\n const { socket, response } = Deno.upgradeWebSocket(req);\n socket.onmessage = (e) => {\n try {\n handleMsg(socket, JSON.parse(e.data));\n } catch (err) {}\n };\n socket.onclose = () => {\n const info = socketToRoom.get(socket);\n if (!info) return;\n socketToRoom.delete(socket);\n const room = rooms[info.code];\n if (room) removePlayer(room, info.playerId);\n };\n return response;\n }\n return new Response(HTML, {\n headers: { \"content-type\": \"text/html; charset=utf-8\" },\n });\n});","deleted",false,"label",[35],{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":57,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_58":59,"_18":60},["D",1772220381889],"children",[],[35],"c7b4d2f2-1411-11f1-85dd-42dde27851f2",["D",1772220202265],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","userId","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",{"_11":12,"_114":110},"org",{"_11":12,"_108":-5,"_109":110,"_70":71,"_111":112,"_113":53},"branch",{"_17":42,"_13":16,"_33":40,"_100":61,"_101":-5,"_102":-5,"_103":-5,"_104":-5,"_105":-5,"_106":14,"_107":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzNBR1hCOENsY2tMa05FY25HdmpiZUtOckhxdSJ9","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_33":61,"_13":14,"_45":148,"_63":-5,"_64":53,"_65":66,"_67":66,"_68":-5,"_69":-5,"_70":71,"_72":-5,"_73":53,"_74":-5,"_75":-5,"_76":77,"_78":79,"_80":-5,"_81":-5,"_82":-5,"_83":-5,"_84":85,"_86":85,"_87":88,"_89":88,"_90":88,"_91":85,"_92":85,"_93":149,"_95":150,"_97":151,"_99":53},[145],"files",[145],"counts",{"_135":77,"_136":137,"_138":77,"_31":139,"_140":141},[133],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":46,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_18":134},[35],"pulls","branches",1,"forks",{"_142":77,"_144":77},"connections",{"_142":77,"_143":77},"count","unfilledCount","emptyCount",{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":57,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_58":146,"_18":147},[],[35],["D",1772220202265],{"_11":12,"_114":110},{"_11":12,"_108":-5,"_109":110,"_70":71,"_111":112,"_113":53},{"_17":42,"_13":16,"_33":40,"_100":61,"_101":-5,"_102":-5,"_103":-5,"_104":-5,"_105":-5,"_106":14,"_107":12},"ctx",{"_93":-5,"_130":185,"_186":187,"_188":189,"_190":53,"_191":53,"_192":53,"_193":44,"_194":-5,"_195":-7,"_196":-7,"_197":77,"_198":53,"_199":53,"_200":-5,"_201":53,"_202":53,"_203":53,"_204":-5},"ENV",{"_156":157,"_158":159,"_160":16,"_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"]