hello-world.jp.net
webエンジニアのメモ。とりあえずやってみる。

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


Related #CoffeeScript

[rails]erbとunderscore.jsを一緒に使ったらundefined local variables in templatesエラーが発生

erbのテンプレート内にunderscore.js用のテンプレートを記述していたら

CoffeeScript メモ その1

『 CoffeeScriptファーストガイド』を読んでのメモ その1。