digital for humanlife.

powered by PROMINENCE.tv

JavaScriptでゲームパッド

もともとは「GamePad API」としてW3Cが制定しているものだが、なぜかブラウザー毎に実装がマチマチで、これまたブラウザー毎に処理を分けないといけない。
そして、2014年現在は、Chrome37と、Firefox31でしかゲームパッドは使用出来ない(SafariIEでは未実装)。

なので、実行しているブラウザを自動判別し、ChromeFirefoxの両方でほぼ同じデータの取れるものだけを配列で返すライブラリを作ってみた。

 

両方のブラウザでほぼ同じデータが取れるものは下記になる。

f:id:digitarhythm:20140830224336p:plain

 

ボタン1〜4に関しては各ゲームパッドによって違いはあるが、ボタンが4つあればボタン1〜4になっていると思われる。

ボタン5と6は、人差し指で押すボタンが返ってくる。
垂直軸と水平軸は−1、0、1の3つの値を返す。

さらに、Xbox360コントローラーでは2つのアナログスティックの値を−1〜1の範囲で返すようにしている。

しかし、アナログスティック1の値は垂直軸、水平軸の値とリンクしているので、アナログスティック1の値が振り切る(1、もしくは-1になる)と、十字キーを押したのと同じ状態になる。

Xbox360ではボタンは16個あるのだが、ファミコンもどきコントローラーとXbox360コントローラーで同じような値を返すのがボタン1〜6までなので、このライブラリではボタン6までしか値を返さない。

Xbox360コントローラーでは十字キーの値はボタンとして返ってくるのだが、ライブラリのほうで水平軸、垂直軸の値として返るように違いを吸収している。

 

ライブラリはgithubにあるので、普通にクローンすると使えるようになる。

 

digitarhythm/gamepadprocedure · GitHub

 

ファイル自体はCoffeeScriptなので使用する時はコンパイルしてご使用ください。

 

コンパイルしたファイル「gamepadprocedure.js」を読み込むと、「gamepadProcedure()」という関数が使用出来るようになるので、ゲームなどのループ処理内でこれを呼ぶことでゲームパッドの状態が配列として返ってくる。

SafariIEの場合は空の配列が返される。

 

GAMEPADINFO = gamepadProcedure()

 

上記のようにした場合、ゲームパッドがひとつの場合はGAMEPADINFO[0]ゲームパッド情報が格納されている(ゲームパッド番号=0)。

  • GAMEPADINFO[0].padbuttons
  • GAMEPADINFO[0].padaxes
  • GAMEPADINFO[0].analogstick

上記3つのオブジェクトはさらに配列になっていて、GAMEPADINFO[0].padbuttons[0]〜[5]にボタン情報が入っている。

GAMEPADINFO[0].padaxes[0]には、十字キーの水平軸情報が入っている(-1、0、1)。

GAMEPADINFO[0].padaxes[1]には、十字キーの垂直軸情報が入っている(-1、0、1)。

GAMEPADINFO[0].analogstick[0]には、アナログスティック1の情報が配列として入っている。

GAMEPADINFO[0].analogstick[0][0]には、アナログスティック1の水平軸情報が入っている(-1〜1)。

GAMEPADINFO[0].analogstick[0][1]には、アナログスティック1の垂直軸情報が入っている(-1〜1)。

GAMEPADINFO[0].analogstick[1]には、アナログスティック2の情報が配列として入っている。

GAMEPADINFO[0].analogstick[1][0]には、アナログスティック2の水平軸情報が入っている(-1〜1)。

GAMEPADINFO[0].analogstick[1][1]には、アナログスティック2の垂直軸情報が入っている(-1〜1)。

 

ChromeFirefoxではコントローラーの認識されるタイミングが違う。

FirefoxではファミコンもどきコントローラーでもXbox360コントローラーでも、Webアプリを起動した時には認識しておらず、ゲームパッドをなにかしら操作した時に認識される。

しかし、ChromeはどちらのゲームパッドでもWeb起動時に認識している。

動作的にはChromeのほうが好ましいのだが、一回認識してしまうとその後にUSBコネクタを何回抜き差ししても、最初に認識したゲームパッド番号がリセットされない。

例えば、Xbox360コントローラーを挿した状態でWebアプリを実行するとXbox360コントローラーがゲームパッド番号0として認識される。

その後にXbox360コントローラーを抜いてからファミコンもどきコントローラーを挿しても、ファミコンもどきコントローラーはゲームパッド番号1となりChromeを再起動するまでこの情報はリセットされない。

どちらにせよ、今の状態では複数ゲームパッドを使用したり、ゲームパッドの抜き差しなどはオススメしない。