私は、Tone.js を利用した小さな Web アプリを作成して、ピアノをキーで演奏できるようにトレーニングしています (途中で他の演習も行う可能性があります)。これまでのところ、ルート ノートとスケール タイプを選択して再生をクリックすると、そのスケールがループします。また、tone.js の例の 1 つから取ったキーボード/シンセもあり、ピアノのキーをクリックしたり、クエリ キーボードのキーを使用したり、コンピューターに接続された MIDI キーボードを選択してサウンドを使用および再生したりできます。
私がやろうとしている次のステップは、スケール内のノートが演奏されたときに緑色に点灯し、スケール外のノートが演奏されたときに赤色に点灯するバーを作成し、連続していくつのノートが正しく演奏されたかを記録することです。そんな感じ。私が直面している問題は、tone.js から直接ユーザーが演奏しているノートを取得する方法がないように見えることです。キーボードのキープレスを音符に変換できますが、それだけです。誰かがキーボードをクリックしてもイベントをキャプチャできません。また、tone.js シンセと一緒に演奏されているピアノのキーを解釈できるように、tone.js から選択した MIDI 入力デバイスを取得することもできません。
仮想ピアノのキーは単なるボタンですが、シャドウ DOM ではアクセスできないため、jquery を使用してイベント リスナーをアタッチしようとしました。
誰かがtone.jsとtonejs/uiを使って働いていて、これが可能かどうか知っていますか? 回避策のアイデアはありますか?
編集: v1.0.0 を完了しました。Tone.js と一緒に MIDI デバイスを聞いて、再生中の音に変換することができました。これはまともな解決策ですが、既に述べたように、コードを簡素化するために Tone.js シンセから直接再生される音符を取得し、マウスでクリックされた音符でトレーナー バーが機能するようにする方がよいでしょう。演奏中のノートは、トレーナー バーにオクターブ番号とともに表示できます。