Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

マルチトラック：インポートに対応 #2126

Merged
merged 13 commits into from
Jun 30, 2024
Merged

マルチトラック：インポートに対応 #2126

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
85ab7df
Change: SET_TRACKを作る
sevenc-nanashi Jun 20, 2024
5f5c598
Add: インポートをマルチトラック対応
sevenc-nanashi Jun 20, 2024
b10d7c2
Add: 複数トラックをインポートできるように
sevenc-nanashi Jun 20, 2024
6f684ba
Fix: indexじゃなくてiだった
sevenc-nanashi Jun 20, 2024
9faad3b
Add: 共通化 + undo出来るように
sevenc-nanashi Jun 22, 2024
8e7d0d7
Change: トラック選択のUIを変更
sevenc-nanashi Jun 22, 2024
d3678d1
Change: mapを使う
sevenc-nanashi Jun 23, 2024
aea68cd
Change: isTracksEmptyを移動
sevenc-nanashi Jun 23, 2024
8f9d939
Change: IMPORT_*_PROJECTをCOMMANDに
sevenc-nanashi Jun 23, 2024
e215b38
Add: isValidTrackチェックを追加
sevenc-nanashi Jun 23, 2024
ec07a6c
Change: QCheckboxを使う
sevenc-nanashi Jun 23, 2024
0b5ddae
Change: 見た目を良い感じにする
sevenc-nanashi Jun 23, 2024
8cec685
デザインちょっと調整
Hiroshiba Jun 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 35 additions & 13 deletions src/components/Dialog/ImportSongProjectDialog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,18 +25,36 @@
:accept="acceptExtensions"
:errorMessage="projectFileErrorMessage"
:error="!!projectFileErrorMessage"
placeholder="外部プロジェクトファイルを選択してください"
placeholder="ファイルを選択してください"
@input="handleFileChange"
/>
<QSelect
v-if="project"
v-model="selectedTrack"
v-model="selectedTrackIndexes"
:options="trackOptions"
:disable="projectFileErrorMessage != undefined"
emitValue
mapOptions
multiple
label="インポートするトラック"
/>
>
<template #selected>
<div
v-for="(track, i) in trackOptions.filter(
(track) =>
selectedTrackIndexes &&
selectedTrackIndexes.includes(track.value),
)"
:key="track.value"
:class="{
'q-mt-sm': i === 0,
'q-mt-xs': i !== 0,
}"
Hiroshiba marked this conversation as resolved.
Show resolved Hide resolved
>
{{ track.label }}
</div>
</template>
</QSelect>
</QPageContainer>
<QFooter>
<QToolbar>
Expand All @@ -58,7 +76,9 @@
textColor="toolbar-button-display"
class="text-no-wrap text-bold q-mr-sm"
:disabled="
selectedTrack == null || projectFileErrorMessage != undefined
selectedTrackIndexes == null ||
selectedTrackIndexes.length === 0 ||
projectFileErrorMessage != undefined
"
@click="handleImportTrack"
/>
Expand Down Expand Up @@ -212,13 +232,13 @@ const trackOptions = computed(() => {
}));
});
// 選択中のトラック
const selectedTrack = ref<number | null>(null);
const selectedTrackIndexes = ref<number[] | null>(null);
sevenc-nanashi marked this conversation as resolved.
Show resolved Hide resolved

// データ初期化
const initializeValues = () => {
projectFile.value = null;
project.value = null;
selectedTrack.value = null;
selectedTrackIndexes.value = null;
};

