just drive

function setup() {
  createCanvas(windowWidth, windowHeight);

  // Car starts near "Midtown Manhattan"
  car = {
    x: 0,
    y: 0,
    angle: 0,          // 0 rad = facing right (east)
    speed: 0,
    maxSpeed: 12,
    accel: 0.4,
    friction: 0.08,
    turnRate: 0.06
  };

  layoutTouchControls();
  textFont('sans-serif');
}

function draw() {
  background(15, 20, 35); // dark night‑time city

  updateInput();
  updateCar();
  updatePedestrians();

  // Camera: keep the car roughly centered
  push();
  translate(width / 2 - car.x, height / 2 - car.y);

  drawCity();
  drawPedestrians();
  drawCar();
  pop();

  drawHUD();
  drawTouchControls();
}

function updateInput() {
  // Reset input each frame
  inputForward = inputBackward = inputLeft = inputRight = false;

  // Keyboard input (arrows + WASD)
  if (keyIsDown(UP_ARROW) || keyIsDown(87)) inputForward = true;    // W / ↑
  if (keyIsDown(DOWN_ARROW) || keyIsDown(83)) inputBackward = true; // S / ↓
  if (keyIsDown(LEFT_ARROW) || keyIsDown(65)) inputLeft = true;     // A / ←
  if (keyIsDown(RIGHT_ARROW) || keyIsDown(68)) inputRight = true;   // D / →

  // Reset touch state
  joystick.dx = 0;
  joystick.dy = 0;
  joystick.active = false;
  gasButton.pressed = false;

  // Touch joystick + gas button
  if (touches && touches.length > 0) {
    for (let t of touches) {
      const x = t.x;
      const y = t.y;

      // Joystick: steering (left bottom)
      const dxJ = x - joystick.x;
      const dyJ = y - joystick.y;
      const distJ = Math.sqrt(dxJ * dxJ + dyJ * dyJ);
      if (distJ < joystick.baseRadius * 1.4) {
        joystick.active = true;
        const clampedDist = min(distJ, joystick.baseRadius);
        if (distJ > 0.001) {
          const nx = dxJ / distJ;
          const ny = dyJ / distJ;
          joystick.dx = nx * clampedDist;
          joystick.dy = ny * clampedDist;

          // Horizontal axis controls left/right steering
          if (nx > 0.25) {
            inputRight = true;
          } else if (nx < -0.25) {
            inputLeft = true;
          }
        }
      }

      // Gas button: accelerate (right bottom)
      const dxG = x - gasButton.x;
      const dyG = y - gasButton.y;
      if (dxG * dxG + dyG * dyG < gasButton.radius * gasButton.radius) {
        gasButton.pressed = true;
      }
    }

    if (gasButton.pressed) {
      inputForward = true;
      // No touch reverse/brake; friction slows you down.
      // Keyboard S / ↓ still works for reverse.
    }
  }
}

function updateCar() {
  const forward = inputForward;
  const backward = inputBackward;
  const left = inputLeft;
  const right = inputRight;

  if (forward) car.speed += car.accel;
  if (backward) car.speed -= car.accel * 0.8;

  // Limit speed (allow a little reverse)
  car.speed = constrain(car.speed, -car.maxSpeed * 0.5, car.maxSpeed);

  // Turning depends on speed so you can't spin in place too fast
  if (car.speed !== 0) {
    let turn = 0;
    if (left) turn -= car.turnRate;
    if (right) turn += car.turnRate;
    car.angle += turn * (car.speed / car.maxSpeed);
  }

  // Simple friction when not accelerating/braking
  if (!forward && !backward) {
    if (car.speed > 0) {
      car.speed = max(0, car.speed - car.friction);
    } else if (car.speed < 0) {
      car.speed = min(0, car.speed + car.friction);
    }
  }

  // Move in the facing direction
  car.x += cos(car.angle) * car.speed;
  car.y += sin(car.angle) * car.speed;
}

