Firefox OS って?
Firefoxといえばブラウザですが、
最近KDDIがFx0の販売を始めたように、Firefox OSについても注目され始めています。
HTML5基盤に開発されている, スマートフォン用のOSで
HTML,CSS,Javascriptなどの汎用的な言語でアプリをなどを開発することができます。
iOSやAndroidのように、それ用の言語を覚える必要なくアプリが作れちゃいます。
（簡単なホームページが作れれば、アプリも作れる...!
公式サイトは以下
Mozila
アプリを作る
Flappy Birdのつくり方自体は調べてもらえば、いろいろ載っているので、
ある意味、本題のような感じです。
開発者用のFirefox ブラウザ を使うと楽です。
作成手順
WebIDEのボタンを押すと、新規ウィンドウが開きます。
プロジェクト ＞ 新しいアプリ と進むと、また新規ウィンドウが開きます。
一番上の簡単なテンプレートを選択し、プロジェクト名を入れます。
今回はsampleとしました。
既存のフォルダを開かずに進むと雛形ができます。
これがアプリの設定ファイルです。
manifest.webapp
画像が小さいですが、、、
ここのlaunch_pathに指定したファイルが起動時に開かれます。（ここではindex.html）
マニュフェストファイルについては
こちら
エミュレーターを使う
実際にFirefox OSのエミュレーターで動かすことも出来ます。
右上のランタイムを選択のところから、エミュレーターをインストールして真ん中の再生ボタンを押します。
エミュレーター起動時
試しに、雛形アプリを動かして見ると
となります。
特別なのはmanifest.webappくらいでしょうか。
※実際のソースは一番下に貼ってあります。
tmlib.js
ゲーム開発用のjsライブラリです。
今回はこれを使用して、Flappy Birdを作成します。
簡単なゲームに必要であるだろう機能はとりあえず揃っているので、ドキュメントのサンプルをいじりながら作って行きます。
※tmlib.jsの情報はgoogle先生に聞くと、いろいろと出てくるのですがバージョンの違い等で動かないケースが多々ありますので、お気をつけください。それもまとめろよ！っていうのは次回以降に持ち越しで...
実際に作ったアプリ
今回はクローンアプリと言う事で本家と全く同じモノを作るのではなく、
ちょっとアレンジしています！
※登場するキャラクターは実在の人物に基づいています。
そして作ったのがこれ、 ゲーム画面はこんな感じ
ロード画面はこんな感じ
このロード画面をカスタマイズするのに手こずりました...
公開、ソース
まだFirefox Marketplaceには申請を出しておらず、
→ 申請したら通ってしまいました！https://marketplace.firefox.com/app/flappy?src=new
現状はKDDIが提供しているCreator Showcaseでのみ公開しております。
（こちらからダウンロード、インストール出来ます！！
ソースもGithubに公開しています。リポジトリ
- ツッコミ、ご意見、感想などなどありましたら、コメントにお願い致します。