iCade 8-bittyとHTML5で作るゲームの話
iCade 8-Bitty買いました
iPhone,iPad,AndroidにBluetoothでつながるレトロなコントローラーです。 大量に買ってますが大量な事と今回の記事の関係はありません。
こちらから購入出来ます。
- 仕様(PDF注意) http://www.thinkgeek.com/files/iCADE/iCade_Dev_Resource_v1_3.pdf
- iOS SDK https://github.com/scarnie/iCade-iOS
さて、このiCadeですがBluetoothのキーボードとして接続され、キーコードが送られてきます。 UP,DOWNでそれぞれ別のキーコードが来ます。
- 上押す w 離す e
- 左押す a 離す q
- 下押す x 離す z
- 右押す d 離す c
- みたいな感じです
ネイティブアプリで使えるのは当然ですがブラウザ上で動くアプリの場合は使えるか検証してみました いつものここで対応と確認済みです。
PC
Chrome,Firefoxでは普通に使えます。 windowにkeydownイベントをlistenする事で問題なく使えます。
iOS
windowにはkeydownイベントは送られてきません。 < input type="text" >で作成したテキストフィールドにフォーカスがあればkeydownは来ますのでそこをlistenしましょう。 一応これで使えるのですが、テキストフィールドが表示されてしまっているのと、前後のテキストフィールド移動のバーが表示されるのが不格好。消し方知っている方いたら教えてください。
Android
ChromeでPCと同じように動いたけどそもそも動作が遅すぎるので検証は後回しで。。
まとめ
PCでは全く問題なく使える。iOSでは若干の不格好さがある。WebViewを内蔵したネイティブアプリ化なども考えた方がいいかもしれない。
GitHubのPull Requestを頂いた話
以前も書いたとおりこちらでHTML5のゲームの開発を行っています
この度、原作者さんからプルリクエスト頂きまして見た目の強化とゲーム部分の調整が行われました
頂いたプルリクはこちら
見やすいですねぇ。 そして嬉しい！
趣味プロ（趣味プログラミング）の最大のハードルであるモチベーション維持を誰かからのプルリクとかFollowとかIssueとかでなんとか出来そうな気になってきます。 誰かに見てもらってる感重要。
コラボレーションが手軽に出来る GitHub は本当にすばらしいツールだと思います。 既存のツールの組み合わせでもなんとかなったんでしょうけど、この手軽さは圧倒的。 タスクを管理するIssues、ドキュメント管理用のWiki、公開用のPagesと揃っているので趣味プロ（趣味プログラミング）やるのはもうコレで一通り足りてしまいます。
gitに慣れる手間はありますが、得られるモノは本当に大きい。よくメリットわからなくてもとりあえず触っといた方がいいんじゃないですかね！ 業務でも大変便利なんで導入してない会社はとっとと導入した方がいいんじゃないですかね！
HTML5 GamePad APIについて
はじめに
HTML5！なんでも出来る！みたいな話がありますが、ゲームパッド(ジョイスティック)対応もなしに何言ってるの君？と思ってたのですが、GamePad APIがきちんとありました。
こちらを見れば概要と動作確認が出来ます。
が、コレがすんなり使える状況では無かったのでまとめをしときます。2013/02/02現在。
対応ブラウザ
- Google Chrome(最近のは対応してます)
- FirefoxのGamePad API対応のスペシャルビルド
対応ゲームパッド
対応ゲームパッドがなんとOSによって違います
- Windows(Windows7で検証)
- XInput準拠のゲームパッド
- Xbox 360 コントローラー など極一部のみ対応
- XInput準拠のゲームパッド
- OS X(10.8.2で検証)
- USB接続のXInput対応より前のゲームパッド
- かなり最近のパッド以外は基本的にこちらです
- iBUFFALO USBゲームパッド 8ボタン スーパーファミコン風 グレー BSGP801GY など
- 普通のゲームパッドなら大体OKだと思われます
- USB接続のXInput対応より前のゲームパッド
入力IF・ボタン数のちがい
アナログスティックのあるなし、ボタン数の違いはもちろん、十字キーがボタン(buttons)で来るパッドとアナログ入力(axes)で来るパッドがあります。
その他
パッドの2本同時接続が可能なことは確認済みです。 マルチプレイヤーゲームが作れるのはパッド対応の大きなメリットですね。
まとめ
Chromeを使ってて、Windowsの人はXInput対応、Macの人は普通のゲームパッドがあれば利用出来る。ということになります。。
Windows上で持ってる人が少ないと思われるXInputのパッドを要求するのが痛い。 キーコンフィグも作らないと実際のゲームで運用するのは無理。と、現状、簡単・便利に〜という状況にはありません。ですがゲームパッドは人類にとって必要なデバイスなので力強く後押ししていきたいと思います。
GitHub Pageでgit submoduleを使ってはまった話
前提
以下ページにHTML5でかかれたゲームを設置したい
このゲームは以下リポジトリで管理されており、さらにasync.jsというライブラリに依存している
- https://github.com/haneda3/inovation5
- async.jsはgit submoduleで参照している
失敗
- haneda3.github.comを管理するリポジトリに git submoduleでinovation5を追加
haneda3.github.com(master branch) repo
|-inovation5 submodule
|-async.js submodule
- 以下の説明を読む限り、git://で privateじゃなければ行けそうなんだけどダメ。
- たぶん submoduleの入れ子がダメ。async.js submoduleが解決されていない。
成功
- haneda3.github.comのリポジトリは利用せず、inovation5のgh-pagesブランチを利用する
- gh-pagesブランチを利用すると失敗例と同等のURLにアクセス可能
inovation5(gh-pages branch) |-async.js submodule
まとめ
- GitHub Pageはgit submoduleに対応はしているけど、1階層のみ。submoduleのsubmoduleは取得できない
- gh-pagesブランチの仕様がきもいからと言って使わないのはよくない。使いましょう！
Wii UのWebブラウザでのGamePadのボタン入力 イベント編
前回
Wii UのWebブラウザのGamePad ボタン入力の制限 - haneda point
preventDefaultを使えばBボタンが取れるという怪情報が舞い込んできたので確認してみました。
そもそも仕様ではポーリングでしかボタン入力取れないように見える…
一応onkeydownが来てないか確認したら、ばっちり来てました。
window.onkeydownで 十字キーとAボタンの押下は取得出来ます。
他はダメ。うーん、せめてもう1ボタン…
それ以上使いたい場合ポーリング必須みたいです。
Wii UのWebブラウザのGamePad ボタン入力の制限
そこそこのスピードで動く、HTML5、JavaScriptでGamePadのスティック・タッチパネル・ボタン入力が取れるとのことで十字キー大好きな人はテンション上がってきますよね。
仕様はこちら
http://www.nintendo.co.jp/wiiu/hardware/features/internetbrowser/index.html
こちらのサイトの方が、すでに動くモノを作っていらっしゃいました。
http://makimo.to/Maryo/
https://github.com/segabito/SuperMaryoWorld-for-WiiU
なんで+と-のボタン使うのかなーと思ったら、主要なキーはWebブラウザ機能に割り当てられてしまってるんですね。（押したのは検知出来るが、割り当て済みの機能が起動してしまう）
ではフルスクリーンにすれば解決と思いましたが、HTML5 の FullScreenAPIも非対応。
現時点では割り当てのあるボタンは使わないという対処しかできませんね。。
結論として以下のボタンのみ自作アプリからは利用可能です
- 拡大縮小の + -
- 決定の A
- 先へ進む R
- TVとの切り換えを捨てるなら Y
十字キーとアナログスティック二つ、タッチパネルは自由に利用出来ます。
せっかくの魅力的なプラットフォームですし
FullScreenAPIに対応して、全ボタン使えるようにして欲しいです。