function drawCity() {
  const padding = GRID_SPACING * 2;

  const viewLeft = car.x - width / 2 - padding;
  const viewRight = car.x + width / 2 + padding;
  const viewTop = car.y - height / 2 - padding;
  const viewBottom = car.y + height / 2 + padding;

  const startI = Math.floor(viewLeft / GRID_SPACING) - 1;
  const endI = Math.floor(viewRight / GRID_SPACING) + 1;
  const startJ = Math.floor(viewTop / GRID_SPACING) - 1;
  const endJ = Math.floor(viewBottom / GRID_SPACING) + 1;

  // --- Building & park blocks first (so roads can draw on top) ---
  noStroke();
  for (let i = startI; i < endI; i++) {
    for (let j = startJ; j < endJ; j++) {
      const x0 = i * GRID_SPACING + ROAD_WIDTH / 2;
      const x1 = (i + 1) * GRID_SPACING - ROAD_WIDTH / 2;
      const y0 = j * GRID_SPACING + ROAD_WIDTH / 2;
      const y1 = (j + 1) * GRID_SPACING - ROAD_WIDTH / 2;

      const w = x1 - x0;
      const h = y1 - y0;
      if (w <= 0 || h <= 0) continue;

      // Cull blocks completely outside of view
      if (x1 < viewLeft || x0 > viewRight || y1 < viewTop || y0 > viewBottom) continue;

      const cx = (x0 + x1) * 0.5;
      const cy = (y0 + y1) * 0.5;

      // Distance to city center and to the car
      const distFromCenter = dist(cx, cy, 0, 0);
      const distFromCar = dist(cx, cy, car.x, car.y);

      // PERF: Only draw tiny details (windows, park paths) near the car
      const detailedBlock = distFromCar < DETAIL_RADIUS;

      if (isCentralPark(cx, cy) || isSmallParkBlock(i, j, distFromCenter)) {
        drawParkBlock(x0, y0, w, h, i, j, detailedBlock);
      } else {
        if (distFromCenter < MANHATTAN_RADIUS * 0.75) {
          // Dense midtown / downtown
          drawTallBlock(x0, y0, w, h, i, j, detailedBlock);
        } else if (distFromCenter < MANHATTAN_RADIUS * 1.4) {
          // Mixed residential / mid‑rise
          drawMixedBlock(x0, y0, w, h, i, j, detailedBlock);
        } else {
          // Outer boroughs / suburbs
          drawLowBlock(x0, y0, w, h, i, j, detailedBlock);
        }
      }
    }
  }

  // --- Roads on top of blocks ---
  noStroke();
  fill(30); // asphalt

  // Vertical avenues
  for (let i = startI; i <= endI; i++) {
    const x = i * GRID_SPACING;
    rect(x - ROAD_WIDTH / 2, viewTop - padding, ROAD_WIDTH, (viewBottom - viewTop) + 2 * padding);
  }
  // Horizontal streets
  for (let j = startJ; j <= endJ; j++) {
    const y = j * GRID_SPACING;
    rect(viewLeft - padding, y - ROAD_WIDTH / 2, (viewRight - viewLeft) + 2 * padding, ROAD_WIDTH);
  }

  // Lane markings (simple dashed yellow lines)
  stroke(240, 222, 80);
  strokeWeight(2);

  // PERF: Only draw dashed lines on roads near the car
  const laneDetailRadius = GRID_SPACING * 3;

  // Vertical dashes
  for (let i = startI; i <= endI; i++) {
    const x = i * GRID_SPACING;
    if (abs(x - car.x) > laneDetailRadius) continue;
    for (let y = viewTop - padding; y < viewBottom + padding; y += 40) {
      line(x, y, x, y + 20);
    }
  }
  // Horizontal dashes
  for (let j = startJ; j <= endJ; j++) {
    const y = j * GRID_SPACING;
    if (abs(y - car.y) > laneDetailRadius) continue;
    for (let x = viewLeft - padding; x < viewRight + padding; x += 40) {
      line(x, y, x + 20, y);
    }
  }
}

