Adventします

Tech

この記事はCPS Lab(ラボライフ！) Advent Calendar 2014 - Adventarの7日目の記事です。

6日目: 今期アニメを様々な方法で評価してみたvol.1（Facebook）

8日目: ネイティブアプリケーションを作りたい自分がサーバーサイドの勉強をする - hogeblog


すいません、今更気づきました。（しのっち先輩ありがとうございます）

皆さん、いつもお世話になっています。keiseiです。


今年の春休みにJavaScriptとCSSの練習でつくった地元の駅の発車標アプリのDepartureBoardを紹介させて頂きたいと思います

DepartureBoard
http://miraitoarumachi.com/DepartureBoard/DepartureBoard.html

f:id:keisei_1092:20141208024058p:plain

確認済み環境はApple Safariになります。MacでもiDeviceでもなんとかなると思います。

電車が好きで、特に駅が好きなので、発車標をデスクトップのガジェットみたいにできれば楽しいんじゃないかと思い、MacのDashboardに常駐させようとWebで動く前提で作りました。
動いた状態は上記のリンクの通りとなります。現在の時間を取ってきて一番近い電車、下りはテロップ表示の関係で1本、上りは常時2本表示してあります。
土日祝日にも対応しています。表示する情報はJR常磐線 神立駅の駅構内にあるものを参考にしています。

実装の詳細
・時刻表、編成、のりば、行き先は手打ち（JavaScriptの配列
・見た目は全部CSS（手打ち）
・現在時刻持ってきてまず時で探索した後、分が一番近くて到着前のものを表示
・60秒毎にブラウザを更新
・1番線はテロップを常に流す

今後やりたいこと
・フォントを本物そっくり（LED）にする
・時刻表データを外部化（じぇいそん）
⇒というかえきから時刻表から持ってこれたら最高だとおもう
・デザインを自由に変えられるようにする（JR、メトロ、大手私鉄はサポートしたい）
・デザインショップ（公開スキンとして自由に設定できるように）
・テロップをｎ（整数）分毎に流すような設定に、色も変えたい
・「電車がまいります」テロップ、ATOS接近音、発車メロディなど音も実装したい
・Twitter連携とか？（適当に言った感）
・ｇｉｔｈｕｂ



鉄な人にはウケる内容だと自負しているので、また暇なときに開発進めたいと思います。


それでは(╹◡╹)