[release-0.14] マルチエンジン機能を実験的機能から通常機能にあげる (#1641)

public/howtouse.md

@@ -252,6 +252,11 @@ GPU をお持ちの方は、音声の生成がずっと速い GPU モードを
 GPU モードを利用するには、GPU が必要です。
 Linux は Nvidia 製 GPU のみに対応しています。
 
+#### 音声のサンプリングレート
+
+音声のサンプリングレートを変更して再生・保存します。  
+サンプリングレートを高くしても音声の品質は上がりません。
+
 ### 「操作」項目
 
 #### パラメータの引き継ぎ
@@ -294,6 +299,11 @@ Linux は Nvidia 製 GPU のみに対応しています。
 
 ### 「高度な設定」項目
 
+#### マルチエンジン機能
+
+VOICEVOX API 準拠エンジンを VOICEVOX 内で利用できるようになります。  
+マルチエンジン機能をオンにしたあと、メニューにある「エンジン」の「エンジンの管理」に移動し、VOICEVOX API 準拠エンジンの VVPP ファイルをインストールするか、VOICEVOX 系ソフトウェア内のエンジンのパスを指定することで利用できます。
+
 #### 音声をステレオ化
 
 音声をモノラルからステレオに変換して再生・保存します。
@@ -302,11 +312,6 @@ Linux は Nvidia 製 GPU のみに対応しています。
 
 音声を再生するデバイスを変更できます。
 
-#### 音声のサンプリングレート
-
-音声のサンプリングレートを変更して再生・保存します。  
-サンプリングレートを高くしても音声の品質は上がりません。
-
 ### 「実験的機能」項目
 
 開発中の便利機能を利用することができます。
@@ -329,11 +334,6 @@ Linux は Nvidia 製 GPU のみに対応しています。
 対応している音声を混ぜてモーフィングした音声を合成できるようになります。  
 ２つの音声を一度生成してから、音声を機械的に分析・再合成する後処理を行うことで実現しています。
 
-#### マルチエンジン機能
-
-VOICEVOX 以外の VOICEVOX API 準拠エンジンを VOICEVOX 内で利用できるようになります。  
-マルチエンジン機能をオンにしたあと、メニューにある「エンジン」の「エンジンの管理」に移動し、VOICEVOX API 準拠エンジンの VVPP ファイルをインストールするか、VOICEVOX 系ソフトウェア内のエンジンのパスを指定することで利用できます。
-
 ### 「データ収集」項目
 
 #### ソフトウェア利用状況のデータ収集を許可する

src/background.ts

@@ -160,6 +160,15 @@ const store = new Store<ElectronStoreType>({
       // @ts-expect-error 削除されたパラメータ。
       store.delete("useGpu");
     },
+    ">=0.14.9": (store) => {
+      // マルチエンジン機能を実験的機能から通常機能に
+      const enableMultiEngine: boolean =
+        // @ts-expect-error 削除されたパラメータ。
+        store.get("experimentalSetting").enableMultiEngine;
+      store.set("enableMultiEngine", enableMultiEngine);
+      // @ts-expect-error 削除されたパラメータ。
+      store.delete("experimentalSetting.enableMultiEngine");
+    },
   },
 });
 