function drawTallBlock(x0, y0, w, h, i, j, detailed) {
  const margin = 10;

  // Base block (sidewalk + lot)
  fill(65, 75, 90);
  rect(x0 + margin, y0 + margin, w - 2 * margin, h - 2 * margin, 6);

  const base = pseudoRandom(i, j);
  const towerCount = 2 + Math.floor(base * 3); // 2–4 towers

  for (let n = 0; n < towerCount; n++) {
    const r1 = pseudoRandom(i * 37 + n, j * 41 + n);
    const r2 = pseudoRandom(i * 53 + n, j * 59 + n);

    const bw = (w - 2 * margin) * (0.18 + 0.18 * r1);
    const bh = (h - 2 * margin) * (0.28 + 0.38 * r2);
    const bx = x0 + margin + r1 * ((w - 2 * margin) - bw);
    const by = y0 + margin + r2 * ((h - 2 * margin) - bh);

    fill(90 + r1 * 70, 90 + r2 * 40, 105 + r1 * 60);
    rect(bx, by, bw, bh, 4);

    // PERF: Windows only on nearby towers
    if (detailed) {
      drawBuildingWindows(bx, by, bw, bh, i, j, n, true);
    }
  }
}

function drawBuildingWindows(bx, by, bw, bh, i, j, n, isTall) {
  const base = pseudoRandom(i * 101 + n * 7, j * 103 + n * 11);
  const cols = 2 + Math.floor(base * 2);      // 2–3 columns
  const rows = 3 + Math.floor(base * 3);      // 3–5 rows

  const marginX = bw * 0.14;
  const marginY = bh * 0.18;

  const areaW = bw - marginX * 2;
  const areaH = bh - marginY * 2;
  if (areaW <= 0 || areaH <= 0) return;

  const windowW = isTall ? 4 : 5;
  const windowH = isTall ? 6 : 5;

  const gapX = (areaW - cols * windowW) / max(cols + 1, 2);
  const gapY = (areaH - rows * windowH) / max(rows + 1, 2);

  fill(255, 240, 200, isTall ? 210 : 180);
  noStroke();

  for (let c = 0; c < cols; c++) {
    for (let r = 0; r < rows; r++) {
      // Some windows off, some on (deterministic)
      const onSeed = pseudoRandom(
        i * 211 + n * 17 + c * 5,
        j * 223 + n * 19 + r * 7
      );
      if (onSeed < 0.25) continue; // window "off"

      const wx = bx + marginX + gapX * (c + 1) + windowW * c;
      const wy = by + marginY + gapY * (r + 1) + windowH * r;
      rect(wx, wy, windowW, windowH, 1);
    }
  }
}

function updatePedestrians() {
  // Remove pedestrians that are far away from the car
  const maxDist = max(width, height) * 1.8;
  for (let i = pedestrians.length - 1; i >= 0; i--) {
    const p = pedestrians[i];
    if (dist(p.x, p.y, car.x, car.y) > maxDist) {
      pedestrians.splice(i, 1);
    }
  }

  // Spawn new pedestrians near the car until we hit the target count
  let safety = 0;
  while (pedestrians.length < TARGET_PEDESTRIANS &&
         pedestrians.length < MAX_PEDESTRIANS &&
         safety < 12) {
    spawnPedestrian();
    safety++;
  }

  // Move pedestrians
  const stepMargin = 6;
  for (let p of pedestrians) {
    p.x += cos(p.dir) * p.speed;
    p.y += sin(p.dir) * p.speed;

    // Keep them inside the inner part of a block (off the road)
    const i = Math.floor(p.x / GRID_SPACING);
    const j = Math.floor(p.y / GRID_SPACING);

    const x0 = i * GRID_SPACING + ROAD_WIDTH / 2 + stepMargin;
    const x1 = (i + 1) * GRID_SPACING - ROAD_WIDTH / 2 - stepMargin;
    const y0 = j * GRID_SPACING + ROAD_WIDTH / 2 + stepMargin;
    const y1 = (j + 1) * GRID_SPACING - ROAD_WIDTH / 2 - stepMargin;

    if (x1 > x0 && y1 > y0) {
      if (p.x < x0) {
        p.x = x0;
        p.dir = random([0, PI]);
      } else if (p.x > x1) {
        p.x = x1;
        p.dir = random([0, PI]);
      }

      if (p.y < y0) {
        p.y = y0;
        p.dir = random([HALF_PI, 3 * HALF_PI]);
      } else if (p.y > y1) {
        p.y = y1;
        p.dir = random([HALF_PI, 3 * HALF_PI]);
      }
    }

    // Occasional random turn to wander around
    if (random() < 0.01) {
      const dirChoices = [0, HALF_PI, PI, 3 * HALF_PI];
      p.dir = random(dirChoices);
    }
  }
}

