{"/styles.css":{"code":".app {\n font-family: system-ui, sans-serif;\n max-width: 800px;\n margin: 0 auto;\n padding: 2rem;\n}\n\nh1 {\n color: #333;\n}"},"/App.js":{"code":"import { useEffect, useState } from \"react\";\n\nconst levels = [ { speed: 6, length: 1200, obstacles: [ { x: 400, type: \"spike\" }, { x: 650, type: \"block\" }, { x: 900, type: \"spike\" } ] }, { speed: 8, length: 1400, obstacles: [ { x: 400, type: \"spike\" }, { x: 550, type: \"spike\" }, { x: 750, type: \"block\" }, { x: 1000, type: \"spike\" } ] } ];\n\nexport default function App() { const [y, setY] = useState(0); const [velocity, setVelocity] = useState(0); const [levelIndex, setLevelIndex] = useState(0); const [obstacles, setObstacles] = useState(levels[0].obstacles.map(o => ({...o}))); const [gameOver, setGameOver] = useState(false); const [progress, setProgress] = useState(0);\n\nconst gravity = 0.6; const jumpPower = -10;\n\nconst currentLevel = levels[levelIndex];\n\nconst jump = () => { if (!gameOver && y === 0) { setVelocity(jumpPower); } };\n\nuseEffect(() => { const interval = setInterval(() => { setVelocity((v) => v + gravity); setY((prev) => { let newY = prev + velocity; if (newY > 0) newY = 0; return newY; });\n\nsetObstacles((obs) =>\n obs.map((o) => ({ ...o, x: o.x - currentLevel.speed }))\n );\n\n // Update progress\n setProgress((p) => {\n const newP = p + currentLevel.speed;\n return newP;\n });\n\n // Collision\n obstacles.forEach((o) => {\n if (o.x < 80 && o.x > 20 && y > -30) {\n setGameOver(true);\n }\n });\n\n // Level complete\n if (progress >= currentLevel.length) {\n const next = (levelIndex + 1) % levels.length;\n setLevelIndex(next);\n setObstacles(levels[next].obstacles.map(o => ({...o})));\n setProgress(0);\n }\n}, 30);\n\nreturn () => clearInterval(interval);\n\n}, [velocity, obstacles, levelIndex, y, progress]);\n\nuseEffect(() => { const handleKey = (e) => { if (e.code === \"Space\") jump(); if (e.code === \"Enter\") resetGame(); };\n\nwindow.addEventListener(\"keydown\", handleKey);\nreturn () => window.removeEventListener(\"keydown\", handleKey);\n\n}, [y, gameOver]);\n\nconst resetGame = () => { setGameOver(false); setLevelIndex(0); setObstacles(levels[0].obstacles.map(o => ({...o}))); setY(0); setVelocity(0); setProgress(0); };\n\nconst progressPercent = Math.min((progress / currentLevel.length) * 100, 100);\n\nreturn (

\n\n{/* Progress Bar */}\n

\n \n

\n\n {/* Player */}\n \n\n {/* Obstacles */}\n {obstacles.map((o, i) => (\n o.type === \"spike\" ? (\n \n ) : (\n \n )\n ))}\n\n {/* Ground */}\n

\n\n {/* UI */}\n

\n Level: {levelIndex + 1}\n

\n\n {/* Game Over */}\n {gameOver && (\n

Game Over

\n \n Restart\n \n

\n )}\n

\n\n

Tap anywhere to jump

\n\n); }"},"/index.js":{"code":"import React, { StrictMode } from \"react\";\nimport { createRoot } from \"react-dom/client\";\nimport \"./styles.css\";\n\nimport App from \"./App\";\n\nconst root = createRoot(document.getElementById(\"root\"));\nroot.render(\n \n \n \n);"},"/public/index.html":{"code":"\n\n\n \n \n My App\n\n\n

\n\n"}}

Geometry dash but better by I hate snakes