@@ -253,7 +262,7 @@ async function installVvppEngineWithWarning({
  * 無効だった場合はダイアログを表示してfalseを返す。
  */
 function checkMultiEngineEnabled(): boolean {
-  const enabled = store.get("experimentalSetting").enableMultiEngine;
+  const enabled = store.get("enableMultiEngine");
   if (!enabled) {
     dialog.showMessageBoxSync(win, {
       type: "info",

src/components/MenuBar.vue

@@ -90,9 +90,7 @@ const isFullscreen = computed(() => store.getters.IS_FULLSCREEN);
 const engineIds = computed(() => store.state.engineIds);
 const engineInfos = computed(() => store.state.engineInfos);
 const engineManifests = computed(() => store.state.engineManifests);
-const enableMultiEngine = computed(
-  () => store.state.experimentalSetting.enableMultiEngine
-);
+const enableMultiEngine = computed(() => store.state.enableMultiEngine);
 
 const titleText = computed(
   () =>

src/components/SettingDialog.vue

@@ -529,11 +529,33 @@
               </q-card-actions>
             </q-card>
 
-            <!-- Experimental Card -->
+            <!-- Advanced Card -->
             <q-card flat class="setting-card">
               <q-card-actions>
                 <div class="text-h5">高度な設定</div>
               </q-card-actions>
+              <q-card-actions class="q-px-md q-py-none bg-surface">
+                <div>マルチエンジン機能</div>
+                <div>
+                  <q-icon name="help_outline" size="sm" class="help-hover-icon">
+                    <q-tooltip
+                      :delay="500"
+                      anchor="center left"
+                      self="center right"
+                      transition-show="jump-left"
+                      transition-hide="jump-right"
+                    >
+                      複数のVOICEVOX準拠エンジンを利用可能にする
+                    </q-tooltip>
+                  </q-icon>
+                </div>
+                <q-space />
+                <q-toggle
+                  :model-value="enableMultiEngine"
+                  @update:model-value="setEnableMultiEngine($event)"
+                >
+                </q-toggle>
+              </q-card-actions>
               <q-card-actions class="q-px-md q-py-none bg-surface">
                 <div>音声をステレオ化</div>
                 <div>
@@ -584,6 +606,8 @@
                 </q-select>
               </q-card-actions>
             </q-card>
+
+            <!-- Experimental Card -->
             <q-card flat class="setting-card">
               <q-card-actions>
                 <div class="text-h5">実験的機能</div>
@@ -664,30 +688,6 @@
                 >
                 </q-toggle>
               </q-card-actions>
-              <q-card-actions class="q-px-md q-py-none bg-surface">
-                <div>マルチエンジン機能</div>
-                <div>
-                  <q-icon name="help_outline" size="sm" class="help-hover-icon">
-                    <q-tooltip
-                      :delay="500"
-                      anchor="center left"
-                      self="center right"
-                      transition-show="jump-left"
-                      transition-hide="jump-right"
-                    >
-                      複数のVOICEVOX準拠エンジンを利用可能にする
-                    </q-tooltip>
-                  </q-icon>
-                </div>
-                <q-space />
-                <q-toggle
-                  :model-value="experimentalSetting.enableMultiEngine"
-                  @update:model-value="
-                    changeExperimentalSetting('enableMultiEngine', $event)
-                  "
-                >
-                </q-toggle>
-              </q-card-actions>
             </q-card>
             <q-card flat class="setting-card">
               <q-card-actions>
@@ -1021,6 +1021,11 @@ export default defineComponent({
       store.dispatch("SET_EDITOR_FONT", { editorFont });
     };
 
+    const enableMultiEngine = computed(() => store.state.enableMultiEngine);
+    const setEnableMultiEngine = (enableMultiEngine: boolean) => {
+      store.dispatch("SET_ENABLE_MULTI_ENGINE", { enableMultiEngine });
+    };
+
     const showsFilePatternEditDialog = ref(false);
 
     const selectedEngineIdRaw = ref("");
@@ -1066,6 +1071,8 @@ export default defineComponent({
       splitTextWhenPaste,
       changeSplitTextWhenPaste,
       editorFont,
+      enableMultiEngine,
+      setEnableMultiEngine,
       changeEditorFont,
       showsFilePatternEditDialog,
     };

src/store/setting.ts

@@ -44,7 +44,6 @@ export const settingStoreState: SettingStoreState = {
     enablePreset: false,
     enableInterrogativeUpspeak: false,
     enableMorphing: false,
-    enableMultiEngine: false,
   },
   splitTextWhenPaste: "PERIOD_AND_NEW_LINE",
   splitterPosition: {
@@ -56,6 +55,7 @@ export const settingStoreState: SettingStoreState = {
     tweakableSliderByScroll: false,
   },
   engineSettings: {},
+  enableMultiEngine: false,
 };
 
 export const settingStore = createPartialStore<SettingStoreTypes>({
@@ -126,6 +126,12 @@ export const settingStore = createPartialStore<SettingStoreTypes>({
           engineSetting,
         });
       }
+
+      commit("SET_ENABLE_MULTI_ENGINE", {
+        enableMultiEngine: await window.electron.getSetting(
+          "enableMultiEngine"
+        ),
+      });
     },
   },
 
@@ -329,6 +335,16 @@ export const settingStore = createPartialStore<SettingStoreTypes>({
     },
   },
 
+  SET_ENABLE_MULTI_ENGINE: {
+    mutation(state, { enableMultiEngine }) {
+      state.enableMultiEngine = enableMultiEngine;
+    },
+    action({ commit }, { enableMultiEngine }) {
+      window.electron.setSetting("enableMultiEngine", enableMultiEngine);
+      commit("SET_ENABLE_MULTI_ENGINE", { enableMultiEngine });
+    },
+  },
+
   CHANGE_USE_GPU: {
     /**
      * CPU/GPUモードを切り替えようとする。

src/store/type.ts

@@ -976,6 +976,7 @@ export type SettingStoreState = {
   splitterPosition: SplitterPosition;
   confirmedTips: ConfirmedTips;
   engineSettings: EngineSettings;
+  enableMultiEngine: boolean;
 };
 
 export type SettingStoreTypes = {
@@ -1048,6 +1049,11 @@ export type SettingStoreTypes = {
     }): Promise<void>;
   };
 
+  SET_ENABLE_MULTI_ENGINE: {
+    mutation: { enableMultiEngine: boolean };
+    action(payload: { enableMultiEngine: boolean }): void;
+  };
+
   CHANGE_USE_GPU: {
     action(payload: { useGpu: boolean; engineId: string }): Promise<void>;
   };

src/type/preload.ts

@@ -436,7 +436,6 @@ export type ExperimentalSetting = {
   enablePreset: boolean;
   enableInterrogativeUpspeak: boolean;
   enableMorphing: boolean;
-  enableMultiEngine: boolean;
 };
 
 export const splitterPositionSchema = z
@@ -525,7 +524,6 @@ export const electronStoreSchema = z
         enablePreset: z.boolean().default(false),
         enableInterrogativeUpspeak: z.boolean().default(false),
         enableMorphing: z.boolean().default(false),
-        enableMultiEngine: z.boolean().default(false),
       })
       .passthrough()
       .default({}),
@@ -546,6 +544,7 @@ export const electronStoreSchema = z
       .passthrough()
       .default({}),
     registeredEngineDirs: z.string().array().default([]),
+    enableMultiEngine: z.boolean().default(false),
   })
   .passthrough();
 export type ElectronStoreType = z.infer<typeof electronStoreSchema>;

tests/unit/store/Vuex.spec.ts

@@ -121,7 +121,6 @@ describe("store/vuex.js test", () => {
           enablePreset: false,
           enableInterrogativeUpspeak: false,
           enableMorphing: false,
-          enableMultiEngine: false,
         },
         splitTextWhenPaste: "PERIOD_AND_NEW_LINE",
         splitterPosition: {
@@ -132,6 +131,7 @@ describe("store/vuex.js test", () => {
         confirmedTips: {
           tweakableSliderByScroll: false,
         },
+        enableMultiEngine: false,
         progress: -1,
       },
       getters: {