CoffeeScriptでカウントダウンタイマーを作ってみる

参考URLに記載されていたjsのカウントダウンタイマーをCoffeeScriptで書いてみました。

$ ->
  countDown()

padding = (num) ->
  num += ""
  if num.length is 1
    num = "0" + num
  return num;

countDown = ->
  target = new Date '2014-07-08 00:00:00'
  today = new Date
  diff = target - today
  daySec = 24 * 60 * 60 * 1000
  d = Math.floor (diff / daySec)
  h = Math.floor ((diff % daySec) / (60 * 60 * 1000))
  m = Math.floor ((diff % daySec) / (60 * 1000)) % 60
  s = Math.floor ((diff % daySec) / 1000) % 60 % 60
  mi = Math.floor ((diff % daySec) / 10) % 100
  if diff > 0
    $('#timer').text("#{d} #{padding(h)}:#{padding(m)}:#{padding(s)}:#{padding(mi)}")
  else
    $('#timer').text("end")
  setTimeout countDown, 10

最初、Dateクラスの引数に'YYYY-MM-dd'形式を渡すとChromeではうまく動きましたが、Safariでは動かない現象が起きました。

'YYYY-MM-dd'形式は公式サポートされていないようなので、Dateの引数は'YYYY/MM/dd'形式で渡すように修正しました。

参考URL

• [[jQuery] グルーポン系サイトでよく見掛けるカウントダウンタイマーのサンプルコード](http://codenote.net/javascript/jquery/458.html)
• JavaScriptで日付や時間の0詰めを実装する
• 今さらながらWebフォント「Google web fonts」の使い方・実装手順メモ
• Invalid date in safari