x-webmidiとして公開していたPolymerのエレメントをES6 Modulesに変更しxwebmidi.jsとすることにました。
理由は簡単でHTML ImportがChromeから削除されてしまうからです。
コードはGitHubにあります。
xwebmidi.jsでできることは以下です。
- コンピュータに接続されているMIDIデバイスのリスト化
- 接続・切断したMIDIデバイスを自動でデバイスリストから追加・削除
- MIDI InputデバイスからのMIDIメッセージの受け取り
- MIDI OutputデバイスへのMIDIメッセージの送信
- MIDI Messageを自動でParse
まだあるかもしれませんが、これくらいが主な機能になります。
できる限り今までのx-webmidiと同じように簡単に実装できるようしています。詳細なREADMEを出来ていませんが、このHTML、JavaScriptを書くとブラウザ上に↑の機能を実装の土台ができあがります。
<html>
<head>
<link rel="stylesheet" href="./xwebmidi.css">
</head>
<body>
INPUT: <select id="midiin" class="xwebmidi-select-midi"></select>
<br>
OUTPUT: <select id="midiout" class="xwebmidi-select-midi"></select>
<script type="module">
import { xWebMIDI } from "./xwebmidi.js";
(async () => {
const xwm = new xWebMIDI();
await xwm.requestMIDIAccess(true);
xwm.initInput('midiin');
xwm.initOutput('midiout');
window.addEventListener('midiin-event:midiin', event => {
console.log(event.detail.data);
xwm.sendRawMessage(event.detail.data)
});
})();
</script>
</body>
</html>
ということで、快適なWeb Musicな生活を！！！