// ファイル変更時
Expand All @@ -236,7 +256,7 @@ const handleFileChange = async (event: Event) => {

// 既存のデータおよび選択中のトラックをクリア
project.value = null;
selectedTrack.value = null;
selectedTrackIndexes.value = null;
error.value = null;

const file = input.files[0];
Expand All @@ -259,12 +279,14 @@ const handleFileChange = async (event: Event) => {
}),
};
}
selectedTrack.value = getProjectTracks(project.value).findIndex(
const firstSelectableTrack = getProjectTracks(project.value).findIndex(
(track) => !track.disable,
);
if (selectedTrack.value === -1) {
selectedTrack.value = 0;
if (firstSelectableTrack === -1) {
error.value = "emptyProject";
return;
}
selectedTrackIndexes.value = [firstSelectableTrack];
} catch (e) {
log.error(e);
error.value = "unknown";
Expand All @@ -281,19 +303,19 @@ const handleFileChange = async (event: Event) => {
// トラックインポート実行時
const handleImportTrack = () => {
// ファイルまたは選択中のトラックが未設定の場合はエラー
if (project.value == null || selectedTrack.value == null) {
if (project.value == null || selectedTrackIndexes.value == null) {
Comment on lines -284 to +301
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

他と合わせて、空っぽのときもエラーでも良いかも
（そのままでも良いかも）

このあたりの処理（disableになってるかとか）をstorybook辺りでテスト書けるとかっこいいかもですね

throw new Error("project or selected track is not set");
}
// トラックをインポート
if (project.value.type === "vvproj") {
store.dispatch("IMPORT_VOICEVOX_PROJECT", {
project: project.value.project,
trackIndex: selectedTrack.value,
trackIndexes: selectedTrackIndexes.value,
});
} else {
store.dispatch("IMPORT_UTAFORMATIX_PROJECT", {
project: project.value.project,
trackIndex: selectedTrack.value,
trackIndexes: selectedTrackIndexes.value,
});
}
onDialogOK();
Expand Down
181 changes: 116 additions & 65 deletions src/store/singing.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import {
SingingVoiceSourceHash,
SequencerEditTarget,
PhraseSourceHash,
Track,
} from "./type";
import { sanitizeFileName } from "./utility";
import { EngineId, NoteId, StyleId, TrackId } from "@/type/preload";
Expand Down Expand Up @@ -113,6 +114,9 @@ const generateNoteEvents = (notes: Note[], tempos: Tempo[], tpqn: number) => {
});
};

const isTracksEmpty = (tracks: Map<TrackId, Track>) =>
tracks.size === 1 && [...tracks.values()][0].notes.length === 0;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

こういうのがいっぱい詰め込まれたutitliyあった記憶。
そちらに似た関数あればそちらに書くほうがまとまり良いかも。

あとsize==0のときもempty判定で良いかも？

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sing/domain.tsにisValid系がたくさんありましたが、Map<TrackId, Tracks>を使ってるのはここくらいしかないのでここに置くのがいいかな～って感じでした。

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

domain.tsに置くとsinging.tsがすっきりするので、domain.tsに置いても良いと思います。
また、この関数ではkey（TrackId）は必要ないので、引数の型はTrack[]でも良いかもです。
isTrackEmpty: (track: Track) => booleanにして
tracksArray.length === 1 && isTrackEmpty(tracksArray[0])でも良いかも。


let audioContext: AudioContext | undefined;
let transport: Transport | undefined;
let previewSynth: PolySynth | undefined;
Expand Down Expand Up @@ -962,6 +966,47 @@ export const singingStore = createPartialStore<SingingStoreTypes>({
},
},

SET_TRACK: {
sevenc-nanashi marked this conversation as resolved.
Show resolved Hide resolved
mutation(state, { trackId, track }) {
state.tracks.set(trackId, track);
state.overlappingNoteIds.set(trackId, new Set());
state.overlappingNoteInfos.set(trackId, new Map());
},
async action({ state, commit, dispatch }, { trackId, track }) {
if (!isValidTrack(track)) {
throw new Error("The track is invalid.");
}
if (!state.tracks.has(trackId)) {
throw new Error(`Track ${trackId} does not exist.`);
}

commit("SET_TRACK", { trackId, track });
// 色々な処理を動かすため、二重にセットする
// TODO: もっとスマートな方法を考える
sevenc-nanashi marked this conversation as resolved.
Show resolved Hide resolved
await dispatch("SET_SINGER", {
singer: track.singer,
trackId,
});
await dispatch("SET_KEY_RANGE_ADJUSTMENT", {
keyRangeAdjustment: track.keyRangeAdjustment,
trackId,
});
await dispatch("SET_VOLUME_RANGE_ADJUSTMENT", {
volumeRangeAdjustment: track.volumeRangeAdjustment,
trackId,
});
await dispatch("SET_NOTES", { notes: track.notes, trackId });
await dispatch("CLEAR_PITCH_EDIT_DATA", {
trackId,
}); // FIXME: SET_PITCH_EDIT_DATAがセッターになれば不要
await dispatch("SET_PITCH_EDIT_DATA", {
pitchArray: track.pitchEditData,
startFrame: 0,
trackId,
});
},
},

SET_TRACKS: {
mutation(state, { tracks }) {
state.tracks = tracks;
Expand All @@ -975,31 +1020,14 @@ export const singingStore = createPartialStore<SingingStoreTypes>({
state.selectedTrackId = state.trackOrder[0];
},
async action({ commit, dispatch }, { tracks }) {
if (![...tracks.values()].every((track) => isValidTrack(track))) {
throw new Error("The track is invalid.");
}
commit("SET_TRACKS", { tracks });
// 色々な処理を動かすため、二重にセットする
// TODO: もっとスマートな方法を考える

for (const [trackId, track] of tracks) {
await dispatch("SET_SINGER", {
singer: track.singer,
trackId,
});
await dispatch("SET_KEY_RANGE_ADJUSTMENT", {
keyRangeAdjustment: track.keyRangeAdjustment,
trackId,
});
await dispatch("SET_VOLUME_RANGE_ADJUSTMENT", {
volumeRangeAdjustment: track.volumeRangeAdjustment,
trackId,
});
await dispatch("SET_NOTES", { notes: track.notes, trackId });
await dispatch("CLEAR_PITCH_EDIT_DATA", {
trackId,
}); // FIXME: SET_PITCH_EDIT_DATAがセッターになれば不要
await dispatch("SET_PITCH_EDIT_DATA", {
pitchArray: track.pitchEditData,
startFrame: 0,
trackId,
});
// 色々な処理を動かすため、二重にセットする
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ここも忘れないようにTODOコメント入れさせていただきます 🙇

await dispatch("SET_TRACK", { trackId, track });
}
},
},
Expand Down Expand Up @@ -1822,31 +1850,53 @@ export const singingStore = createPartialStore<SingingStoreTypes>({
// TODO: Undoできるようにする
IMPORT_UTAFORMATIX_PROJECT: {
sevenc-nanashi marked this conversation as resolved.
Show resolved Hide resolved
action: createUILockAction(
async ({ state, commit, dispatch }, { project, trackIndex = 0 }) => {
async ({ state, commit, dispatch }, { project, trackIndexes }) => {
const { tempos, timeSignatures, tracks, tpqn } =
ufProjectToVoicevox(project);

const notes = tracks[trackIndex].notes;

if (tempos.length > 1) {
logger.warn("Multiple tempos are not supported.");
}
if (timeSignatures.length > 1) {
logger.warn("Multiple time signatures are not supported.");
}

await dispatch("SET_TPQN", { tpqn });
await dispatch("SET_TEMPOS", { tempos });
await dispatch("SET_TIME_SIGNATURES", { timeSignatures });

tempos.splice(1, tempos.length - 1); // TODO: 複数テンポに対応したら削除
timeSignatures.splice(1, timeSignatures.length - 1); // TODO: 複数拍子に対応したら削除

if (tpqn !== state.tpqn) {
throw new Error("TPQN does not match. Must be converted.");
}

// TODO: ここら辺のSET系の処理をまとめる
await dispatch("SET_TPQN", { tpqn });
await dispatch("SET_TEMPOS", { tempos });
await dispatch("SET_TIME_SIGNATURES", { timeSignatures });
await dispatch("SET_NOTES", { notes, trackId: state.selectedTrackId });
const currentTrack = getOrThrow(state.tracks, state.selectedTrackId);

for (const [i, trackIndex] of trackIndexes.entries()) {
const notes = tracks[trackIndex].notes;

const track = {
...structuredClone(toRaw(currentTrack)),

notes,
};

// 空のプロジェクトならトラックを上書きする
if (i === 0 && isTracksEmpty(state.tracks)) {
await dispatch("SET_TRACK", {
sevenc-nanashi marked this conversation as resolved.
Show resolved Hide resolved
track,
trackId: state.selectedTrackId,
});
} else {
const { trackId } = await dispatch("CREATE_TRACK");
await dispatch("REGISTER_TRACK", {
track,
trackId,
});
sevenc-nanashi marked this conversation as resolved.
Show resolved Hide resolved
}
}

commit("SET_SAVED_LAST_COMMAND_UNIX_MILLISEC", null);
commit("CLEAR_COMMANDS");
Expand All @@ -1858,50 +1908,51 @@ export const singingStore = createPartialStore<SingingStoreTypes>({
// TODO: Undoできるようにする
IMPORT_VOICEVOX_PROJECT: {
action: createUILockAction(
async ({ state, commit, dispatch }, { project, trackIndex = 0 }) => {
async ({ state, commit, dispatch }, { project, trackIndexes }) => {
const { tempos, timeSignatures, tracks, tpqn, trackOrder } =
project.song;

const track = tracks[trackOrder[trackIndex]];
if (!track) {
throw new Error("Track not found.");
}
const notes = track.notes.map((note) => ({
...note,
id: NoteId(crypto.randomUUID()),
}));
await dispatch("SET_TPQN", { tpqn });
await dispatch("SET_TEMPOS", { tempos });
await dispatch("SET_TIME_SIGNATURES", { timeSignatures });

tempos.splice(1, tempos.length - 1); // TODO: 複数テンポに対応したら削除
timeSignatures.splice(1, timeSignatures.length - 1); // TODO: 複数拍子に対応したら削除

if (tpqn !== state.tpqn) {
throw new Error("TPQN does not match. Must be converted.");
}

// TODO: ここら辺のSET系の処理をまとめる
await dispatch("SET_SINGER", {
singer: track.singer,
trackId: state.selectedTrackId,
});
await dispatch("SET_KEY_RANGE_ADJUSTMENT", {
keyRangeAdjustment: track.keyRangeAdjustment,
const filteredTracks = new Map<TrackId, Track>();

trackId: state.selectedTrackId,
});
await dispatch("SET_VOLUME_RANGE_ADJUSTMENT", {
volumeRangeAdjustment: track.volumeRangeAdjustment,
for (const trackIndex of trackIndexes) {
const track = tracks[trackOrder[trackIndex]];
if (!track) {
throw new Error("Track not found.");
}
const { trackId } = await dispatch("CREATE_TRACK");
filteredTracks.set(trackId, {
...toRaw(track),
notes: track.notes.map((note) => ({
...note,
id: NoteId(crypto.randomUUID()),
})),
});
}

trackId: state.selectedTrackId,
});
await dispatch("SET_TPQN", { tpqn });
await dispatch("SET_TEMPOS", { tempos });
await dispatch("SET_TIME_SIGNATURES", { timeSignatures });
await dispatch("SET_NOTES", { notes, trackId: state.selectedTrackId });
await dispatch("CLEAR_PITCH_EDIT_DATA", {
trackId: state.selectedTrackId,
}); // FIXME: SET_PITCH_EDIT_DATAがセッターになれば不要
await dispatch("SET_PITCH_EDIT_DATA", {
pitchArray: track.pitchEditData,
startFrame: 0,
trackId: state.selectedTrackId,
});
// 空のプロジェクトならトラックを上書きする
if (isTracksEmpty(state.tracks)) {
await dispatch("SET_TRACKS", {
tracks: filteredTracks,
});
} else {
for (const [trackId, track] of filteredTracks) {
await dispatch("REGISTER_TRACK", {
track,
trackId,
});
}
}
Hiroshiba marked this conversation as resolved.
Show resolved Hide resolved

commit("SET_SAVED_LAST_COMMAND_UNIX_MILLISEC", null);
commit("CLEAR_COMMANDS");
Expand Down
12 changes: 10 additions & 2 deletions src/store/type.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1035,11 +1035,14 @@ export type SingingStoreTypes = {
};

IMPORT_UTAFORMATIX_PROJECT: {
action(payload: { project: UfProject; trackIndex: number }): void;
action(payload: { project: UfProject; trackIndexes: number[] }): void;
};

IMPORT_VOICEVOX_PROJECT: {
action(payload: { project: LatestProjectType; trackIndex: number }): void;
action(payload: {
project: LatestProjectType;
trackIndexes: number[];
}): void;
};

EXPORT_WAVE_FILE: {
Expand Down Expand Up @@ -1166,6 +1169,11 @@ export type SingingStoreTypes = {
action(payload: { trackId: TrackId }): void;
};

SET_TRACK: {
mutation: { trackId: TrackId; track: Track };
action(payload: { trackId: TrackId; track: Track }): void;
};

SET_TRACKS: {
mutation: { tracks: Map<TrackId, Track> };
action(payload: { tracks: Map<TrackId, Track> }): Promise<void>;
Expand Down
Loading