Untitled

const gameContainer = document.querySelector('.game-container');
const doodler = document.getElementById('doodler');
const scoreEl = document.getElementById('score');

const width = 360;
const height = 640;

let doodlerX = width / 2 - 20;
let doodlerY = 120;
let vy = 0;
const gravity = -0.4;
const jumpVelocity = 12;

let platforms = [];
const platformCount = 10;

let isGameOver = false;
let leftPressed = false;
let rightPressed = false;
let score = 0;
let maxHeight = doodlerY;

// platform model: { x, y, el, vx }

function createPlatform(y) {
  const el = document.createElement('div');
  el.classList.add('platform');
  const x = Math.random() * (width - 70);
  el.style.left = x + 'px';
  el.style.bottom = y + 'px';
  gameContainer.appendChild(el);

  // some platforms move
  const moving = Math.random() < 0.25;
  const vx = moving ? (Math.random() < 0.5 ? 1.2 : -1.2) : 0;

  return { x, y, el, vx };
}

function initPlatforms() {
  platforms = [];
  const gap = height / platformCount;
  for (let i = 0; i < platformCount; i++) {
    const y = 40 + i * gap;
    platforms.push(createPlatform(y));
  }
}

function updatePlatforms(cameraY) {
  for (let p of platforms) {
    // move horizontally if moving platform
    if (p.vx !== 0) {
      p.x += p.vx;
      if (p.x < 0 || p.x > width - 70) p.vx *= -1;
    }

    // move down relative to camera
    const screenY = p.y - cameraY;
    p.el.style.left = p.x + 'px';
    p.el.style.bottom = screenY + 'px';
  }

  // recycle platforms that go below screen
  platforms = platforms.filter(p => p.y - cameraY > -20);
  while (platforms.length < platformCount) {
    const highest = Math.max(...platforms.map(p => p.y));
    const newY = highest + (height / platformCount);
    platforms.push(createPlatform(newY));
  }
}

function reset() {
  doodlerX = width / 2 - 20;
  doodlerY = 120;
  vy = jumpVelocity;
  score = 0;
  maxHeight = doodlerY;
  scoreEl.textContent = '0';
  isGameOver = false;

  // clear old platforms
  document.querySelectorAll('.platform').forEach(p => p.remove());
  initPlatforms();
}

function handleInput() {
  const speed = 4;
  if (leftPressed) doodlerX -= speed;
  if (rightPressed) doodlerX += speed;

  // wrap around like original game
  if (doodlerX < -40) doodlerX = width;
  if (doodlerX > width) doodlerX = -40;
}

function checkCollisions() {
  if (vy < 0) {
    for (let p of platforms) {
      const withinX = doodlerX + 40 > p.x && doodlerX < p.x + 70;
      const withinY =
        doodlerY > p.y &&
        doodlerY < p.y + 20;

      if (withinX && withinY) {
        vy = jumpVelocity;
        break;
      }
    }
  }
}

function gameOver() {
  isGameOver = true;
  const overlay = document.createElement('div');
  overlay.classList.add('game-over');
  overlay.innerHTML = `
    <div>Game Over</div>
    <div>Score: ${score}</div>
    <button>Play Again</button>
  `;
  gameContainer.appendChild(overlay);

  overlay.querySelector('button').addEventListener('click', () => {
    overlay.remove();
    reset();
    requestAnimationFrame(loop);
  });
}

function loop() {
  if (isGameOver) return;

  // physics
  vy += gravity;
  doodlerY += vy;

  // camera follows dood