function drawCar() {
  push();
  translate(car.x, car.y);
  rotate(car.angle);

  rectMode(CENTER);

  // Shadow under car
  noStroke();
  fill(0, 140);
  ellipse(0, 16, 60, 24);

  // Car body
  stroke(255);
  strokeWeight(1.5);
  fill(220, 40, 40);
  rect(0, 0, 70, 36, 10);

  // Roof / windows
  fill(180, 210);
  rect(10, 0, 26, 24, 6);

  // Taxi‑like stripe
  stroke(250, 230, 120);
  strokeWeight(3);
  line(-22, 0, 22, 0);

  // Headlights
  noStroke();
  fill(255, 255, 200);
  ellipse(35, -10, 6, 6);
  ellipse(35, 10, 6, 6);

  pop();
}

// Deterministic pseudo‑random 0–1 based on two integers
function pseudoRandom(a, b) {
  const x = Math.sin(a * 127.1 + b * 311.7) * 43758.5453;
  return x - Math.floor(x);
}

function drawHUD() {
  fill(255);
  noStroke();
  textSize(16);
  textAlign(LEFT, TOP);

  const speedMph = abs(car.speed) * 4; // fake mph from speed value
  const lines = [
    'Drive around a NYC‑style grid',
    'Keys: arrows / WASD to drive',
    'Touch: left joystick + right GAS',
    '',
    'Speed: ' + nf(speedMph, 2, 0) + ' mph',
    'People nearby: ' + pedestrians.length
  ];
  text(lines.join('\n'), 16, 16);

  // Simple mini‑map showing where you are relative to "Manhattan"
  const r = 50;
  const cx = width - 80;
  const cy = 80;

  // Outer circle
  noFill();
  stroke(255, 180);
  strokeWeight(1);
  circle(cx, cy, r * 2);

  // Scale from world → minimap
  const mapScale = r / (MANHATTAN_RADIUS * 1.5);

  const worldToMapX = (wx) => cx + wx * mapScale;
  const worldToMapY = (wy) => cy + wy * mapScale;

  // "Central Park" area on mini‑map
  const parkTop = -GRID_SPACING * 5;
  const parkBottom = -GRID_SPACING * 1;
  const parkLeft = -GRID_SPACING * 1.6;
  const parkRight = GRID_SPACING * 1.6;

  noStroke();
  fill(40, 140, 80, 160);
  const pX = worldToMapX(parkLeft);
  const pY = worldToMapY(parkTop);
  const pW = worldToMapX(parkRight) - pX;
  const pH = worldToMapY(parkBottom) - pY;
  rect(pX, pY, pW, pH, 4);

  // Car position on mini‑map
  fill(255, 80, 80);
  const mx = worldToMapX(car.x);
  const my = worldToMapY(car.y);
  circle(mx, my, 6);

  // North indicator
  stroke(255);
  strokeWeight(1);
  line(cx, cy - r, cx, cy - r - 8);
  noStroke();
  textAlign(CENTER, BOTTOM);
  textSize(12);
  fill(255);
  text('N', cx, cy - r - 10);
}