clock.coffee

# Via http://html5demos.com/svg-clock
# Usage:
#   new Clock()
class Clock
  SECONDS_HAND_SIZE = 0.95
  MINUTES_HAND_SIZE = 0.85
  HOURS_HAND_SIZE = 0.55
  CIRCLE_SELECTOR = "#circle"
  SECONDHAND_SELECTOR = "#secondhand"
  MINUTEHAND_SELECTOR = "#minutehand"
  HOURHAND_SELECTOR = "#hourhand"

  getRad = (degrees) ->
    adjust = Math.PI / 2
    (degrees * Math.PI / 180) - adjust

  getX = (degrees, r, adjust, x) ->
    x = x or r
    adj = adjust or 1
    x + r * adj * Math.cos(getRad(degrees))

  getY = (degrees, r, adjust, y) ->
    y = y or r
    adj = adjust or 1
    y + r * adj * Math.sin(getRad(degrees))

  drawHand = (hand, value, size, degrees) ->
    circle = $(CIRCLE_SELECTOR)[0]
    r = circle.getAttribute("r")
    cx = parseInt(circle.getAttribute("cx"))
    cy = parseInt(circle.getAttribute("cy"))

    deg = degrees * value
    x2 = getX(deg, r, size, cx)
    y2 = getY(deg, r, size, cy)

    hand.setAttribute "x1", cx
    hand.setAttribute "y1", cy
    hand.setAttribute "x2", x2
    hand.setAttribute "y2", y2

  drawHands = ->
    currentTime = new Date()
    drawHand $(SECONDHAND_SELECTOR)[0], currentTime.getSeconds(), SECONDS_HAND_SIZE, 6
    drawHand $(MINUTEHAND_SELECTOR)[0], currentTime.getMinutes(), MINUTES_HAND_SIZE, 6
    drawHand $(HOURHAND_SELECTOR)[0], currentTime.getHours(), HOURS_HAND_SIZE, 30

  constructor: ->
    setInterval drawHands, 1000