void setup()
{
  size(500, 500);
  colorMode(HSB);
  background(0);
  frameRate(30);
  surface.setResizable(true);
}


void draw()
{
  float h, m, s;
  float radius;
  float cx, cy;
  
  float clockface;
  float hoursRadius, minutesRadius, secondsRadius;
  float minuteDotSize, hourDotSize;
  
  String months[] = {"XXX", "Jan", "Feb", "Mar", "Apr"};

  radius = min(height, width)/2.0;
  cx = width/2.0;
  cy = height/2.0;
 
  clockface = radius*0.9;
  hoursRadius = radius*0.50;
  minutesRadius = radius*0.65;
  secondsRadius = radius*0.72;
  minuteDotSize = radius*0.015;
  hourDotSize = radius*0.03;
  
  // get time
  s = second();
  m = minute();
  h = hour()%12;
  
  // display time
  // draw clock face
  fill(128);
  noStroke();
  ellipseMode(RADIUS);
  ellipse(cx, cy, clockface, clockface);
  
  // draw Howdy in the middle of everything as an example
  textSize(150);
  fill(0, 255, 255);
  textAlign(LEFT, TOP);
  text(months[1+3], cx, cy);
  
  // draw the ticks
  for (float pos=0; pos<60; pos+=1) {
    if (pos%5==0) {
     drawTick(cx, cy, pos*6, secondsRadius, hourDotSize);
    }
    else {
     drawTick(cx, cy, pos*6, secondsRadius, minuteDotSize);
    }
  }
  
  // draw the hands
  drawHand(cx, cy, s*6, secondsRadius, 1);
  drawHand(cx, cy, m*6, minutesRadius, 2);
  drawHand(cx, cy, h*30, hoursRadius, 4);
}


float handPos(float angle)
{
  return radians(angle-90);
}


color colorPos(float angle)
{
  return color(map(angle, 0, 360, 0, 255), 255, 255);
}


void drawHand(float cx, float cy, float angle, float len, float weight)
{
  stroke(colorPos(angle));
  strokeWeight(weight);
  line(cx, cy, cx + cos(handPos(angle))*len, cy + sin(handPos(angle))*len);
}


void drawTick(float cx, float cy, float angle, float len, float size)
{
  fill(colorPos(angle));
  noStroke();
  rectMode(CENTER);
  rect(cx + cos(handPos(angle))*len, cy + sin(handPos(angle))*len, size, size);
}