\n\n

GALAXIAN

PRESS START

← → / A D MOVE

SPACE FIRE

\n \n

HI-SCORE 0

\n\n

GAME OVER

SCORE 0

HI-SCORE 0

\n \n

\n\n \n

\n \n \n \n

\n\n view source\n\n \n \n\n",[162],"fccf64d9-a55e-4407-afde-c9bc3538bf44","favicon.svg","019eaf6f-9553-76bf-ba64-9002f246cfb1",2,["D",1781059806046],"\n",[169],"84fcf86e-708a-46d6-9989-9bb220e65823","README.md","019eaf6f-9553-76bf-ba64-8c55f05eb563",["D",1781059970764],"# 👾 GALAXIAN\n\nA Galaxian-style arcade space shooter, built with vanilla JS + HTML Canvas on\nVal Town. Aliens hold a swaying formation, then peel off and dive-bomb your ship\nin classic Galaxian fashion. Pure procedural pixel-art sprites and synthesized\nWebAudio sound — no external image or audio assets.\n\n## How to play\n\n| Input | Action |\n| --- | --- |\n| `←` `→` or `A` `D` | Move ship |\n| `Space` (or `↑` / `W`) | Fire |\n| On-screen buttons | Touch / mobile controls |\n\n- Shoot aliens for points. **Aliens shot while diving are worth double.**\n- Clear all aliens to advance to the next level (dives get faster each level).\n- You start with **3 lives** and earn a bonus life at 5,000 points, then every\n 8,000 after. High score is saved in your browser.\n\n## Scoring\n\n| Alien | Color | Points |\n| --- | --- | --- |\n| Flagship | 🟡 yellow | 60 |\n| Escort | 🔵 cyan | 40 |\n| Grunt | 🔴 red | 20 |\n\n(Double when hit mid-dive.)\n\n## Architecture\n\n```mermaid\nflowchart TD\n H[index.html] --> M[game/main.js
game loop + state]\n M --> E[entities.js
Player / Alien / Bullet / Explosion]\n M --> S[sprites.js
pixel-art grids]\n M --> SF[starfield.js
parallax stars]\n M --> A[audio.js
WebAudio sfx]\n M --> I[input.js
keyboard + touch]\n E --> S\n T[main.tsx] -. serves static files .-> H\n```\n\n- **`main.tsx`** — HTTP entrypoint; serves the static files and a `/source` redirect.\n- **`game/main.js`** — game loop, state machine (menu → playing → dying → game over), formation + dive scheduling, collisions, scoring.\n- **`game/entities.js`** — `Player`, `Alien` (formation / diving / returning states with bezier dive paths), `Bullet`, `Explosion`.\n- **`game/sprites.js`** — all sprites drawn from small character grids, no images.\n- **`game/starfield.js`** — three-layer parallax starfield.\n- **`game/audio.js`** — synthesized arcade sound effects.\n- **`game/input.js`** — keyboard and on-screen touch controls.\n\nBuilt on the [`basic-html-starter`](https://www.val.town/x/templates/basic-html-starter) template.\n",[176],"6f442e9e-eda8-4f6e-8ff8-be4264e47f36","game","6914c4dc-ca5a-411b-9371-867d828a93f9",5,["D",1781059845842],"directory",[182],"pulls","branches","forks","envVars",{"_195":43,"_197":43},"connections",{"_195":43,"_196":43},"count","unfilledCount","emptyCount",{"_18":181,"_20":182,"_132":183,"_134":-5,"_135":69,"_136":184,"_138":39,"_22":278,"_66":43,"_141":186,"_142":-5,"_144":26,"_145":-5,"_212":279,"_90":280},{"_18":270,"_20":271,"_132":272,"_134":183,"_135":69,"_136":273,"_138":39,"_22":274,"_66":43,"_141":151,"_142":275,"_144":26,"_145":-5,"_212":276,"_90":277},{"_18":262,"_20":263,"_132":264,"_134":183,"_135":69,"_136":265,"_138":39,"_22":266,"_66":43,"_141":151,"_142":267,"_144":26,"_145":-5,"_212":268,"_90":269},{"_18":254,"_20":255,"_132":256,"_134":183,"_135":69,"_136":257,"_138":39,"_22":258,"_66":43,"_141":151,"_142":259,"_144":26,"_145":-5,"_212":260,"_90":261},{"_18":246,"_20":247,"_132":248,"_134":183,"_135":69,"_136":249,"_138":39,"_22":250,"_66":43,"_141":151,"_142":251,"_144":26,"_145":-5,"_212":252,"_90":253},{"_18":238,"_20":239,"_132":240,"_134":183,"_135":69,"_136":241,"_138":39,"_22":242,"_66":140,"_141":151,"_142":243,"_144":26,"_145":-5,"_212":244,"_90":245},{"_18":230,"_20":231,"_132":232,"_134":183,"_135":69,"_136":233,"_138":39,"_22":234,"_66":43,"_141":151,"_142":235,"_144":26,"_145":-5,"_212":236,"_90":237},{"_18":175,"_20":176,"_132":177,"_134":-5,"_135":69,"_136":67,"_138":39,"_22":227,"_66":140,"_141":100,"_142":179,"_144":26,"_145":-5,"_212":228,"_90":229},{"_18":168,"_20":169,"_132":170,"_134":-5,"_135":69,"_136":171,"_138":39,"_22":224,"_66":140,"_141":100,"_142":173,"_144":26,"_145":-5,"_212":225,"_90":226},{"_18":161,"_20":162,"_132":163,"_134":-5,"_135":69,"_136":164,"_138":39,"_22":221,"_66":140,"_141":100,"_142":166,"_144":26,"_145":-5,"_212":222,"_90":223},{"_18":154,"_20":155,"_132":37,"_134":-5,"_135":69,"_136":156,"_138":39,"_22":218,"_66":140,"_141":158,"_142":159,"_144":26,"_145":-5,"_212":219,"_90":220},{"_18":147,"_20":148,"_132":149,"_134":-5,"_135":69,"_136":140,"_138":39,"_22":215,"_66":43,"_141":151,"_142":152,"_144":26,"_145":-5,"_212":216,"_90":217},{"_18":130,"_20":131,"_132":133,"_134":-5,"_135":69,"_136":137,"_138":39,"_22":211,"_66":140,"_141":100,"_142":143,"_144":26,"_145":-5,"_212":213,"_90":214},["D",1781059827033],"children",[],[131],["D",1781059785998],[],[148],["D",1781059950237],[],[155],["D",1781059815002],[],[162],["D",1781059806046],[],[169],["D",1781059970764],[],[176],"eab1db75-183b-40ee-8d36-d17108bb74ca","starfield.js","38bbd878-6477-11f1-a5ee-1607ee4eb77e",8,["D",1781059864084],"// Parallax scrolling starfield background.\nexport class Starfield {\n constructor(width, height, count = 90) {\n this.w = width;\n this.h = height;\n this.stars = [];\n for (let i = 0; i < count; i++) {\n const layer = Math.floor(Math.random() * 3); // 0 = far, 2 = near\n this.stars.push({\n x: Math.random() * width,\n y: Math.random() * height,\n layer,\n size: layer === 2 ? 2 : 1,\n speed: 12 + layer * 28, // px/sec\n twinkle: Math.random() * Math.PI * 2,\n });\n }\n }\n\n update(dt) {\n for (const s of this.stars) {\n s.y += s.speed * dt;\n s.twinkle += dt * 6;\n if (s.y > this.h) {\n s.y -= this.h;\n s.x = Math.random() * this.w;\n }\n }\n }\n\n draw(ctx) {\n for (const s of this.stars) {\n const a = 0.5 + 0.5 * Math.sin(s.twinkle);\n const shade = 140 + s.layer * 38;\n ctx.fillStyle = `rgba(${shade}, ${shade}, 255, ${a.toFixed(2)})`;\n ctx.fillRect(s.x | 0, s.y | 0, s.size, s.size);\n }\n }\n}\n",[],[182,231],"e99cce44-8a1d-48ad-9f32-a4289951e480","sprites.js","2ddcb080-6477-11f1-8e27-1607ee4eb77e",7,["D",1781059858989],"// Pixel-art sprite drawing helpers. Everything is drawn procedurally\n// from small grids so we don't depend on external image assets.\n\n// Draw a sprite from a string grid. Each char maps to a color via `palette`.\n// \".\" = transparent. Cells are `scale` px each, centered on (cx, cy).\nexport function drawGrid(ctx, grid, palette, cx, cy, scale) {\n const rows = grid;\n const h = rows.length;\n const w = rows[0].length;\n const ox = cx - (w * scale) / 2;\n const oy = cy - (h * scale) / 2;\n for (let y = 0; y < h; y++) {\n for (let x = 0; x < w; x++) {\n const ch = rows[y][x];\n if (ch === \".\") continue;\n ctx.fillStyle = palette[ch];\n ctx.fillRect(ox + x * scale, oy + y * scale, scale, scale);\n }\n }\n}\n\n// Player ship\nconst SHIP = [\n \"....G....\",\n \"....G....\",\n \"...GGG...\",\n \"...GWG...\",\n \"..GGGGG..\",\n \".GGGGGGG.\",\n \"GGGGGGGGG\",\n \"G.GGGGG.G\",\n \"G.G...G.G\",\n];\nconst SHIP_PAL = { G: \"#33ff66\", W: \"#bfffff\" };\n\nexport function drawShip(ctx, cx, cy, scale = 3) {\n drawGrid(ctx, SHIP, SHIP_PAL, cx, cy, scale);\n}\n\n// Three alien types, each with a 2-frame animation for a little wiggle.\nconst ALIENS = {\n // bottom-row grunt (red)\n grunt: {\n pal: { B: \"#ff4466\", E: \"#ffffff\" },\n frames: [\n [\n \".B.....B.\",\n \"..B...B..\",\n \".BBBBBBB.\",\n \"BB.BBB.BB\",\n \"BBBBBBBBB\",\n \"B.BBBBB.B\",\n \"B.B...B.B\",\n \"...B.B...\",\n ],\n [\n \"B.......B\",\n \".B.....B.\",\n \".BBBBBBB.\",\n \"BB.BBB.BB\",\n \"BBBBBBBBB\",\n \"B.BBBBB.B\",\n \".B.B.B.B.\",\n \"B.......B\",\n ],\n ],\n },\n // mid escort (cyan)\n escort: {\n pal: { B: \"#33ddff\", E: \"#ffffff\" },\n frames: [\n [\n \"..B...B..\",\n \"...BBB...\",\n \"..BBBBB..\",\n \".BB.B.BB.\",\n \".BBBBBBB.\",\n \"..B.B.B..\",\n \".B.....B.\",\n \"B.......B\",\n ],\n [\n \"..B...B..\",\n \"B..BBB..B\",\n \".BBBBBBB.\",\n \".BB.B.BB.\",\n \".BBBBBBB.\",\n \"..B.B.B..\",\n \"..B...B..\",\n \".B.....B.\",\n ],\n ],\n },\n // flagship (yellow, worth the most)\n flagship: {\n pal: { B: \"#ffd24d\", Y: \"#ff8a00\", E: \"#ffffff\" },\n frames: [\n [\n \"...YYY...\",\n \"..YBBBY..\",\n \".YBBBBBY.\",\n \"YBBYBYBBY\",\n \"YBBBBBBBY\",\n \".YBBBBBY.\",\n \"..Y.B.Y..\",\n \".Y.....Y.\",\n ],\n [\n \"...YYY...\",\n \"..YBBBY..\",\n \".YBBBBBY.\",\n \"YBBYBYBBY\",\n \"YBBBBBBBY\",\n \".YBBBBBY.\",\n \"..Y.B.Y..\",\n \"Y.......Y\",\n ],\n ],\n },\n};\n\nexport function drawAlien(ctx, type, cx, cy, frame, scale = 3) {\n const def = ALIENS[type] || ALIENS.grunt;\n const grid = def.frames[frame % def.frames.length];\n drawGrid(ctx, grid, def.pal, cx, cy, scale);\n}\n\nexport const ALIEN_TYPES = Object.keys(ALIENS);\n",[],[182,239],"ebd4a7c8-44c5-4039-a4a2-393495dc5784","main.js","64781684-6477-11f1-84b4-1607ee4eb77e",11,["D",1781059937460],"import { Alien, Bullet, Explosion, hit, Player } from \"./entities.js\";\nimport { Starfield } from \"./starfield.js\";\nimport { sfx, unlock } from \"./audio.js\";\nimport { clearEdges, initTouch, keys, onStart } from \"./input.js\";\n\nconst canvas = document.getElementById(\"game\");\nconst ctx = canvas.getContext(\"2d\");\nconst W = canvas.width;\nconst H = canvas.height;\nctx.imageSmoothingEnabled = false;\n\nconst HI_KEY = \"galaxian_hi\";\nlet hiScore = Number(localStorage.getItem(HI_KEY) || 0);\n\n// ---- formation layout ----\nconst COLS = 8;\nconst ROWS = 5;\nconst CELL_W = 40;\nconst CELL_H = 36;\nconst FORM_TOP = 70;\n// alien type + points by row (top rows worth more)\nconst ROW_DEF = [\n { type: \"flagship\", points: 60 },\n { type: \"escort\", points: 40 },\n { type: \"escort\", points: 40 },\n { type: \"grunt\", points: 20 },\n { type: \"grunt\", points: 20 },\n];\n\nconst State = { MENU: 0, PLAYING: 1, DYING: 2, OVER: 3, CLEAR: 4 };\n\nconst game = {\n state: State.MENU,\n score: 0,\n lives: 3,\n level: 1,\n player: null,\n aliens: [],\n pBullets: [],\n eBullets: [],\n booms: [],\n formation: { offsetX: 0, offsetY: 0, dir: 1, t: 0 },\n diveTimer: 1.5,\n respawnT: 0,\n clearT: 0,\n nextLife: 5000,\n};\n\nconst stars = new Starfield(W, H);\n\n// ---- UI elements ----\nconst overlay = document.getElementById(\"overlay\");\nconst gameover = document.getElementById(\"gameover\");\nconst elHi = document.getElementById(\"hi-score\");\nconst elHi2 = document.getElementById(\"hi-score-2\");\nconst elFinal = document.getElementById(\"final-score\");\nelHi.textContent = hiScore;\n\nfunction buildFormation(level) {\n const aliens = [];\n const formW = COLS * CELL_W;\n const startX = (W - formW) / 2 + CELL_W / 2;\n for (let r = 0; r < ROWS; r++) {\n for (let c = 0; c < COLS; c++) {\n const def = ROW_DEF[r];\n const hx = startX + c * CELL_W;\n const hy = FORM_TOP + r * CELL_H;\n aliens.push(new Alien(def.type, c, r, hx, hy, def.points));\n }\n }\n return aliens;\n}\n\nfunction startGame() {\n game.state = State.PLAYING;\n game.score = 0;\n game.lives = 3;\n game.level = 1;\n game.nextLife = 5000;\n resetLevel();\n overlay.classList.add(\"hidden\");\n gameover.classList.add(\"hidden\");\n}\n\nfunction resetLevel() {\n game.player = new Player(W, H);\n game.aliens = buildFormation(game.level);\n game.pBullets = [];\n game.eBullets = [];\n game.booms = [];\n game.formation = { offsetX: 0, offsetY: 0, dir: 1, t: 0 };\n game.diveTimer = Math.max(0.6, 1.8 - game.level * 0.12);\n}\n\nfunction nextLevel() {\n game.level++;\n sfx.levelUp();\n game.state = State.CLEAR;\n game.clearT = 1.4;\n}\n\nfunction endGame() {\n game.state = State.OVER;\n if (game.score > hiScore) {\n hiScore = game.score;\n localStorage.setItem(HI_KEY, String(hiScore));\n }\n elHi.textContent = hiScore;\n elHi2.textContent = hiScore;\n elFinal.textContent = game.score;\n gameover.classList.remove(\"hidden\");\n}\n\nfunction addScore(n) {\n game.score += n;\n if (game.score >= game.nextLife) {\n game.lives++;\n game.nextLife += 8000;\n sfx.extraLife();\n }\n}\n\n// ---- update ----\nfunction update(dt) {\n stars.update(dt);\n\n if (game.state === State.CLEAR) {\n game.clearT -= dt;\n if (game.clearT <= 0) {\n resetLevel();\n game.state = State.PLAYING;\n }\n return;\n }\n\n if (game.state === State.DYING) {\n game.respawnT -= dt;\n game.booms.forEach((b) => b.update(dt));\n game.booms = game.booms.filter((b) => !b.dead);\n if (game.respawnT <= 0) {\n if (game.lives <= 0) {\n endGame();\n } else {\n game.player = new Player(W, H);\n game.eBullets = [];\n game.state = State.PLAYING;\n }\n }\n return;\n }\n\n if (game.state !== State.PLAYING) return;\n\n // formation sway\n const f = game.formation;\n f.t += dt;\n f.offsetX = Math.sin(f.t * 0.8) * 22;\n\n // player\n game.player.update(dt, keys);\n if (keys.fire && game.player.canFire()) {\n game.player.cooldown = 0.32;\n game.pBullets.push(new Bullet(game.player.x, game.player.y - 16, -560, \"#fff\"));\n sfx.shoot();\n }\n\n // aliens\n const formAliens = game.aliens.filter((a) => a.state === \"formation\");\n game.diveTimer -= dt;\n if (game.diveTimer <= 0 && formAliens.length > 0) {\n const a = formAliens[Math.floor(Math.random() * formAliens.length)];\n const dir = a.homeX < W / 2 ? 1 : -1;\n a.startDive(game.player.x, H, dir);\n sfx.dive();\n game.diveTimer = Math.max(0.5, 1.6 - game.level * 0.1) * (0.6 + Math.random());\n }\n\n for (const a of game.aliens) {\n a.update(dt, game.formation);\n // diving aliens occasionally shoot down at the player\n if (a.state === \"diving\") {\n a.shootTimer -= dt;\n if (a.shootTimer <= 0) {\n a.shootTimer = 0.5 + Math.random();\n game.eBullets.push(new Bullet(a.x, a.y + 12, 300, \"#ff7766\"));\n }\n }\n }\n\n // bullets\n game.pBullets.forEach((b) => b.update(dt));\n game.eBullets.forEach((b) => b.update(dt));\n game.pBullets = game.pBullets.filter((b) => b.y > -20 && !b.dead);\n game.eBullets = game.eBullets.filter((b) => b.y < H + 20 && !b.dead);\n\n // player bullets vs aliens\n for (const b of game.pBullets) {\n for (const a of game.aliens) {\n if (a.dead) continue;\n if (hit(b, a)) {\n b.dead = true;\n a.dead = true;\n const mult = a.state === \"diving\" ? 2 : 1;\n addScore(a.points * mult);\n game.booms.push(new Explosion(a.x, a.y, colorFor(a.type)));\n sfx.explosion();\n break;\n }\n }\n }\n game.aliens = game.aliens.filter((a) => !a.dead);\n\n // enemy bullets / diving aliens vs player\n if (game.player && !game.player.dead) {\n const collide =\n game.eBullets.some((b) => hit(b, game.player)) ||\n game.aliens.some((a) => a.state === \"diving\" && hit(a, game.player));\n if (collide) killPlayer();\n }\n\n // explosions\n game.booms.forEach((b) => b.update(dt));\n game.booms = game.booms.filter((b) => !b.dead);\n\n // win condition\n if (game.aliens.length === 0) nextLevel();\n}\n\nfunction colorFor(type) {\n return type === \"flagship\" ? \"#ffd24d\" : type === \"escort\" ? \"#33ddff\" : \"#ff4466\";\n}\n\nfunction killPlayer() {\n game.lives--;\n game.booms.push(new Explosion(game.player.x, game.player.y, \"#33ff66\"));\n game.player.dead = true;\n sfx.playerHit();\n game.state = State.DYING;\n game.respawnT = 1.3;\n}\n\n// ---- draw ----\nfunction draw() {\n ctx.fillStyle = \"#000\";\n ctx.fillRect(0, 0, W, H);\n stars.draw(ctx);\n\n if (game.state === State.PLAYING || game.state === State.DYING || game.state === State.CLEAR) {\n game.aliens.forEach((a) => a.draw(ctx));\n game.pBullets.forEach((b) => b.draw(ctx));\n game.eBullets.forEach((b) => b.draw(ctx));\n game.booms.forEach((b) => b.draw(ctx));\n if (game.player && !game.player.dead) game.player.draw(ctx);\n drawHUD();\n if (game.state === State.CLEAR) drawCenter(`LEVEL ${game.level}`, \"#ffe14d\");\n } else {\n drawHUD();\n }\n}\n\nfunction drawHUD() {\n ctx.fillStyle = \"#fff\";\n ctx.font = \"10px 'Press Start 2P', monospace\";\n ctx.textBaseline = \"top\";\n ctx.textAlign = \"left\";\n ctx.fillText(\"SCORE \" + String(game.score).padStart(5, \"0\"), 10, 10);\n ctx.textAlign = \"center\";\n ctx.fillStyle = \"#ff6f8f\";\n ctx.fillText(\"HI \" + String(hiScore).padStart(5, \"0\"), W / 2, 10);\n ctx.textAlign = \"right\";\n ctx.fillText(\"LV \" + game.level, W - 10, 10);\n // lives as little ships\n ctx.textAlign = \"left\";\n ctx.fillStyle = \"#33ff66\";\n for (let i = 0; i < game.lives; i++) {\n ctx.fillText(\"▲\", 12 + i * 18, H - 22);\n }\n}\n\nfunction drawCenter(text, color) {\n ctx.fillStyle = color;\n ctx.font = \"20px 'Press Start 2P', monospace\";\n ctx.textAlign = \"center\";\n ctx.textBaseline = \"middle\";\n ctx.fillText(text, W / 2, H / 2);\n}\n\n// ---- main loop ----\nlet last = performance.now();\nfunction loop(now) {\n let dt = (now - last) / 1000;\n last = now;\n if (dt > 0.05) dt = 0.05; // clamp big frame gaps\n update(dt);\n draw();\n clearEdges();\n requestAnimationFrame(loop);\n}\n\n// ---- wiring ----\nfunction begin() {\n if (game.state === State.PLAYING || game.state === State.DYING) return;\n unlock();\n startGame();\n}\ndocument.getElementById(\"start-btn\").addEventListener(\"click\", begin);\ndocument.getElementById(\"again-btn\").addEventListener(\"click\", begin);\nonStart(begin);\ninitTouch();\n\nrequestAnimationFrame(loop);\n",[],[182,247],"5f8c1ca7-94d7-4780-aa5c-586a2dbd3ae4","input.js","332c05f4-6477-11f1-a5ee-1607ee4eb77e",6,["D",1781059854752],"// Centralized input: keyboard + on-screen touch buttons.\n// Exposes a small reactive `keys` object the game loop reads each frame.\n\nexport const keys = {\n left: false,\n right: false,\n fire: false,\n // edge-triggered \"fire was just pressed\" used for menus / single shots\n firePressed: false,\n};\n\nconst LEFT = new Set([\"ArrowLeft\", \"KeyA\"]);\nconst RIGHT = new Set([\"ArrowRight\", \"KeyD\"]);\nconst FIRE = new Set([\"Space\", \"KeyW\", \"ArrowUp\"]);\n\nlet onStartCb = null;\nexport function onStart(cb) {\n onStartCb = cb;\n}\n\naddEventListener(\"keydown\", (e) => {\n if (LEFT.has(e.code)) keys.left = true;\n if (RIGHT.has(e.code)) keys.right = true;\n if (FIRE.has(e.code)) {\n if (!keys.fire) keys.firePressed = true;\n keys.fire = true;\n e.preventDefault();\n }\n if (e.code === \"Enter\" && onStartCb) onStartCb();\n});\n\naddEventListener(\"keyup\", (e) => {\n if (LEFT.has(e.code)) keys.left = false;\n if (RIGHT.has(e.code)) keys.right = false;\n if (FIRE.has(e.code)) keys.fire = false;\n});\n\n// ---- touch controls ----\nfunction bindHold(id, on, off) {\n const el = document.getElementById(id);\n if (!el) return;\n const press = (e) => { e.preventDefault(); on(); };\n const release = (e) => { e.preventDefault(); off(); };\n el.addEventListener(\"touchstart\", press, { passive: false });\n el.addEventListener(\"touchend\", release, { passive: false });\n el.addEventListener(\"touchcancel\", release, { passive: false });\n el.addEventListener(\"mousedown\", press);\n el.addEventListener(\"mouseup\", release);\n el.addEventListener(\"mouseleave\", release);\n}\n\nexport function initTouch() {\n bindHold(\"t-left\", () => (keys.left = true), () => (keys.left = false));\n bindHold(\"t-right\", () => (keys.right = true), () => (keys.right = false));\n bindHold(\n \"t-fire\",\n () => { keys.firePressed = true; keys.fire = true; },\n () => (keys.fire = false),\n );\n}\n\n// Call at the end of each frame to clear edge-triggered flags.\nexport function clearEdges() {\n keys.firePressed = false;\n}\n",[],[182,255],"747bdc9f-bc1b-4183-ad1c-95ce4c07253b","entities.js","4e9bd968-6477-11f1-bc88-1607ee4eb77e",10,["D",1781059900784],"// Game entities: player, alien formation, diving aliens, bullets, explosions.\nimport { drawShip, drawAlien } from \"./sprites.js\";\n\nexport const SCALE = 3;\n\n// ---------------------------------------------------------------- Player\nexport class Player {\n constructor(w, h) {\n this.w = 24;\n this.h = 24;\n this.x = w / 2;\n this.y = h - 50;\n this.bounds = { min: 18, max: w - 18 };\n this.speed = 260; // px/sec\n this.cooldown = 0;\n this.dead = false;\n }\n update(dt, keys) {\n if (keys.left) this.x -= this.speed * dt;\n if (keys.right) this.x += this.speed * dt;\n this.x = Math.max(this.bounds.min, Math.min(this.bounds.max, this.x));\n if (this.cooldown > 0) this.cooldown -= dt;\n }\n canFire() {\n return this.cooldown <= 0;\n }\n draw(ctx) {\n drawShip(ctx, this.x, this.y, SCALE);\n }\n}\n\n// ---------------------------------------------------------------- Bullet\nexport class Bullet {\n constructor(x, y, vy, color) {\n this.x = x;\n this.y = y;\n this.vy = vy;\n this.color = color;\n this.w = 3;\n this.h = 10;\n this.dead = false;\n }\n update(dt) {\n this.y += this.vy * dt;\n }\n draw(ctx) {\n ctx.fillStyle = this.color;\n ctx.fillRect(this.x - this.w / 2, this.y - this.h / 2, this.w, this.h);\n }\n}\n\n// ---------------------------------------------------------------- Alien\n// States: \"formation\" (sitting in the grid, swaying) and \"diving\"\n// (swooping toward the player along a curved path, Galaxian-style).\nexport class Alien {\n constructor(type, col, row, homeX, homeY, points) {\n this.type = type;\n this.col = col;\n this.row = row;\n this.homeX = homeX;\n this.homeY = homeY;\n this.x = homeX;\n this.y = homeY;\n this.points = points;\n this.w = 24;\n this.h = 24;\n this.state = \"formation\";\n this.dead = false;\n this.frame = 0;\n this.diveT = 0;\n this.path = null;\n this.shootTimer = 0.4 + Math.random() * 1.2;\n }\n\n // Build a curved dive path from the current formation slot.\n startDive(targetX, height, dir) {\n this.state = \"diving\";\n this.diveT = 0;\n const startX = this.x;\n const startY = this.y;\n // Control points for a quadratic-ish swoop: peel out sideways, then\n // sweep down across the screen toward the player's x.\n this.path = {\n sx: startX,\n sy: startY,\n // mid control point pushes them out to the side\n cx: startX + dir * (80 + Math.random() * 70),\n cy: startY + 60,\n // end below the screen, biased toward the target\n ex: targetX + (Math.random() * 80 - 40),\n ey: height + 40,\n };\n }\n\n update(dt, formation) {\n this.frame = (this.frame + dt * 4) % 2;\n if (this.state === \"formation\") {\n this.x = this.homeX + formation.offsetX;\n this.y = this.homeY + formation.offsetY;\n } else if (this.state === \"diving\") {\n this.diveT += dt * 0.55;\n const t = this.diveT;\n if (t >= 1) {\n // Looped off the bottom: respawn at top, glide back to formation slot.\n this.state = \"returning\";\n this.y = -20;\n this.x = this.homeX + formation.offsetX;\n return;\n }\n const p = this.path;\n const mt = 1 - t;\n // Quadratic bezier\n this.x = mt * mt * p.sx + 2 * mt * t * p.cx + t * t * p.ex;\n this.y = mt * mt * p.sy + 2 * mt * t * p.cy + t * t * p.ey;\n } else if (this.state === \"returning\") {\n const tx = this.homeX + formation.offsetX;\n const ty = this.homeY + formation.offsetY;\n const dx = tx - this.x;\n const dy = ty - this.y;\n const d = Math.hypot(dx, dy);\n if (d < 4) {\n this.state = \"formation\";\n } else {\n const sp = 200 * dt;\n this.x += (dx / d) * Math.min(sp, d);\n this.y += (dy / d) * Math.min(sp, d);\n }\n }\n }\n\n draw(ctx) {\n // tilt diving aliens slightly toward their travel direction\n drawAlien(ctx, this.type, this.x, this.y, Math.floor(this.frame), SCALE);\n }\n}\n\n// ---------------------------------------------------------------- Explosion\nexport class Explosion {\n constructor(x, y, color = \"#ffcc33\") {\n this.x = x;\n this.y = y;\n this.color = color;\n this.t = 0;\n this.dur = 0.45;\n this.dead = false;\n this.parts = [];\n const n = 10;\n for (let i = 0; i < n; i++) {\n const a = (i / n) * Math.PI * 2 + Math.random() * 0.5;\n const s = 40 + Math.random() * 90;\n this.parts.push({ vx: Math.cos(a) * s, vy: Math.sin(a) * s, x: 0, y: 0 });\n }\n }\n update(dt) {\n this.t += dt;\n if (this.t >= this.dur) this.dead = true;\n for (const p of this.parts) {\n p.x += p.vx * dt;\n p.y += p.vy * dt;\n }\n }\n draw(ctx) {\n const k = 1 - this.t / this.dur;\n ctx.globalAlpha = Math.max(0, k);\n ctx.fillStyle = this.color;\n const size = 3 * k + 1;\n for (const p of this.parts) {\n ctx.fillRect(this.x + p.x - size / 2, this.y + p.y - size / 2, size, size);\n }\n ctx.globalAlpha = 1;\n }\n}\n\n// Axis-aligned bounding box overlap test (entities are center-anchored).\nexport function hit(a, b) {\n return (\n Math.abs(a.x - b.x) < (a.w + b.w) / 2 &&\n Math.abs(a.y - b.y) < (a.h + b.h) / 2\n );\n}\n",[],[182,263],"9eb7a2c3-303b-4548-b0fc-a0c080628192","audio.js","3f7b955e-6477-11f1-84b4-1607ee4eb77e",9,["D",1781059875408],"// Tiny WebAudio sound engine — all sounds synthesized, no asset files.\nlet ctx = null;\nlet enabled = true;\n\nfunction ac() {\n if (!ctx) {\n const AC = window.AudioContext || window.webkitAudioContext;\n ctx = new AC();\n }\n if (ctx.state === \"suspended\") ctx.resume();\n return ctx;\n}\n\n// Must be called from a user gesture (button click) to unlock audio.\nexport function unlock() {\n ac();\n}\n\nexport function setEnabled(v) {\n enabled = v;\n}\n\nfunction tone({ freq = 440, type = \"square\", dur = 0.1, vol = 0.2, slide = 0 }) {\n if (!enabled) return;\n const a = ac();\n const osc = a.createOscillator();\n const gain = a.createGain();\n osc.type = type;\n osc.frequency.setValueAtTime(freq, a.currentTime);\n if (slide) {\n osc.frequency.exponentialRampToValueAtTime(\n Math.max(20, freq + slide),\n a.currentTime + dur,\n );\n }\n gain.gain.setValueAtTime(vol, a.currentTime);\n gain.gain.exponentialRampToValueAtTime(0.0001, a.currentTime + dur);\n osc.connect(gain).connect(a.destination);\n osc.start();\n osc.stop(a.currentTime + dur);\n}\n\nfunction noise({ dur = 0.2, vol = 0.3 }) {\n if (!enabled) return;\n const a = ac();\n const frames = a.sampleRate * dur;\n const buffer = a.createBuffer(1, frames, a.sampleRate);\n const data = buffer.getChannelData(0);\n for (let i = 0; i < frames; i++) {\n data[i] = (Math.random() * 2 - 1) * (1 - i / frames);\n }\n const src = a.createBufferSource();\n src.buffer = buffer;\n const gain = a.createGain();\n gain.gain.setValueAtTime(vol, a.currentTime);\n gain.gain.exponentialRampToValueAtTime(0.0001, a.currentTime + dur);\n const filter = a.createBiquadFilter();\n filter.type = \"lowpass\";\n filter.frequency.value = 1200;\n src.connect(filter).connect(gain).connect(a.destination);\n src.start();\n}\n\nexport const sfx = {\n shoot: () => tone({ freq: 880, type: \"square\", dur: 0.08, vol: 0.12, slide: 400 }),\n hit: () => tone({ freq: 220, type: \"sawtooth\", dur: 0.12, vol: 0.18, slide: -160 }),\n explosion: () => noise({ dur: 0.35, vol: 0.35 }),\n dive: () => tone({ freq: 600, type: \"triangle\", dur: 0.25, vol: 0.12, slide: -420 }),\n playerHit: () => noise({ dur: 0.6, vol: 0.4 }),\n levelUp: () => {\n [523, 659, 784, 1047].forEach((f, i) =>\n setTimeout(() => tone({ freq: f, type: \"square\", dur: 0.12, vol: 0.15 }), i * 90)\n );\n },\n extraLife: () => {\n [784, 1047].forEach((f, i) =>\n setTimeout(() => tone({ freq: f, type: \"triangle\", dur: 0.15, vol: 0.18 }), i * 120)\n );\n },\n};\n",[],[182,271],["D",1781059845842],[199,200,201,202,203,204],[182],["D",1781059785998],{"_16":17,"_88":83},{"_16":17,"_82":83,"_84":83,"_34":35,"_85":86,"_87":26},{"_66":67,"_20":68,"_18":69,"_70":19,"_71":72,"_73":74,"_75":28,"_76":77,"_78":79,"_80":21,"_81":17},"ctx",{"_59":-5,"_110":318,"_319":320,"_321":322,"_323":26,"_324":26,"_325":26,"_326":39,"_327":-5,"_328":-7,"_329":-7,"_330":43,"_331":26,"_332":26,"_333":-5,"_334":26,"_335":26,"_336":26,"_337":-5},"ENV",{"_289":290,"_291":292,"_293":68,"_294":295,"_296":297,"_298":299,"_300":301,"_302":303,"_304":305,"_306":307,"_308":309,"_310":311,"_312":313,"_314":315,"_316":317},"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"]

Search