[ソング] マルチトラック機能の実装

[y-chan]

内容

現状、Vuex store上では複数のトラックをおける用になっていますが、UIとしては複数のトラックを設置する機能(マルチトラック)が実装されていません。
これをUIに実装することを目標としたIssueです

Pros 良くなる点

コーラスなどを1プロジェクトで叶えられるようになる
(オーディオトラックを作れば)インスト音源との合成をエディタ上で行える

Cons 悪くなる点

特になし

実現方法

• selectedTrackIndexが外部から操作できるようにstoreに移動させる
• 複数のトラックを操作できるUIを作る
• (Optional?)オーディオトラック機能を実装する

VOICEVOXのバージョン

0.?.0

OSの種類/ディストリ/バージョン

• Windows
• macOS
• Linux

その他

UIはSynthVとかが参考になるかも...!
全体が見渡せる場所は欲しい...?(操作画面が狭くなる問題あり...)

[sevenc-nanashi]

参考（SynthV）：

今の外観をあまり崩さない場合（=トラック一覧を開閉可能なDrawerとして追加する）のUIを考えてみました（手描きですが）：

SynthVだとパンや音量コントロール（ミュート/ソロ含め）あるので、可能なら入れても良さそう。

[Hiroshiba]

マルチトラックは現在 @sevenc-nanashi さんに積極的に実装いただいています。（ありがとうございます！！）

最終的な変更行数が２０００行を超えることがわかってきたので、いくつか段階を分けてPRしていただく流れをお願いさせていただきました。
変更が露出しない形でmainブランチに実装していく形も可能ですが、今回は @sevenc-nanashi さんと相談してプロジェクトブランチを作る方針で進めたいと思います！

ということでマルチトラック用プロジェクトブランチを作成しました 🙏
https://github.com/VOICEVOX/voicevox/tree/project-multitrack

[sevenc-nanashi]

タスクリストです：

• サイドバー：マルチトラック：サイドバーを追加 #2148
  • トラック操作
    • 追加
    • 削除
    • リネーム
    • パン
    • 音量
    • ミュート/ソロ
  • 表示/非表示切り換え
• シーケンサー：マルチトラック：シーケンサー周りを対応 #2161
  • ノート追加
  • ノート削除
  • ノート表示
  • 合成ステータスバー（上のやつ）
  • ピッチ
• インポート：マルチトラック：インポートに対応 #2126
• プロジェクトファイル：マルチトラック：storeを色々変える #2093
  • マイグレーション
  • 保存
  • 読み込み
• トラック毎のシンガー切り換え
• state：マルチトラック：storeを色々変える #2093
  • 色々なActionがtrackIdを受け取れるようにする
  • tracksをRecord<TrackId, Track>にし、trackOrder: TrackId[]を作る（トーク参照）
• 合成
  • 再生：マルチトラック：storeを色々変える #2093
  • プレビュー：マルチトラック：再生・書き出しに対応 #2163
  • 全書き出し：マルチトラック：再生・書き出しに対応 #2163
  • オプション：stem（トラック毎）書き出し
• オプション：オーディオトラック
  • デザイン
  • 実装

[sevenc-nanashi]

とりあえずstateからやってみようと思います。tracks[0]が確実に型エラーになるので良い感じに残りを見つけてくれるはず。

[sevenc-nanashi]

オプション以外は一通り終わったと思います。

[Hiroshiba]

ありがとうございます！！
提供がとても楽しみです！！
あ、projectブランチのプルリク作成をお願いできれば！

相談です！
マルチトラックはまず実験的機能で出すのが良さそうと考えてます。
用途が多岐にわたるめ確認すべきポイントの網羅が難しいので、実際に提供する形で課題点を募集できればなと。

そこでなのですが、マルチトラックを実験的機能にすることは難しそうでしょうか？
シングルトラックのとき同様動けば良いと思っているのですが、どこをどう変えれば良いか、あるいはオンオフでの切り替えは難しいかをお聞きしたいです！

（例えばUIはサイドバーの開閉ボタンを隠せば良い、とか。）

[sevenc-nanashi]

• サイドバーボタンを隠す
• インポート画面のトラック選択をラジオボックスにする

あたりで隠せると思います。

[Hiroshiba]

なるほどです！！

あ。あとマルチトラックが必要なプロジェクトファイルを読み込もうとしたときに、ダイアログを出してあげると優しいかも･･･？
「実験的機能をオンにしますか？」でも良いし、「オンにする必要があります」にしても良いし。

