createCanvas(300, 300);

}

​

var a = 0;

function draw(){

  clear();

  a = (a + PI*0.01);

  noStroke();

  space();

  // draw moon either behind or infront planet

  if(cos(a)>0){

    planet();

    moon();

  } else {

    moon();

    planet();

  }

​

  moon2();

}

​

function moon(){

  x = sin(a) * 130 + 150;

  y = cos(a) * 20 + 150;

  fill(90,90,110);

​

  ellipse(x, y, 15, 15);

}

​

function moon2(){

  blendMode(LIGHTEST);

​

  b = a * 1.63;

  x = sin(b) * 40; 

  y = cos(b) * 80;

  coord = rotateXY(x,y,2.3);

  x = coord.x+150;

  y = coord.y+150;

  console.log(x)

  fill(50,140,150);

​

  ellipse(x, y, 10, 10);

}

​

function rotateXY(x,y, theta){

  return {

    x: x*cos(theta) - y*sin(theta),

    y: x*sin(theta) + y*cos(theta)

  };

}

​

function space(){

  fill(18,18,36);

  rect(0,0,300,300);

}

​

function planet(){

  blendMode(LIGHTEST);

  fill(30,90,140);

  ellipse(150,150, 50, 50);

  blendMode(DARKEST);

  fill(20,20,45);

  ellipse(135,140, 60, 60);

  blendMode(BLEND);

}