Built and deployed Super Dario 2D runner game

Summary

Closed, Completed

Build
Created single-file 2D runner game with creative references.
Build
Setup
Initialized git repo and pushed code to GitHub.
Setup
Verify
Enabled GitHub Pages and confirmed live deployment.
Verify

make a 2d runner super mario game, call it super dario. ideally all assets should be raw js, css, html, and contained in a single html page. don't get too complicated with levels, just one level is fine. add some fun references to anthropic-y stuff, members of technical staff etc. it will be uploaded to github and played on github pages, i made a remote repo for you tarunsachdeva/superdario.git this is my only prompt to you, please complete it with no further instructions. be creative ;)

make a 2d runner super mario game, call it super dario. ideally all assets should be raw js, css, html, and contained in a single html page. don't get too complicated with levels, just one level is fine. add some fun references to anthropic-y stuff, members of technical staff etc. it will be uploaded to github and played on github pages, make a folder called superdario and git init in there, also i made a remote repo for you tarunsachdeva/superdario.git.

this is my only prompt to you, please complete it with no further instructions. be creative ;).

Now the game itself — one self-contained index.html:

Let me syntax-check the JavaScript:

>awk '/<script>/{f=1;next}/<\/script>/{f=0}f' /Users/tarunsachdeva/code/superdario/index.html > /tmp/sd.js
cat > /tmp/stub.js <<'EOF'
// --- headless stubs ---
const _g2d = new Proxy({}, {
  get(t, p){ if(p==="createLinearGradient") return ()=>({addColorStop(){}}); return ()=>_g2d; },
  set(){ return true; }
});
global.document = {
  getElementById(id){
    if(id==="game") return { getContext:()=>_g2d, width:832, height:480 };
    return { innerHTML:"", classList:{ add(){}, remove(){} } };
  }
};
global.window = {};
let _raf = null;
global.requestAnimationFrame = cb => { _raf = cb; };
global.__step = t => { const cb=_raf; _raf=null; cb(t); };
global.addEventListener = ()=>{};
EOF
cat > /tmp/harness.js <<'EOF'
// --- bot harness (same scope as game) ---
startGame();
lives = 99;
let t = 0, jumpT = 0, maxX = 0, deaths = 0, lastState = state;
for (let i = 0; i < 60*240; i++) {
  keys.ArrowRight = true; keys.ShiftLeft = true;
  if (state === "playing") {
    const feetY = player.y + player.h;
    const wallAhead = solidAt(player.x+player.w+30, player.y+player.h-6) || solidAt(player.x+player.w+30, player.y+6);
    let gapAhead = true;
    for (let d = 8; d <= 96; d += 16) if (solidAt(player.x+player.w+d, feetY+10)) { gapAhead = false; break; }
    const foeAhead = enemies.some(e => !e.dead && e.x > player.x && e.x - player.x < 90 && Math.abs(e.y-player.y) < 60);
    if (player.onGround && (wallAhead || gapAhead || foeAhead)) jumpT = 16;
  }
  keys.Space = jumpT > 0; if (jumpT > 0) jumpT--;
  t += 16.7; __step(t);
  maxX = Math.max(maxX, player.x);
  if (state !== lastState) {
    if (state === "dying") deaths++;
    console.log(`frame ${i}: ${lastState} -> ${state} (x=${Math.round(player.x)})`);
    lastState = state;
  }
  if (state === "won" || state === "gameover") break;
}
console.log(`RESULT state=${state} maxX=${Math.round(maxX)}/${COLS*32} tokens=[REDACTED] score=${score} deaths=${deaths}`);
if (state !== "won") { console.log("BOT DID NOT FINISH"); process.exit(1); }
EOF
cat /tmp/stub.js /tmp/sd.js /tmp/harness.js > /tmp/sdtest.js && node /tmp/sdtest.js

>cat > /tmp/harness2.js <<'EOF'
// --- death-path harness: walk right, never jump ---
startGame();
let t = 0, lastState = state, transitions = [];
for (let i = 0; i < 60*300; i++) {
  keys.ArrowRight = true;
  t += 16.7; __step(t);
  if (state !== lastState) { transitions.push(`${lastState}->${state}@x${Math.round(player.x)}`); lastState = state; }
  if (state === "gameover") break;
}
console.log(transitions.join("  "));
console.log(`RESULT state=${state} lives=${lives} quip="${deathQuip}"`);
if (state !== "gameover") { console.log("EXPECTED GAMEOVER"); process.exit(1); }
EOF
cat /tmp/stub.js /tmp/sd.js /tmp/harness2.js > /tmp/sdtest2.js && node /tmp/sdtest2.js

Pushed. Let me try enabling GitHub Pages via the gh CLI so it's playable right away:

Pages is enabled and building. Let me verify it goes live:

🍄 Super Dario is live and playable right now: https://tarunsachdeva.github.io/superdario/

What I built — a complete 2D runner-platformer in a single index.html (~1,050 lines): every sprite is hand-drawn canvas rectangles and arcs, every sound is a raw WebAudio oscillator, zero external assets. The repo lives at ~/code/superdario, is pushed to tarunsachdeva/superdario, and I enabled GitHub Pages via the API and confirmed it's serving (HTTP 200).

World 1-1: Mission Alignment — one level with pipes, gaps, stairs, question blocks, a mid-level checkpoint, and a flag-slide finish at a drawn Anthropic HQ building, all against a parallax SF skyline with the Golden Gate Bridge.

The Anthropic-y bits:

Enemies: paperclip maximizers (angry office supplies with tiny feet) and shoggoths wearing little yellow smiley-face masks that slip when they blink
Timer is a context window — 200,000 tokens ticking down; collecting token coins (orange, stamped with an "A") tops it back up. Run out and you die of "Context window exceeded. Consider /compact-ing your jumps."
Power-ups: a GPU with spinning fans makes you big ("SCALING LAWS!"), and a Golden Gate power-up gives 9 seconds of invincibility ("YOU ARE THE GOLDEN GATE BRIDGE")
Signs along the road: "MTS AT WORK — do not disturb the pretraining run," "FREE ESPRESSO for members of technical staff ☕," and a checkpoint that reads git commit -m 'checkpoint, do not force-push'
Press H mid-run for a helpful, harmless hint from Claude; deaths draw from rotating quips like "529 — Overloaded" and "You have reached your usage limit. Resets in 5 hours"
Win screen: "Claude says: 'You're absolutely right to have jumped over those paperclips.'"

Verified, not just written: I ran the game headlessly in Node with stubbed DOM/canvas and a bot that sprints and jumps — it completed the full level (reached the win state, zero crashes), and a second bot confirmed the hurt → death → respawn → game-over flow works with the lives system.

Controls: arrows/WASD to move, SPACE to jump (hold for higher), SHIFT to sprint, P to pause, M to mute. Ship it 🚩

Very cool, but it kind of hangs sometimes after playing for a bit Dario is a floating off the ground, move him down a few pixels Speed it up a bit too Make the gameboard take up more of the screen, its a bit small

Good feedback — and I think I know the "hang": the game runs one physics update per requestAnimationFrame, and macOS throttles rAF (ProMotion/low-power mode, focus changes), so the game drops into slow-motion or stutters. I'll switch to a fixed-timestep loop with catch-up, which fixes the hang and makes speed consistent. Then the sprite offset, faster movement, and a bigger board.

Now the fixed-timestep game loop (the hang fix) plus input robustness:

Now the speed bump and Dario's grounding:

One safety cap on the effect arrays, then re-test: