​

function setup() {

  createCanvas(400, 400);

  p = createP('p-text')

}

​

function draw() {

  background(bgColor);  

  c_color = color(circleColor)

  push()

    noFill()

  translate(300,60)

    stroke(c_color)

    circle(0,0,size)  

    if(lastLoop%2===0){

      lastLoop = parseInt(angle/PI)

      strokeWeight(dot_size);

      point(cos(angle)*size/2, sin(angle)*size/2);  

    }      

  pop()  

  createCircle(180,60,true,lastLoop%2===0)

​

   push()

    translate(240,60)

    noFill()     

     stroke(c_color)

     circle(0,0,size)

    if(lastLoop%2===1){      

      strokeWeight(dot_size);

      point(cos(-angle+PI)*size/2, sin(-angle+PI)*size/2);  

    }      

  pop()

  angle+=speed

  lastLoop = parseInt(angle/PI)

  p.elt.innerText=`angle:${angle.toFixed(2)} invert:${(angle%PI).toFixed(2)} loop1:${(angle/PI).toFixed(2)} lastLoop:${lastLoop} `

}

​

​

​

​

function createCircle(x,y,foward,showDot){

  push()

  translate(x, y)

  noFill()  

  stroke(c_color)

  circle(0,0,size)

  if(showDot)

    strokeWeight(dot_size);

  if(!foward)

    point(cos(-angle+PI)*size/2, sin(-angle+PI)*size/2); 

  else

      point(cos(angle)*size/2, sin(angle)*size/2);   

  pop()

}

​

​

​

​

​