2013年6月8日土曜日

リバーシ for 3DS を公開

Nintendo 3DS のウェブブラウザで遊べるリバーシを公開しました。

公式サイト: http://yokano.github.io/reversi3ds/
アプリ本体: http://okanoworld.appspot.com/reversi3ds
(アプリは 3ds のウェブブラウザ専用です)

MITライセンスです。公式サイトからソースコードが落とせます。

3DSのWebブラウザ上で動きます

十字キーとAボタンで操作出来ます


ウェブアプリですが、十字キーとAボタンで遊べます。
もちろんタッチペンでも操作出来ます。
CPU と対戦することができます。1台で2人対戦することもできます。
2人対戦はタッチペンが2本あるとやりやすいかも。

十字キーの上下で画面がスクロールされないようにコンテンツを下画面にフィットさせています。(320x212px)
イベントのコールバック中に return false; しても、
preventDefault() してもイベントがキャンセルできないため、
コンテンツを2画面に広げてしまうと十字キーの上下でスクロールが発生してしまいます。
2画面で十字キーの上下を使えれば理想なのですが・・・。

Canvas は使わず DOM で動作しています。
アニメーションはスプライトを作成して、CSS の background-position を操作しています。
3ds は @keyframe にも対応しているのですが、step() を指定できずパラパラアニメができません。
結局、JavaScript から定期的に background-position を操作しています。
アニメはすべて CSS でやりたいのですが、良い方法が無いものか・・・。

0 件のコメント:

コメントを投稿