let height = 60

let space = 40

let r, b;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  r = random(0, 225);

  b = random(0, 225);

}

​

function generateEllipse(cx, cy, width, height, r, b) {

  push();

  stroke("green")

  strokeWeight(1);

  fill(r, 255, b);

  ellipse(cx, cy, width, height);

  pop();

}

​

function getHillHeight(x) {

  return windowHeight - cos(x/400) * windowHeight/2

}

​

function draw() {

  background(220);

​

  //make a hill

  for(let i = 0; i < windowWidth; i++) {

    circle(i, getHillHeight(i), 2)

    push();

    stroke("green");

    rect(i, getHillHeight(i), 2, windowHeight)

    pop();

  }

  //make caterpillar

  for(let i = 0; i < 10; i++) {

    let cx = (windowWidth - 50 - (i * space) + frameCount) % (windowWidth);

    let cy = (windowHeight - 50 - Math.max(sin(frameCount * 0.04 + i), 0) * 40 - getHillHeight(cx));

    let r1 = r + i*10;

    let b1 = b + i*10;

    generateEllipse(cx, cy, width, height, r1, b1);

    // add eyes and antennae

    if(i === 0) {

      push();

      fill("white");

      ellipse(cx + 10, cy - 10, 13, 15)

      fill("black");

      ellipse(cx + 13, cy - 7, 6, 6);

      noFill();

      strokeWeight(3)

      arc(cx + width/2 + 10, cy - width/2 , 70, 60, PI, PI + QUARTER_PI);

      arc(cx + width/2 + 20, cy - width/2 + 3, 70, 60, PI, PI + QUARTER_PI);

      pop();

    }

  }

  push()

  strokeWeight(width)

  stroke("wheat")

  noFill()

  rect(0, 0, windowWidth, windowHeight)

  pop()

}