let secondsRadius;

let minutesRadius;

let hoursRadius;

let clockDiameter;

​

function setup() {

  createCanvas(600, 600);

  stroke(255);

​

  let radius = min(width, height) / 2;

  secondsRadius = radius * 0.1;

  minutesRadius = radius * 1.3;

  hoursRadius = radius * 0.4;

  clockDiameter = radius * 1.7;

​

  cx = width / 2;

  cy = height / 2;

}

​

function draw() {

  background(230);

​

​

  noStroke();

  ellipse(cx, cy, clockDiameter + 25, clockDiameter + 25);

  fill(200);

  ellipse(cx, cy, clockDiameter, clockDiameter);

​

​

  let s = map(second(), 0, 60, 0, TWO_PI) - HALF_PI;

  let m = map(minute() + norm(second(), 0, 60), 0, 60, 0, TWO_PI) - HALF_PI;

  let h = map(hour() + norm(minute(), 0, 60), 0, 24, 0, TWO_PI * 2) - HALF_PI;

​

  // Draw the hands of the clock

  stroke(240,140,170)

  strokeWeight(1);

  noStroke()

  fill(0,0,0)

  ellipse(300,300,500)

  noStroke()

  fill(100,50,200)

   ellipse(cx, cy, cx + cos(m) * minutesRadius, cy + sin(m) * minutesRadius);

  noStroke()

  fill(200,40,40)

  ellipse(cx, cy, cx + cos(h) * hoursRadius, cy + sin(h) * hoursRadius);

  fill(230,170,50)

  noStroke()

ellipse(cx, cy, cx + cos(s) * secondsRadius, cy + sin(s) * secondsRadius);

​

  strokeWeight(2);

  beginShape(POINTS);

  for (let a = 0; a < 360; a += 6) {

    let angle = radians(a);

    let x = cx + cos(angle) * secondsRadius;

    let y = cy + sin(angle) * secondsRadius;

    vertex(x, y);

  }

  endShape();

}

​

//not completely wrritten by me 

​