let backgroundColor; 

let circleErased; 

let star1x, star1y, star2x, star2y;

let star1Fade, star2Fade;

let fadeRate;

let moonx, moony; 

​

function setup() {

  createCanvas(400,400);

  circleErased = false;

  star1Fade = -5;

  star2Fade = -5;

  fadeRate = 20;

  moonx = width/2;

  moony = height; 

}

​

function draw() {

    if (mouseY < 50) {

    interpVal = 0;

  } else {

    interpVal = map(mouseY, 100, 400, 0, 1);

  }

//sun shape

  fill(255, 204, 0);

  noStroke();

//Sunset

  if(circleErased === false) {

    backgroundColor = lerpColor(color(178, 154, 231), color(29, 41, 81), interpVal);

    background(backgroundColor);

    circle(width*0.6, mouseY, 80);

    noStroke();

    mountain(); 

  }

  else{

    //backgroundcolor = color(29,41,81);

  }

  if(mouseY > 400) {

    clear();

    circleErased = true;

    backgroundColor = color(29, 41, 81);

    background(backgroundColor);

    mountain();

  }

  else{

  }

//night with stars and moon

  if(circleErased === true){

    clear(); 

    backgroundColor = color(29, 41, 81);

    background(backgroundColor);

    mountain();

    stars();

    moon();

  }

//mountains and water shape

  function mountain(){

  //MOUNTAIN CENTER

    c = color(61, 41, 28);

    fill(c);

    triangle(350, 220, 600, 370, 130, 370);

//MOUNTAIN LEFT

    c = color(81, 47, 25);

    fill(c);

    triangle(150, 215, 500, 400, -150, 400);

//MOUNTAIN RIGHT

    c = color(102, 52, 20);

    fill(c);

    triangle(600, 200, 930, 400, 300, 400);

  }

//blinking stars

   function stars() {

    if(star1Fade < 0){

      //create a new star with a new fade

      star1x = random(width);

      star1y = random(height*0.5);

      star1Fade = 255;

    }

    if(star2Fade < 0){

      //create a new star with a new fade

      star2x = random(width);

      star2y = random(height*0.5);

      star2Fade = 255 - random(5,20);

    }

    push();

    fill(255, star1Fade);

    ellipse(star1x, star1y, 4);

    fill(255, star2Fade);

    ellipse(star2x, star2y, 8);

    star1Fade -= fadeRate; 

    star2Fade -= fadeRate;

    pop();

  }

​

//moon rising

  function moon(){

  noFill();

  stroke(255, 212, 0);

  strokeWeight(15);

  translate(200, 200);

  rotate(HALF_PI);

  arc(moony-100, moonx-100, 80, 80, 0, PI);

  moony = moony-1;

  if(moonx<0){ 

    moonx=width/2;

  }   

  } 

}

​