Hatena::ブログ(Diary)

ursmの日記

2008-12-07

SproutCore で LT タイマーを作った

オブラブ忘年会で使ったタイマーです。最初は有り物で良いかと考えていたのですが、無性に作りたくなったので作りました。忘年会仕様ということで除夜の鐘カウンタを備えています。

デモはこちら。スペースでスタート/ポーズ、R でリセット、P で制限時間 (ms) の設定です。

http://watch-night.ursm.jp/

ソースを Bitbucket に置きました。煮るなり焼くなり好きにしてください。

http://www.bitbucket.org/ursm/watch-night/

kakutani.com の人から「GitHub に置いた方が良いよ」と言われてしまったのでこっちにも置いておきます。

http://github.com/ursm/watch-night/tree/master

メインとなるファイルは以下の5つです。

clients/watch_night/main.js
キーハンドラを定義してるところ
clients/watch_night/controller/timer.js
コントローラ
clients/watch_night/views/bell_count.js
108 までカウントアップするビュー
clients/watch_night/views/remaining_time.js
残り時間を表示するビュー
clients/watch_night/english.lproj/body.haml
ビューを呼び出してるところ

コントローラのプロパティが変化すると、そこにバインディングしたビューが自動的に自身の表示を更新します。もう DOM をゴリゴリ操作しなくて良いんです。SproutCore ヤバイ!

…というようなことを空気読まずに RejectTalks で話そうとしたのですが、時間が足りませんでした。

追記

重要な事を忘れていました。このタイマー、Firefox で動作させるとなぜか徐々に遅れていきます。Safari だと大丈夫です。ふしぎですね。