let scl = 30; // Scale of grid cells

let w = 2000; // Width of the wave grid

let h = 1600; // Height of the wave grid

let terrain = []; // Array for wave heights

let waveTime = 0; // Time variable for wave animation

​

let playerX = 0; // Player's horizontal position

let playerZ = 0; // Player's forward-backward position

let playerY = 0; // Player's height (rides the wave)

let velocityX = 0; // Horizontal velocity

let velocityZ = 2; // Forward velocity (default speed)

let gravity = 0.05; // Gravity pulling the player down

let waveSpeed = 0.05; // Speed of wave animation

let waveHeight = 100; // Maximum height of waves

let waveFrequency = 0.01; // Wave frequency

​

function setup() {

  createCanvas(800, 600, WEBGL);

​

  // Calculate the number of rows and columns

  cols = Math.floor(w / scl);

  rows = Math.floor(h / scl);

​

  // Initialize terrain

  terrain = Array.from({ length: cols }, () => Array(rows).fill(0));

}

​

function draw() {

  background(135, 206, 250); // Sky blue

  ambientLight(150);

  directionalLight(255, 255, 255, -1, -1, -1);

​

  waveTime += waveSpeed; // Advance wave animation over time

​

  // Generate dynamic wave heights

  generateWaves();

​

  // Update player position and physics

  handlePlayerPhysics();

​

  // Update camera to follow the player dynamically

  updateCamera();

​

  // Draw terrain and player

  drawTerrain();

  drawPlayer();

}

​

function generateWaves() {

  for (let y = 0; y < rows; y++) {

    for (let x = 0; x < cols; x++) {

      // Sinusoidal wave motion in both directions

      let distance = dist(x, y, cols / 2, rows / 2);

      let wave = sin((x + waveTime) * waveFrequency) * waveHeight +

                 cos((y + waveTime) * waveFrequency) * waveHeight;

​

      terrain[x][y] = wave; // Assign height to terrain

    }

  }

}

​

function handlePlayerPhysics() {

  // Determine the player's wave height at the current position

  let playerCol = floor((playerX + w / 2) / scl);

  let playerRow = floor((playerZ + h / 2) / scl);

​

  if (playerCol >= 0 && playerCol < cols && playerRow >= 0 && playerRow < rows) {

    let waveHeight = terrain[playerCol][playerRow];

    playerY = lerp(playerY, waveHeight, 0.1); // Smoothly match the wave height

  }

​

  // Apply horizontal and forward velocity

  playerX += velocityX;

  playerZ += velocityZ;

​

  // Constrain player to the terrain bounds

  playerX = constrain(playerX, -w / 2 + 50, w / 2 - 50);

  playerZ = constrain(playerZ, -h / 2 + 50, h / 2 - 50);

​

  // Add gravity-like effect (if jumping is added later)

  playerY += gravity;

}

​

function updateCamera() {

  // Position the camera dynamically to follow the player

  let cameraX = playerX;

  let cameraY = playerY - 100; // Keep the camera slightly above the player

  let cameraZ = playerZ + 300; // Follow behind the player

​

  camera(cameraX, cameraY, cameraZ, playerX, playerY, playerZ, 0, 1, 0);

}

​

function drawTerrain() {

  for (let y = 0; y < rows - 1; y++) {

    beginShape(TRIANGLE_STRIP);

    for (let x = 0; x < cols; x++) {

      let h1 = terrain[x][y];

      let h2 = terrain[x][y + 1];

​

      fill(0, 105, 180, 200); // Ocean blue

      stroke(0, 50, 100, 50);

​

      vertex(x * scl - w / 2, y * scl - h / 2, h1);

      vertex(x * scl - w / 2, (y + 1) * scl - h / 2, h2);

    }

    endShape();

  }

}

​

function drawPlayer() {

  push();

  translate(playerX, playerY - 20, playerZ); // Synchronize player with wave

  fill(255, 0, 0); // Red surfboard

  rotateX(PI / 8); // Slight tilt for realism

  box(30, 10, 5); // Simple surfboard

  pop();

}

​

function keyPressed() {

  if (keyCode === LEFT_ARROW) {

    velocityX = -2; // Move left

  } else if (keyCode === RIGHT_ARROW) {

    velocityX = 2; // Move right

  } else if (keyCode === UP_ARROW) {

    velocityZ -= 1; // Move forward faster

  } else if (keyCode === DOWN_ARROW) {

    velocityZ += 1; // Move backward slower

  }

}

​

function keyReleased() {

  // Stop horizontal movement when arrow keys are released

  if (keyCode === LEFT_ARROW || keyCode === RIGHT_ARROW) {

    velocityX = 0;

  }

}

​