var speed =(1);

let value = "blue";

​

function setup() {

  createCanvas(400, 400);

  background('pink');

​

}

​

function draw() {

  background(245,192,252,35)

  //push();

  ellipseMode(CENTER);

  xpos = xpos + speed;

  if ((xpos > width-100) || (xpos < 100)) {

  speed = speed * -1;

}

​

  const dim = Math.min(width, height);

  const time = millis() / 1000;

  const speed2 = 0.25;

  const angle = time * PI * 2.0 * speed2;

  const cx = width / 2;

  const cy = height / 2;

​

  const u = Math.cos(angle);

  const v = Math.sin(angle);

​

  const radius = dim * 0.25;

  const px = cx + u * radius;

  const py = cy + v * radius;

​

  const r = dim * 0.1;

​

  fill(value);

  strokeWeight(5);

  stroke('black')

  ellipse(mouseX,px, py,mouseY, 200, 150);

  fill(value);

  strokeWeight(5);

  stroke(0);

  ellipse(height/2, xpos, 100, 100);

  fill('white');

  noStroke();

  ellipse(height/2, xpos, 50, 50);

  fill('black');

  noStroke();

  ellipse(height/2, xpos, 25, 25);

}

​

​

function mouseClicked() {

  if (value === "blue") {

    value = "#BAE1EA";

  } else {

    value = "blue";

  }

}