ちょっとこの辺り考慮しつつ、実験的機能とする実装もお願いしてよいでしょうか 🙇
あるいはいきなり通常リリースするという手もあると思います･･･！！

[Hiroshiba]

あっ　TODO: もっとスマートな方法を考えるのとこどうしましょう･･･？
mainマージ前にリファクタリングするか、方針考えてissue作るでも良いと思います。

ちょっと覚えてないのですが、たしかSET_TRACK後のactionの副作用をいろいろ実行しなくちゃいけないんだけど、副作用あるのがSET_SINGERだけとかなんでしたっけ。
だとしたら副作用はSETUP_SINGERだけで、これはそもそも実行しなくても良い（初回の音声合成に時間かかるけど）から、全部副作用実行しなくても良いかも？？

ちょっと要確認ですが。。。

[sevenc-nanashi]

これはそもそも実行しなくても良い（初回の音声合成に時間かかるけど）から

Voicevox Engineでは無事かも知れませんが一応読んでおきたい気持ちはありますね。
RENDERあたりにも入れるとか？

[Hiroshiba]

RENDERで呼んでも良いかもですが、エンジン側の仕様で呼ばなくても大丈夫なようになってるんですよね〜
https://voicevox.github.io/voicevox_engine/api/#tag/%E3%81%9D%E3%81%AE%E4%BB%96/operation/initialize_speaker_initialize_speaker_post

initializeされてるかどうかは毎回エンジンに問い合わせないといけないので、リクエストを何度も走らせないといけなさそう。
なのでRENDER内で実行しない判断も割と合理的かもです。

[sevenc-nanashi]

副作用はSETUP_SINGERだけ

mutationも入れるとSET_NOTES内のoverlappingNoteIds更新もありますね。
SET_TRACKでmutationを叩きまくるんでしたっけ？

[Hiroshiba]

あーそうか、mutation側もでした…。

副作用目的でactionを叩きまくるよりは、set track内でset mutation叩きまくる方が良いとは感じます。
track内のプロパティが増えたときに処理足し忘れる危険性を排除できるととても良さそうですが…。

あるいはset track内で普通にtrackをsetして、overlap更新しても良いかも。
これが丸いかもしれない。

あるいは高速化したし、getterにする手もあるかも。
この辺りの議論は測定結果をコメントしてくださったあたりなにか参考になる考え方残ってるかも。

[sevenc-nanashi]

あるいは高速化したし、getterにする手もあるかも。

$O(2Nlog2N + 2N)$ なので、getterにしても十分問題ない速度だと思います。

[Hiroshiba]

そもそもnotesに変更が入るmutationで毎回notesからoverlap計算してるんでしたっけ。
であればgetterにしても計算回数は変わらないはず…？（computedがちゃんとキャッシュ作ってくれるなら）

[Hiroshiba]

📝 overlappingNoteIdsはgetterになった

[Hiroshiba]

@sevenc-nanashi あっすみません！！
proeject-multitrackをmainへマージするPR作っていただいてもいいですか 👀 （権限あるかな）

それをXポストでリンクする URL にしようかな～と。（とどめのプルリクエストなので終わり感ある＆アイコンが大きく表示される）
あとコンフリクトも解消をお願いできると･･･。。。 🙇

ポスト文はこんな感じを予定！

#VOICEVOX開発状況 
１つのプロジェクト内で複数のトラックを編集できるようになりました🎉（今後のアップデートで実験的機能として実装されます。）
【開発者:@sevenc_nanashi】
URL

[Hiroshiba]

あ！　このissueどうしましょう？

こちらのコメント見る感じ、完了していないタスクはあとstem書き出し？

[sevenc-nanashi]

あとオーディオトラックですね。

[Hiroshiba]

あ、なるほどです！！
issueタイトルの大目的は果たせたのでcloseしようか迷ってます。

[sevenc-nanashi]

細かい所は分割してこれは閉じる、で良いと思います。

[Hiroshiba]

了解です！

ではissueを作っていきますか。
実装の構想が思い浮かんでるものがあれば、issue作るついでにその構想をまとめられて便利だと思います。
高層の浮かんでるタスクはありますか？ 👀

[sevenc-nanashi]

とりあえず浮かんでいるのを建てました： #2214 、 #2215 。
これは閉じても良さそう。

[Hiroshiba]

issue作成ありがとうございます！！
こちらのissueは閉じようと思います！　ありがとうございました！！

プロジェクトブランチもプロジェクト達成ということで削除しようと思います！
また必要になった時は必要になった時のタスクに応じたブランチ名にする感じで・・・！