let terrain = [];

​

let scl = 20; 

let w = 700;

let h = 800; 

let flying = 0;

​

let angle = 0; 

let angleSpeed = -0.014;

​

function setup() {

  createCanvas(800, 800, WEBGL);

​

  cols = w / scl;

  rows = h / scl;

​

  // Initialize the terrain array

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

    terrain[x] = [];

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

      terrain[x][y] = 0;

    }

  }

}

​

​

function draw() {

  background('#1e1e24');

  noFill();

​

  // Move the terrain to create animation

  flying -= 0.008;

​

  let yoff = flying;

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

    let xoff = 0;

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

      terrain[x][y] = map(noise(xoff, yoff), 0, 1, -100, 100); 

      xoff += 0.1;

    }

    yoff += 0.1;

  }

​

  // Modify sine wave to linger at peaks using a smooth easing function

  let rawSin = sin(frameCount * angleSpeed);

  let easedSin = 0.5 * (1 - cos(PI * (0.5 + rawSin * 0.5)));

​

  // Map eased sine to angles

  angle = -map(easedSin, 0, 1, PI / 1.8, PI);

​

  // Translate and rotate for proper centering

  translate(0, 50, -400);

  rotateX(angle);

  translate(-w / 2, -h / 2);

​

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

    // Closer rows have higher factor and therefore lower alpha

    let distanceFactor = map(y, 0, rows - 1, 1, 0);

    let alphaFactor = map(easedSin, 0, 0.1, 225, 255);

    let alpha = distanceFactor * alphaFactor;

​

    stroke(243, 233, 210, alpha);

    strokeWeight(2);

    beginShape();

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

      vertex(x * scl, y * scl, terrain[x][y]);

    }

    endShape();

  }

}

​

​

​