From 6b8f30156e4779d01032b32a2d78a1cae65ad09e Mon Sep 17 00:00:00 2001
From: Romot <romot@romotmbp16.local>
Date: Tue, 17 Jan 2023 03:06:51 +0900
Subject: [PATCH] =?UTF-8?q?#986=20=E6=8C=87=E6=91=98=E7=82=B9=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3=E4=BB=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Sing/ScoreSequencer.vue |  7 +++++--
 src/helpers/singHelper.ts              |  6 +-----
 src/store/singing.ts                   | 23 ++++-------------------
 src/views/SingerHome.vue               | 19 +++++--------------
 tests/unit/store/Vuex.spec.ts          |  2 +-
 5 files changed, 16 insertions(+), 41 deletions(-)

diff --git a/src/components/Sing/ScoreSequencer.vue b/src/components/Sing/ScoreSequencer.vue
index 2d95f29c43..d87fd440f1 100644
--- a/src/components/Sing/ScoreSequencer.vue
+++ b/src/components/Sing/ScoreSequencer.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="score-sequencer" id="score-sequencer">
+  <div class="score-sequencer">
     <div class="sequencer-keys">
       <div
         v-for="y in gridY"
@@ -16,7 +16,7 @@
         {{ y.pitch === "C" ? y.name : "" }}
       </div>
     </div>
-    <div class="sequencer-grids" ref="sequencer-grids">
+    <div class="sequencer-grids">
       <div
         v-for="x in gridX"
         :key="x"
@@ -39,6 +39,7 @@
           }"
         />
       </div>
+      <!-- NOTE: ノートと歌詞入力あわせコンポーネント分割予定 -->
       <div
         v-for="(note, index) in notes"
         :key="index"
@@ -60,6 +61,7 @@
         <div class="sequencer-note-bar" />
       </div>
     </div>
+    <!-- NOTE: スクロールバー+ズームレンジ仮 -->
     <input
       type="range"
       min="0.1"
@@ -153,6 +155,7 @@ export default defineComponent({
       store.dispatch("REMOVE_NOTE", { index });
     };
 
+    // NOTE: ノートのバーと歌詞入力でコンポーネント分割予定
     const setLyric = (index: number, event: Event) => {
       if (!(event.target instanceof HTMLInputElement)) {
         return;
diff --git a/src/helpers/singHelper.ts b/src/helpers/singHelper.ts
index e2e801227a..cfe517eb64 100644
--- a/src/helpers/singHelper.ts
+++ b/src/helpers/singHelper.ts
@@ -30,7 +30,7 @@ export function getDoremiFromMidi(midi: number): string {
     "ソ",
     "ラ",
     "ラ",
-    "ラ",
+    "シ",
   ];
   const pitchPos = midi % 12;
   return mapPitches[pitchPos];
@@ -61,7 +61,3 @@ export const midiKeys = [...Array(128)]
     };
   })
   .reverse();
-
-export function getDisplayKey(midi: number): object {
-  return midiKeys[midi];
-}
diff --git a/src/store/singing.ts b/src/store/singing.ts
index 0b9bba0f46..c96b80dab3 100644
--- a/src/store/singing.ts
+++ b/src/store/singing.ts
@@ -5,6 +5,7 @@ import {
   Note,
   SingingStoreState,
   SingingStoreTypes,
+  commandMutationsCreator,
 } from "./type";
 import { createPartialStore } from "./vuex";
 import { createUILockAction } from "./ui";
@@ -14,23 +15,7 @@ import { getDoremiFromMidi } from "@/helpers/singHelper";
 export const singingStoreState: SingingStoreState = {
   engineId: undefined,
   styleId: undefined,
-  score: {
-    resolution: 480,
-    tempos: [
-      {
-        position: 0,
-        tempo: 120,
-      },
-    ],
-    timeSignatures: [
-      {
-        position: 0,
-        beats: 4,
-        beatType: 4,
-      },
-    ],
-    notes: [],
-  },
+  score: undefined,
   renderPhrases: [],
   // NOTE: UIの状態は試行のためsinging.tsに局所化する+Hydrateが必要
   isShowSinger: true,
@@ -276,8 +261,8 @@ export const singingStore = createPartialStore<SingingStoreTypes>({
   ADD_NOTE: {
     mutation(state, { note }: { note: Note }) {
       if (state.score) {
-        const notes = [...state.score.notes].concat(note).sort((a, b) => {
-          return a.position < b.position ? -1 : 1;
+        const notes = state.score.notes.concat(note).sort((a, b) => {
+          return a.position - b.position;
         });
         state.score.notes = notes;
       }
diff --git a/src/views/SingerHome.vue b/src/views/SingerHome.vue
index c92b09a91e..5a854f3235 100644
--- a/src/views/SingerHome.vue
+++ b/src/views/SingerHome.vue
@@ -48,22 +48,13 @@ export default defineComponent({
 
     // 歌声合成エディターの初期化
     onMounted(async () => {
+      if (store.state.score === undefined) {
+        const emptyScore = await store.dispatch("GET_EMPTY_SCORE");
+        await store.dispatch("SET_SCORE", { score: emptyScore });
+      }
       await store.dispatch("SET_SINGER", {});
-
-      const score = await store.dispatch("GET_EMPTY_SCORE");
-
-      // 実装時の確認用です TODO: 必要なくなったら削除
-      score.notes = [
-        { position: 0, duration: 480, midi: 60, lyric: "ら" },
-        { position: 480, duration: 480, midi: 62, lyric: "ら" },
-        { position: 960, duration: 480, midi: 64, lyric: "ら" },
-        { position: 1440, duration: 480, midi: 65, lyric: "ら" },
-        { position: 1920, duration: 1920, midi: 67, lyric: "ら" },
-      ];
-
-      await store.dispatch("SET_SCORE", { score });
+      return {};
     });
-    return null;
   },
 });
 </script>
diff --git a/tests/unit/store/Vuex.spec.ts b/tests/unit/store/Vuex.spec.ts
index 0384de83ce..f68bad8fed 100644
--- a/tests/unit/store/Vuex.spec.ts
+++ b/tests/unit/store/Vuex.spec.ts
@@ -122,7 +122,7 @@ describe("store/vuex.js test", () => {
         sequencerZoomX: 1,
         sequencerZoomY: 1,
         sequencerScrollX: 0,
-        sequencerScrollY: 60,
+        sequencerScrollY: 60,お
       },
       getters: {
         ...uiStore.getters,