2015.09.06 更新
Control Changeの送信やチャンネル指定が可能になりました。従来通り手抜きな使い方も相変わらずできますｗ
また、Meteorのパッケージにも登録しました。tadfmac/poormidi
という変更にあわせ、記事更新しました。
「ち〜ん」を公開して後に引けなくなったので、今までサボってたJavaScript側のコード見直しをはじめた。
とにかく、いろいろヒドくて先は長そうなのだが、手始めに簡単そうなMIDI周りを切り出してみた。
これを使えば、かなり簡単にWeb MIDI APIを触ってみることができると思う。
「ち〜ん」みたいな単純なことしか出来ないけどw
リポジトリ
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 最新版では不要になりました）chrome://flags/#enable-web-midiと入力して、Web MIDI APIを有効にしてください。
初期化
<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);
注意
var midi = new poormidi();
midi.sendNoteOn(40);
と書いてもノートオンは送れません。
new poormidi()の内部で呼び出しているnavigator.requestMIDIAccess()の成功時に呼び出されるsuccess callbackの処理が非同期となるためです。
しばらく待ってからmidi.sendNoteOn()を呼び出すようお願いします。
というわけで
Web MIDI APIで遊ぼう！