アホみたいなWeb MIDI APIのラッパー

2015.09.06 更新
Control Changeの送信やチャンネル指定が可能になりました。従来通り手抜きな使い方も相変わらずできますｗ
また、Meteorのパッケージにも登録しました。tadfmac/poormidi
という変更にあわせ、記事更新しました。

「ち〜ん」を公開して後に引けなくなったので、今までサボってたJavaScript側のコード見直しをはじめた。
とにかく、いろいろヒドくて先は長そうなのだが、手始めに簡単そうなMIDI周りを切り出してみた。
これを使えば、かなり簡単にWeb MIDI APIを触ってみることができると思う。
「ち〜ん」みたいな単純なことしか出来ないけどw

リポジトリ

poormidi

Meteor

Meteorパッケージ化しました。
下記コマンドでインストールできます。

$ meteor add tadfmac:poormidi

特長

• Note On, Note Off, Control Changeの送信に対応
• パラメータが省略しまくれる。MIDIチャンネルすら省略可能
• MIDIデバイスの選択機能が無い。すべてのデバイスから受信、すべてのデバイスへ送信

使い方

動作環境

Web MIDI APIのラッパーですので、Web MIDI APIをサポートするブラウザでのみ動作します。
2015.09.06現在、下記ブラウザで動作します。

• Google Chrome の最新版 (Mac版、Windows版、Android版）※Linux版も対応してそうですが未確認
• Opera の最新版（Mac版）※Windows版にも対応してそう。

準備

Google Chromeのアドレスバーにchrome://flags/#enable-web-midiと入力して、Web MIDI APIを有効にしてください。 （Chrome 最新版では不要になりました）

初期化

index.html

<script src="poormidi.js"></script>

var midi = new poormidi();

MIDI INを受ける

midi.setHandler(onMIDIEvent);

function onMIDIEvent(e){
  var message = e.data[0] & 0xf0;
  if(message === 0x90){  // Note ON?
    // 好きな処理
  }
}

Note On送信

チャンネル1固定で送るには下記のように書きます。

// Note No.= 40, Velocity = 127
midi.sendNoteOn(40,127);

ベロシティすら省略可能ｗ
※省略すると100固定になります。

// Note No.= 40, Velocity = 100
midi.sendNoteOn(40);

チャンネル指定も出来ます。
1～16を 0～15で指定します。

// CH.1 Note No.= 40, Velocity = 80
midi.sendNoteOn(0,40,80);

Note Off送信

チャンネル1固定の場合。

// Note No.= 40
midi.sendNoteOff(40);

チャンネル指定も出来ます。
1～16を 0～15で指定します。

// CH.1 Note No.= 40
midi.sendNoteOff(0,40);

Control Change送信

チャンネル1固定の場合。

// Control No.= 40, Control Value = 10
midi.sendCtlChange(40,10);

チャンネル指定も出来ます。
1～16を 0～15で指定します。

// CH.10 Control No.= 40, Control Value = 10
midi.sendCtlChange(9,40,10);

~~### プラグアンドプレイ対応（途中で刺したMIDIデバイスを認識させる）~~~

~~```js
setInterval(function(){
midi.refreshPorts();
},4000);

### 注意

```js
var midi = new poormidi();
midi.sendNoteOn(40);

と書いてもノートオンは送れません。
new poormidi()の内部で呼び出しているnavigator.requestMIDIAccess()の成功時に呼び出されるsuccess callbackの処理が非同期となるためです。
しばらく待ってからmidi.sendNoteOn()を呼び出すようお願いします。

というわけで

Web MIDI APIで遊ぼう！

参考