createCanvas(600, 600);

}

​

​

function draw() {

  background("#B7D9FF");

  noStroke();

  fill(0);

  var cx = width/2;

  var cy = height/2;

  var r = 300;

  //outer circle

  ellipse(cx,cy,r,r);

  var x = mouseX;

  var y = mouseY;

  var sr = 130;

  var ssr = 70;

  let px;

  let py;

  fill(255);

  var d = dist(x,y,cx,cy);

  var a = atan(abs((y-cy)/(x-cx)));

  if(d<ssr){

    px = x;

    py = y;

  }else if(x<=r && y<=r){

    px = cx-ssr*cos(a);

    py = cy-ssr*sin(a);

  }else if(x>r && y<=r){

    px = cx+ssr*cos(a);

    py = cy-ssr*sin(a);

  }else if(x<=r && y>r){

    px = cx-ssr*cos(a);

    py = cy+ssr*sin(a);

  }else{

    px = cx+ssr*cos(a);

    py = cy+ssr*sin(a);

  }

  //inner circle

  ellipse(px,py,sr,sr);

​

}