var cd = 0.05;

var r = 100;

​

function setup() {

  createCanvas(400, 400);

​

}

​

function threePointArc(x1,y1, x2,y2, cx,cy, rm=1.125) {

 /* given a centre (cx, cy), 

    create the arc from (x1,x2) to (x2,x3)

    at radius dist ([x1,x2], [cx,cy]) 

*/

  A = createVector(x1,y1)

  B = createVector(x2,y2)

  C = createVector(cx,cy)

  R = C.dist(A)*rm;

  arc(cx, cy, 50, 50, 5, PI+QUARTER_PI, OPEN);

  // text(cx,cy)

}

​

function draw() {

  background(220);

  noFill();

  translate(200,200);

  m = createVector(mouseX-200, mouseY-200);

  c = createVector (cos(ct)*r, sin(ct)*r)

  circle(m.x, m.y,20);

  circle(c.x, c.y,20);

  fill(5);

  text( round(ct) , c.x , c.y)

  noFill();

  print(ct, c.y, c.y)

  circle(0,0, r*2); // circle() takes diameter

  m.normalize();

  // line(0,0, m.x*r, m.y*r)

  Ax = m.x/dist(m.x,m.y,0,0)*r

  Ay = m.y/dist(m.x,m.y,0,0)*r

  line(0,0,Ax,Ay);

  threePointArc(Ax,Ay, -Ax, -Ay, 0,0)

​

​

  ct += cd; if (ct > TWO_PI) {ct=0}

}