PublicMirrors/voice-changer
1
0
Fork 0
mirror of https://github.com/w-okada/voice-changer.git synced 2025-01-23 21:45:00 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

WIP: gui commonize 3

Browse Source
This commit is contained in:
wataru 2023-04-05 03:35:16 +09:00
parent 604846b0c6
commit 568e06ed2f
44 changed files with 586 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
client/demo_v13/dist/assets/gui_settings/MMVCv13.json vendored
View File

@ -4,7 +4,7 @@
"front": { "front": {
"title": { "title": {
"mainTitle": "VC Client", "mainTitle": "VC Client",
"subTitle": "MMVC for v.1.3", "subTitle": "for MMVC v.1.3",
"lineNum": 1 "lineNum": 1
}, },
"serverControl": {}, "serverControl": {},
@ -12,7 +12,8 @@
"ONNXEnable": true, "ONNXEnable": true,
"pyTorchEnable": true, "pyTorchEnable": true,
"MMVCCorrespondense": false, "MMVCCorrespondense": false,
"pyTorchClusterEnable": false "pyTorchClusterEnable": false,
"showPyTorchDefault": false
}, },
"deviceSetting": {}, "deviceSetting": {},
"qualityControl": { "qualityControl": {

59
client/demo_v13/dist/assets/gui_settings/MMVCv15.json vendored Normal file
View File

@ -0,0 +1,59 @@
{
"type": "demo",
"id": "MMVCv15",
"front": {
"title": {
"mainTitle": "VC Client",
"subTitle": "for MMVC v.1.5",
"lineNum": 1
},
"serverControl": {},
"modelSetting": {
"ONNXEnable": true,
"pyTorchEnable": true,
"MMVCCorrespondense": true,
"pyTorchClusterEnable": false,
"showPyTorchDefault": false
},
"deviceSetting": {},
"qualityControl": {
"F0DetectorEnable": true
},
"speakerSetting": {
"showSpeakerF0": true,
"srcIdEnable": true,
"editSpeakerIdMappingEnable": false,
"f0FactorEnable": true,
"tuningEnable": false,
"clusterInferRationEnable": false,
"noiseScaleEnable": false,
"silentThresholdEnable": false
},
"converterSetting": {
"extraDataLengthEnable": false
},
"advancedSetting": {
"serverURLEnable": true,
"protocolEnable": true,
"sampleRateEnable": true,
"sendingSampleRateEnable": true,
"crossFadeOverlapSizeEnable": true,
"crossFadeOffsetRateEnable": true,
"crossFadeEndRateEnable": true,
"downSamplingModeEnable": true,
"trancateNumTresholdEnable": true
}
},
"dialogs": {
"license": [
{
"title": "c",
"auther": "c",
"contact": "b",
"url": "a",
"license": "MIT"
}
]
}
}

59
client/demo_v13/dist/assets/gui_settings/so-vits-svc-40.json vendored Normal file
View File

@ -0,0 +1,59 @@
{
"type": "demo",
"id": "so-vits-svc-40",
"front": {
"title": {
"mainTitle": "VC Client",
"subTitle": "for so-vits-svc-40",
"lineNum": 1
},
"serverControl": {},
"modelSetting": {
"ONNXEnable": false,
"pyTorchEnable": true,
"MMVCCorrespondense": false,
"pyTorchClusterEnable": true,
"showPyTorchDefault": true
},
"deviceSetting": {},
"qualityControl": {
"F0DetectorEnable": true
},
"speakerSetting": {
"showSpeakerF0": false,
"srcIdEnable": false,
"editSpeakerIdMappingEnable": false,
"f0FactorEnable": false,
"tuningEnable": true,
"clusterInferRationEnable": true,
"noiseScaleEnable": true,
"silentThresholdEnable": true
},
"converterSetting": {
"extraDataLengthEnable": true
},
"advancedSetting": {
"serverURLEnable": true,
"protocolEnable": true,
"sampleRateEnable": true,
"sendingSampleRateEnable": true,
"crossFadeOverlapSizeEnable": true,
"crossFadeOffsetRateEnable": true,
"crossFadeEndRateEnable": true,
"downSamplingModeEnable": true,
"trancateNumTresholdEnable": true
}
},
"dialogs": {
"license": [
{
"title": "c",
"auther": "c",
"contact": "b",
"url": "a",
"license": "MIT"
}
]
}
}

59
client/demo_v13/dist/assets/gui_settings/so-vits-svc-40v2.json vendored Normal file
View File

@ -0,0 +1,59 @@
{
"type": "demo",
"id": "so-vits-svc-40v2",
"front": {
"title": {
"mainTitle": "VC Client",
"subTitle": "for so-vits-svc-40v2",
"lineNum": 1
},
"serverControl": {},
"modelSetting": {
"ONNXEnable": false,
"pyTorchEnable": true,
"MMVCCorrespondense": false,
"pyTorchClusterEnable": true,
"showPyTorchDefault": true
},
"deviceSetting": {},
"qualityControl": {
"F0DetectorEnable": true
},
"speakerSetting": {
"showSpeakerF0": false,
"srcIdEnable": false,
"editSpeakerIdMappingEnable": false,
"f0FactorEnable": false,
"tuningEnable": true,
"clusterInferRationEnable": true,
"noiseScaleEnable": true,
"silentThresholdEnable": true
},
"converterSetting": {
"extraDataLengthEnable": true
},
"advancedSetting": {
"serverURLEnable": true,
"protocolEnable": true,
"sampleRateEnable": true,
"sendingSampleRateEnable": true,
"crossFadeOverlapSizeEnable": true,
"crossFadeOffsetRateEnable": true,
"crossFadeEndRateEnable": true,
"downSamplingModeEnable": true,
"trancateNumTresholdEnable": true
}
},
"dialogs": {
"license": [
{
"title": "c",
"auther": "c",
"contact": "b",
"url": "a",
"license": "MIT"
}
]
}
}

66
client/demo_v13/dist/index.js vendored
View File

File diff suppressed because one or more lines are too long

5
client/demo_v13/public/assets/gui_settings/MMVCv13.json
View File

@ -4,7 +4,7 @@
"front": { "front": {
"title": { "title": {
"mainTitle": "VC Client", "mainTitle": "VC Client",
"subTitle": "MMVC for v.1.3", "subTitle": "for MMVC v.1.3",
"lineNum": 1 "lineNum": 1
}, },
"serverControl": {}, "serverControl": {},
@ -12,7 +12,8 @@
"ONNXEnable": true, "ONNXEnable": true,
"pyTorchEnable": true, "pyTorchEnable": true,
"MMVCCorrespondense": false, "MMVCCorrespondense": false,
"pyTorchClusterEnable": false "pyTorchClusterEnable": false,
"showPyTorchDefault": false
}, },
"deviceSetting": {}, "deviceSetting": {},
"qualityControl": { "qualityControl": {

59
client/demo_v13/public/assets/gui_settings/MMVCv15.json Normal file
View File

@ -0,0 +1,59 @@
{
"type": "demo",
"id": "MMVCv15",
"front": {
"title": {
"mainTitle": "VC Client",
"subTitle": "for MMVC v.1.5",
"lineNum": 1
},
"serverControl": {},
"modelSetting": {
"ONNXEnable": true,
"pyTorchEnable": true,
"MMVCCorrespondense": true,
"pyTorchClusterEnable": false,
"showPyTorchDefault": false
},
"deviceSetting": {},
"qualityControl": {
"F0DetectorEnable": true
},
"speakerSetting": {
"showSpeakerF0": true,
"srcIdEnable": true,
"editSpeakerIdMappingEnable": false,
"f0FactorEnable": true,
"tuningEnable": false,
"clusterInferRationEnable": false,
"noiseScaleEnable": false,
"silentThresholdEnable": false
},
"converterSetting": {
"extraDataLengthEnable": false
},
"advancedSetting": {
"serverURLEnable": true,
"protocolEnable": true,
"sampleRateEnable": true,
"sendingSampleRateEnable": true,
"crossFadeOverlapSizeEnable": true,
"crossFadeOffsetRateEnable": true,
"crossFadeEndRateEnable": true,
"downSamplingModeEnable": true,
"trancateNumTresholdEnable": true
}
},
"dialogs": {
"license": [
{
"title": "c",
"auther": "c",
"contact": "b",
"url": "a",
"license": "MIT"
}
]
}
}

59
client/demo_v13/public/assets/gui_settings/so-vits-svc-40.json Normal file
View File

@ -0,0 +1,59 @@
{
"type": "demo",
"id": "so-vits-svc-40",
"front": {
"title": {
"mainTitle": "VC Client",
"subTitle": "for so-vits-svc-40",
"lineNum": 1
},
"serverControl": {},
"modelSetting": {
"ONNXEnable": false,
"pyTorchEnable": true,
"MMVCCorrespondense": false,
"pyTorchClusterEnable": true,
"showPyTorchDefault": true
},
"deviceSetting": {},
"qualityControl": {
"F0DetectorEnable": true
},
"speakerSetting": {
"showSpeakerF0": false,
"srcIdEnable": false,
"editSpeakerIdMappingEnable": false,
"f0FactorEnable": false,
"tuningEnable": true,
"clusterInferRationEnable": true,
"noiseScaleEnable": true,
"silentThresholdEnable": true
},
"converterSetting": {
"extraDataLengthEnable": true
},
"advancedSetting": {
"serverURLEnable": true,
"protocolEnable": true,
"sampleRateEnable": true,
"sendingSampleRateEnable": true,
"crossFadeOverlapSizeEnable": true,
"crossFadeOffsetRateEnable": true,
"crossFadeEndRateEnable": true,
"downSamplingModeEnable": true,
"trancateNumTresholdEnable": true
}
},
"dialogs": {
"license": [
{
"title": "c",
"auther": "c",
"contact": "b",
"url": "a",
"license": "MIT"
}
]
}
}

59
client/demo_v13/public/assets/gui_settings/so-vits-svc-40v2.json Normal file
View File

@ -0,0 +1,59 @@
{
"type": "demo",
"id": "so-vits-svc-40v2",
"front": {
"title": {
"mainTitle": "VC Client",
"subTitle": "for so-vits-svc-40v2",
"lineNum": 1
},
"serverControl": {},
"modelSetting": {
"ONNXEnable": false,
"pyTorchEnable": true,
"MMVCCorrespondense": false,
"pyTorchClusterEnable": true,
"showPyTorchDefault": true
},
"deviceSetting": {},
"qualityControl": {
"F0DetectorEnable": true
},
"speakerSetting": {
"showSpeakerF0": false,
"srcIdEnable": false,
"editSpeakerIdMappingEnable": false,
"f0FactorEnable": false,
"tuningEnable": true,
"clusterInferRationEnable": true,
"noiseScaleEnable": true,
"silentThresholdEnable": true
},
"converterSetting": {
"extraDataLengthEnable": true
},
"advancedSetting": {
"serverURLEnable": true,
"protocolEnable": true,
"sampleRateEnable": true,
"sendingSampleRateEnable": true,
"crossFadeOverlapSizeEnable": true,
"crossFadeOffsetRateEnable": true,
"crossFadeEndRateEnable": true,
"downSamplingModeEnable": true,
"trancateNumTresholdEnable": true
}
},
"dialogs": {
"license": [
{
"title": "c",
"auther": "c",
"contact": "b",
"url": "a",
"license": "MIT"
}
]
}
}

18
client/demo_v13/src/000_index.tsx
View File

@ -2,13 +2,13 @@ import * as React from "react";
import { createRoot } from "react-dom/client"; import { createRoot } from "react-dom/client";
import "./css/App.css" import "./css/App.css"
import { ErrorInfo, useMemo, useState, } from "react"; import { ErrorInfo, useMemo, useState, } from "react";
import { AppStateProvider, useAppState } from "./001_provider/001_AppStateProvider"; import { AppStateProvider } from "./001_provider/001_AppStateProvider";
import { library } from "@fortawesome/fontawesome-svg-core"; import { library } from "@fortawesome/fontawesome-svg-core";
import { fas } from "@fortawesome/free-solid-svg-icons"; import { fas } from "@fortawesome/free-solid-svg-icons";
import { far } from "@fortawesome/free-regular-svg-icons"; import { far } from "@fortawesome/free-regular-svg-icons";
import { fab } from "@fortawesome/free-brands-svg-icons"; import { fab } from "@fortawesome/free-brands-svg-icons";
import { AppRootProvider } from "./001_provider/001_AppRootProvider"; import { AppRootProvider, useAppRoot } from "./001_provider/001_AppRootProvider";
import ErrorBoundary from "./001_provider/900_ErrorBoundary"; import ErrorBoundary from "./001_provider/900_ErrorBoundary";
import { INDEXEDDB_KEY_CLIENT, INDEXEDDB_KEY_MODEL_DATA, INDEXEDDB_KEY_SERVER, INDEXEDDB_KEY_WORKLET, INDEXEDDB_KEY_WORKLETNODE, useIndexedDB } from "@dannadori/voice-changer-client-js"; import { INDEXEDDB_KEY_CLIENT, INDEXEDDB_KEY_MODEL_DATA, INDEXEDDB_KEY_SERVER, INDEXEDDB_KEY_WORKLET, INDEXEDDB_KEY_WORKLETNODE, useIndexedDB } from "@dannadori/voice-changer-client-js";
import { CLIENT_TYPE, INDEXEDDB_KEY_AUDIO_OUTPUT } from "./const"; import { CLIENT_TYPE, INDEXEDDB_KEY_AUDIO_OUTPUT } from "./const";
@ -21,14 +21,14 @@ const container = document.getElementById("app")!;
const root = createRoot(container); const root = createRoot(container);
const App = () => { const App = () => {
const appState = useAppState() const { appGuiSettingState } = useAppRoot()
const front = useMemo(() => { const front = useMemo(() => {
if (appState.appGuiSettingState.appGuiSetting.type == "demo") { if (appGuiSettingState.appGuiSetting.type == "demo") {
return <Demo></Demo> return <Demo></Demo>
} else { } else {
return <>unknown gui type. {appState.appGuiSettingState.appGuiSetting.type}</> return <>unknown gui type. {appGuiSettingState.appGuiSetting.type}</>
} }
}, [appState.appGuiSettingState.appGuiSetting.type]) }, [appGuiSettingState.appGuiSetting.type])
return ( return (
<> <>
@ -38,6 +38,7 @@ const App = () => {
} }
const AppStateWrapper = () => { const AppStateWrapper = () => {
const { appGuiSettingState } = useAppRoot()
// エラーバウンダリー設定 // エラーバウンダリー設定
const [error, setError] = useState<{ error: Error, errorInfo: ErrorInfo }>() const [error, setError] = useState<{ error: Error, errorInfo: ErrorInfo }>()
const { removeItem } = useIndexedDB({ clientType: CLIENT_TYPE }) const { removeItem } = useIndexedDB({ clientType: CLIENT_TYPE })
@ -95,6 +96,9 @@ const AppStateWrapper = () => {
setError({ error, errorInfo }) setError({ error, errorInfo })
} }
if (!appGuiSettingState.guiSettingLoaded) {
return <></>
} else {
return ( return (
<ErrorBoundary fallback={errorComponent} onError={updateError}> <ErrorBoundary fallback={errorComponent} onError={updateError}>
<AppStateProvider> <AppStateProvider>
@ -104,6 +108,8 @@ const AppStateWrapper = () => {
) )
} }
}
root.render( root.render(
<AppRootProvider> <AppRootProvider>
<AppStateWrapper></AppStateWrapper> <AppStateWrapper></AppStateWrapper>

6
client/demo_v13/src/001_globalHooks/001_useAppGuiSetting.ts
View File

@ -19,6 +19,7 @@ export type AppGuiDemoSetting = {
"pyTorchEnable": boolean, "pyTorchEnable": boolean,
"MMVCCorrespondense": boolean, "MMVCCorrespondense": boolean,
"pyTorchClusterEnable": boolean, "pyTorchClusterEnable": boolean,
"showPyTorchDefault": boolean
}, },
"deviceSetting": {}, "deviceSetting": {},
"qualityControl": { "qualityControl": {
@ -73,6 +74,7 @@ const InitialAppGuiDemoSetting: AppGuiDemoSetting = {
"pyTorchEnable": false, "pyTorchEnable": false,
"MMVCCorrespondense": false, "MMVCCorrespondense": false,
"pyTorchClusterEnable": false, "pyTorchClusterEnable": false,
"showPyTorchDefault": false
}, },
"deviceSetting": {}, "deviceSetting": {},
"qualityControl": { "qualityControl": {
@ -112,6 +114,7 @@ const InitialAppGuiDemoSetting: AppGuiDemoSetting = {
export type AppGuiSettingState = { export type AppGuiSettingState = {
appGuiSetting: AppGuiSetting appGuiSetting: AppGuiSetting
guiSettingLoaded: boolean
} }
export type AppGuiSettingStateAndMethod = AppGuiSettingState & { export type AppGuiSettingStateAndMethod = AppGuiSettingState & {
@ -119,6 +122,7 @@ export type AppGuiSettingStateAndMethod = AppGuiSettingState & {
} }
export const userAppGuiSetting = (): AppGuiSettingStateAndMethod => { export const userAppGuiSetting = (): AppGuiSettingStateAndMethod => {
const [guiSettingLoaded, setGuiSettingLoaded] = useState<boolean>(false)
const [appGuiSetting, setAppGuiSetting] = useState<AppGuiSetting>(InitialAppGuiDemoSetting) const [appGuiSetting, setAppGuiSetting] = useState<AppGuiSetting>(InitialAppGuiDemoSetting)
const getAppSetting = async (url: string) => { const getAppSetting = async (url: string) => {
const res = await fetch(`${url}`, { const res = await fetch(`${url}`, {
@ -126,9 +130,11 @@ export const userAppGuiSetting = (): AppGuiSettingStateAndMethod => {
}) })
const appSetting = await res.json() as AppGuiSetting const appSetting = await res.json() as AppGuiSetting
setAppGuiSetting(appSetting) setAppGuiSetting(appSetting)
setGuiSettingLoaded(true)
} }
return { return {
appGuiSetting, appGuiSetting,
guiSettingLoaded,
getAppSetting, getAppSetting,
} }
} }

8
client/demo_v13/src/001_globalHooks/001_useVCClient.ts
View File

@ -1,8 +1,9 @@
import { ClientState, useClient } from "@dannadori/voice-changer-client-js" import { ClientState, useClient, ClientType } from "@dannadori/voice-changer-client-js"
import { AUDIO_ELEMENT_FOR_PLAY_RESULT, CLIENT_TYPE } from "../const" import { AUDIO_ELEMENT_FOR_PLAY_RESULT } from "../const"
export type UseVCClientProps = { export type UseVCClientProps = {
audioContext: AudioContext | null audioContext: AudioContext | null
clientType: ClientType
} }
export type VCClientState = { export type VCClientState = {
@ -10,9 +11,8 @@ export type VCClientState = {
} }
export const useVCClient = (props: UseVCClientProps) => { export const useVCClient = (props: UseVCClientProps) => {
const clientState = useClient({ const clientState = useClient({
clientType: CLIENT_TYPE, clientType: props.clientType,
audioContext: props.audioContext, audioContext: props.audioContext,
audioOutputElementId: AUDIO_ELEMENT_FOR_PLAY_RESULT audioOutputElementId: AUDIO_ELEMENT_FOR_PLAY_RESULT
}) })

15
client/demo_v13/src/001_provider/001_AppRootProvider.tsx
View File

@ -1,5 +1,6 @@
import React, { useContext } from "react"; import React, { useContext, useEffect } from "react";
import { ReactNode } from "react"; import { ReactNode } from "react";
import { AppGuiSettingStateAndMethod, userAppGuiSetting } from "../001_globalHooks/001_useAppGuiSetting";
import { AudioConfigState, useAudioConfig } from "../001_globalHooks/001_useAudioConfig"; import { AudioConfigState, useAudioConfig } from "../001_globalHooks/001_useAudioConfig";
type Props = { type Props = {
@ -8,7 +9,7 @@ type Props = {
type AppRootValue = { type AppRootValue = {
audioContextState: AudioConfigState audioContextState: AudioConfigState
appGuiSettingState: AppGuiSettingStateAndMethod
} }
const AppRootContext = React.createContext<AppRootValue | null>(null); const AppRootContext = React.createContext<AppRootValue | null>(null);
@ -22,9 +23,17 @@ export const useAppRoot = (): AppRootValue => {
export const AppRootProvider = ({ children }: Props) => { export const AppRootProvider = ({ children }: Props) => {
const audioContextState = useAudioConfig() const audioContextState = useAudioConfig()
const appGuiSettingState = userAppGuiSetting()
useEffect(() => {
const params = new URLSearchParams(window.location.search);
const modelType = params.get("modelType") || ""
appGuiSettingState.getAppSetting(`/assets/gui_settings/${modelType}.json`)
}, [])
const providerValue: AppRootValue = { const providerValue: AppRootValue = {
audioContextState, audioContextState,
appGuiSettingState
}; };
return <AppRootContext.Provider value={providerValue}>{children}</AppRootContext.Provider>; return <AppRootContext.Provider value={providerValue}>{children}</AppRootContext.Provider>;
}; };

13
client/demo_v13/src/001_provider/001_AppStateProvider.tsx
View File

@ -1,7 +1,6 @@
import { ClientState } from "@dannadori/voice-changer-client-js"; import { ClientState } from "@dannadori/voice-changer-client-js";
import React, { useContext, useEffect, useRef } from "react"; import React, { useContext, useEffect, useRef } from "react";
import { ReactNode } from "react"; import { ReactNode } from "react";
import { AppGuiSettingStateAndMethod, userAppGuiSetting } from "../001_globalHooks/001_useAppGuiSetting";
import { useVCClient } from "../001_globalHooks/001_useVCClient"; import { useVCClient } from "../001_globalHooks/001_useVCClient";
import { useAppRoot } from "./001_AppRootProvider"; import { useAppRoot } from "./001_AppRootProvider";
@ -12,7 +11,6 @@ type Props = {
type AppStateValue = ClientState & { type AppStateValue = ClientState & {
audioContext: AudioContext audioContext: AudioContext
initializedRef: React.MutableRefObject<boolean> initializedRef: React.MutableRefObject<boolean>
appGuiSettingState: AppGuiSettingStateAndMethod
} }
const AppStateContext = React.createContext<AppStateValue | null>(null); const AppStateContext = React.createContext<AppStateValue | null>(null);
@ -26,8 +24,8 @@ export const useAppState = (): AppStateValue => {
export const AppStateProvider = ({ children }: Props) => { export const AppStateProvider = ({ children }: Props) => {
const appRoot = useAppRoot() const appRoot = useAppRoot()
const clientState = useVCClient({ audioContext: appRoot.audioContextState.audioContext }) const clientState = useVCClient({ audioContext: appRoot.audioContextState.audioContext, clientType: appRoot.appGuiSettingState.appGuiSetting.id })
const appGuiSettingState = userAppGuiSetting()
const initializedRef = useRef<boolean>(false) const initializedRef = useRef<boolean>(false)
useEffect(() => { useEffect(() => {
@ -61,17 +59,12 @@ export const AppStateProvider = ({ children }: Props) => {
} }
}, [clientState.clientState.initialized]) }, [clientState.clientState.initialized])
useEffect(() => {
const params = new URLSearchParams(window.location.search);
const modelType = params.get("modelType") || ""
appGuiSettingState.getAppSetting(`/assets/gui_settings/${modelType}.json`)
}, [])
const providerValue: AppStateValue = { const providerValue: AppStateValue = {
audioContext: appRoot.audioContextState.audioContext!, audioContext: appRoot.audioContextState.audioContext!,
...clientState.clientState, ...clientState.clientState,
initializedRef, initializedRef,
appGuiSettingState
}; };
return <AppStateContext.Provider value={providerValue}>{children}</AppStateContext.Provider>; return <AppStateContext.Provider value={providerValue}>{children}</AppStateContext.Provider>;

1
client/demo_v13/src/components/demo/010_Demo.tsx
View File

@ -1,5 +1,4 @@
import React from "react" import React from "react"
import { AUDIO_ELEMENT_FOR_PLAY_RESULT, AUDIO_ELEMENT_FOR_TEST_CONVERTED, AUDIO_ELEMENT_FOR_TEST_CONVERTED_ECHOBACK, AUDIO_ELEMENT_FOR_TEST_ORIGINAL } from "../../const";
import { GuiStateProvider } from "./001_GuiStateProvider"; import { GuiStateProvider } from "./001_GuiStateProvider";
import { Dialogs } from "./900_Dialogs"; import { Dialogs } from "./900_Dialogs";
import { TitleArea } from "./100_TitleArea"; import { TitleArea } from "./100_TitleArea";

4
client/demo_v13/src/components/demo/101_Title.tsx
View File

@ -1,11 +1,11 @@
import React, { useMemo } from "react"; import React, { useMemo } from "react";
import { useAppState } from "../../001_provider/001_AppStateProvider"; import { useAppRoot } from "../../001_provider/001_AppRootProvider";
import { isDesktopApp } from "../../const"; import { isDesktopApp } from "../../const";
import { useGuiState } from "./001_GuiStateProvider"; import { useGuiState } from "./001_GuiStateProvider";
export const Title = () => { export const Title = () => {
const { appGuiSettingState } = useAppState() const { appGuiSettingState } = useAppRoot()
const guiState = useGuiState() const guiState = useGuiState()
const titleSetting = appGuiSettingState.appGuiSetting.front.title const titleSetting = appGuiSettingState.appGuiSetting.front.title

4
client/demo_v13/src/components/demo/102_ClearSettingRow.tsx
View File

@ -2,10 +2,12 @@ import React, { useMemo } from "react";
import { useAppState } from "../../001_provider/001_AppStateProvider"; import { useAppState } from "../../001_provider/001_AppStateProvider";
import { useIndexedDB } from "@dannadori/voice-changer-client-js"; import { useIndexedDB } from "@dannadori/voice-changer-client-js";
import { INDEXEDDB_KEY_AUDIO_OUTPUT } from "../../const"; import { INDEXEDDB_KEY_AUDIO_OUTPUT } from "../../const";
import { useAppRoot } from "../../001_provider/001_AppRootProvider";
export const ClearSettingRow = () => { export const ClearSettingRow = () => {
const appState = useAppState() const appState = useAppState()
const clientType = appState.appGuiSettingState.appGuiSetting.id const { appGuiSettingState } = useAppRoot()
const clientType = appGuiSettingState.appGuiSetting.id
const { removeItem } = useIndexedDB({ clientType: clientType }) const { removeItem } = useIndexedDB({ clientType: clientType })

9
client/demo_v13/src/components/demo/301_ModelUploaderRow.tsx
View File

@ -1,8 +1,15 @@
import React, { useMemo } from "react" import React, { useMemo, useEffect } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useGuiState } from "./001_GuiStateProvider" import { useGuiState } from "./001_GuiStateProvider"
export const ModelUploaderRow = () => { export const ModelUploaderRow = () => {
const guiState = useGuiState() const guiState = useGuiState()
const { appGuiSettingState } = useAppRoot()
useEffect(() => {
if (appGuiSettingState.appGuiSetting.front.modelSetting.showPyTorchDefault) {
guiState.setShowPyTorchModelUpload(true)
}
}, [])
const modelUploaderRow = useMemo(() => { const modelUploaderRow = useMemo(() => {
return ( return (

5
client/demo_v13/src/components/demo/303_ONNXSelectRow.tsx
View File

@ -2,10 +2,13 @@ import React, { useMemo } from "react"
import { fileSelector } from "@dannadori/voice-changer-client-js" import { fileSelector } from "@dannadori/voice-changer-client-js"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const ONNXSelectRow = () => { export const ONNXSelectRow = () => {
const appState = useAppState() const appState = useAppState()
const modelSetting = appState.appGuiSettingState.appGuiSetting.front.modelSetting const { appGuiSettingState } = useAppRoot()
const modelSetting = appGuiSettingState.appGuiSetting.front.modelSetting
const onnxSelectRow = useMemo(() => { const onnxSelectRow = useMemo(() => {
if (!modelSetting.ONNXEnable) { if (!modelSetting.ONNXEnable) {

4
client/demo_v13/src/components/demo/304_PyTorchSelectRow.tsx
View File

@ -3,10 +3,12 @@ import { fileSelector } from "@dannadori/voice-changer-client-js"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { useGuiState } from "./001_GuiStateProvider" import { useGuiState } from "./001_GuiStateProvider"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const PyTorchSelectRow = () => { export const PyTorchSelectRow = () => {
const appState = useAppState() const appState = useAppState()
const modelSetting = appState.appGuiSettingState.appGuiSetting.front.modelSetting const { appGuiSettingState } = useAppRoot()
const modelSetting = appGuiSettingState.appGuiSetting.front.modelSetting
const guiState = useGuiState() const guiState = useGuiState()
const pyTorchSelectRow = useMemo(() => { const pyTorchSelectRow = useMemo(() => {

4
client/demo_v13/src/components/demo/305_CorrespondenceSelectRow.tsx
View File

@ -2,10 +2,12 @@ import React, { useMemo } from "react"
import { fileSelector, Correspondence } from "@dannadori/voice-changer-client-js" import { fileSelector, Correspondence } from "@dannadori/voice-changer-client-js"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const CorrespondenceSelectRow = () => { export const CorrespondenceSelectRow = () => {
const appState = useAppState() const appState = useAppState()
const modelSetting = appState.appGuiSettingState.appGuiSetting.front.modelSetting const { appGuiSettingState } = useAppRoot()
const modelSetting = appGuiSettingState.appGuiSetting.front.modelSetting
const CorrespondenceSelectRow = useMemo(() => { const CorrespondenceSelectRow = useMemo(() => {
if (!modelSetting.MMVCCorrespondense) { if (!modelSetting.MMVCCorrespondense) {

4
client/demo_v13/src/components/demo/306_PyTorchClusterSelectRow.tsx
View File

@ -2,10 +2,12 @@ import React, { useMemo } from "react"
import { fileSelector } from "@dannadori/voice-changer-client-js" import { fileSelector } from "@dannadori/voice-changer-client-js"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const PyTorchClusterSelectRow = () => { export const PyTorchClusterSelectRow = () => {
const appState = useAppState() const appState = useAppState()
const modelSetting = appState.appGuiSettingState.appGuiSetting.front.modelSetting const { appGuiSettingState } = useAppRoot()
const modelSetting = appGuiSettingState.appGuiSetting.front.modelSetting
const pyTorchSelectRow = useMemo(() => { const pyTorchSelectRow = useMemo(() => {
if (!modelSetting.pyTorchClusterEnable) { if (!modelSetting.pyTorchClusterEnable) {

6
client/demo_v13/src/components/demo/403_AudioOutputRow.tsx
View File

@ -1,13 +1,13 @@
import React, { useMemo, useEffect } from "react" import React, { useMemo, useEffect } from "react"
import { useGuiState } from "./001_GuiStateProvider" import { useGuiState } from "./001_GuiStateProvider"
import { useIndexedDB } from "@dannadori/voice-changer-client-js" import { useIndexedDB } from "@dannadori/voice-changer-client-js"
import { useAppState } from "../../001_provider/001_AppStateProvider"
import { AUDIO_ELEMENT_FOR_PLAY_RESULT, AUDIO_ELEMENT_FOR_TEST_CONVERTED_ECHOBACK, AUDIO_ELEMENT_FOR_TEST_ORIGINAL, INDEXEDDB_KEY_AUDIO_OUTPUT } from "../../const" import { AUDIO_ELEMENT_FOR_PLAY_RESULT, AUDIO_ELEMENT_FOR_TEST_CONVERTED_ECHOBACK, AUDIO_ELEMENT_FOR_TEST_ORIGINAL, INDEXEDDB_KEY_AUDIO_OUTPUT } from "../../const"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const AudioOutputRow = () => { export const AudioOutputRow = () => {
const guiState = useGuiState() const guiState = useGuiState()
const appState = useAppState() const { appGuiSettingState } = useAppRoot()
const clientType = appState.appGuiSettingState.appGuiSetting.id const clientType = appGuiSettingState.appGuiSetting.id
const { getItem, setItem } = useIndexedDB({ clientType: clientType }) const { getItem, setItem } = useIndexedDB({ clientType: clientType })

4
client/demo_v13/src/components/demo/503_F0DetectorRow.tsx
View File

@ -1,10 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { F0Detector } from "@dannadori/voice-changer-client-js"; import { F0Detector } from "@dannadori/voice-changer-client-js";
import { useAppRoot } from "../../001_provider/001_AppRootProvider";
export const F0DetectorRow = () => { export const F0DetectorRow = () => {
const appState = useAppState() const appState = useAppState()
const qualityControlSetting = appState.appGuiSettingState.appGuiSetting.front.qualityControl const { appGuiSettingState } = useAppRoot()
const qualityControlSetting = appGuiSettingState.appGuiSetting.front.qualityControl
const f0DetectorRow = useMemo(() => { const f0DetectorRow = useMemo(() => {
if (!qualityControlSetting.F0DetectorEnable) { if (!qualityControlSetting.F0DetectorEnable) {
return <></> return <></>

4
client/demo_v13/src/components/demo/601_SrcIdRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const SrcIdRow = () => { export const SrcIdRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const srcIdRow = useMemo(() => { const srcIdRow = useMemo(() => {
if (!speakerSetting.srcIdEnable) { if (!speakerSetting.srcIdEnable) {

48
client/demo_v13/src/components/demo/602_DstIdRow.tsx
View File

@ -1,14 +1,17 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { ServerInfoSoVitsSVC } from "@dannadori/voice-changer-client-js";
export const DstIdRow = () => { export const DstIdRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const clientId = appGuiSettingState.appGuiSetting.id
const dstIdRow = useMemo(() => { const dstIdRow = useMemo(() => {
if (speakerSetting.showSpeakerF0) { if (clientId != "MMVCv13") {
return <></> return <></>
} }
return ( return (
<div className="body-row split-3-2-1-4 left-padding-1 guided"> <div className="body-row split-3-2-1-4 left-padding-1 guided">
<div className="body-item-title left-padding-1">Destination Speaker Id</div> <div className="body-item-title left-padding-1">Destination Speaker Id</div>
@ -31,10 +34,8 @@ export const DstIdRow = () => {
) )
}, [appState.serverSetting.serverSetting, appState.clientSetting.clientSetting.speakers, appState.serverSetting.updateServerSettings]) }, [appState.serverSetting.serverSetting, appState.clientSetting.clientSetting.speakers, appState.serverSetting.updateServerSettings])
const dstIdRowWithF0 = useMemo(() => { const dstIdRowWithF0 = useMemo(() => {
if (!speakerSetting.showSpeakerF0) { if (clientId != "MMVCv15") {
return <></> return <></>
} }
const selected = appState.clientSetting.clientSetting.correspondences?.find(x => { const selected = appState.clientSetting.clientSetting.correspondences?.find(x => {
@ -63,16 +64,45 @@ export const DstIdRow = () => {
<div className="body-item-text"></div> <div className="body-item-text"></div>
</div> </div>
) )
}, [appState.serverSetting.serverSetting, appState.serverSetting.updateServerSettings, appState.clientSetting.clientSetting.correspondences]) }, [appState.serverSetting.serverSetting, appState.serverSetting.updateServerSettings, appState.clientSetting.clientSetting.correspondences])
const dstIdRowFromServer = useMemo(() => {
const settings = appState.serverSetting.serverSetting as ServerInfoSoVitsSVC
const speakers = settings.speakers
if (!speakers) {
return <></>
}
const currentValue = Object.values(speakers).includes(appState.serverSetting.serverSetting.dstId) ? appState.serverSetting.serverSetting.dstId : -1
return (
<div className="body-row split-3-2-1-4 left-padding-1 guided">
<div className="body-item-title left-padding-1">Destination Speaker Id</div>
<div className="body-select-container">
<select className="body-select" value={currentValue} onChange={(e) => {
appState.serverSetting.updateServerSettings({ ...appState.serverSetting.serverSetting, dstId: Number(e.target.value) })
}}>
<option key="unknown" value={0}>default(0)</option>
{
Object.keys(speakers).map(x => {
return <option key={x} value={speakers[x]}>{x}({speakers[x]})</option>
})
}
</select>
</div>
<div className="body-item-text">
</div>
<div className="body-item-text"></div>
</div>
)
}, [appState.serverSetting.serverSetting, appState.serverSetting.updateServerSettings, appState.clientSetting.clientSetting.correspondences])
return ( return (
<> <>
{dstIdRow} {dstIdRow}
{dstIdRowWithF0} {dstIdRowWithF0}
{dstIdRowFromServer}
</> </>
) )
} }

4
client/demo_v13/src/components/demo/603_EditSpeakerIdMappingRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo, useState } from "react" import React, { useMemo, useState } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const EditSpeakerIdMappingRow = () => { export const EditSpeakerIdMappingRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const [editSpeakerTargetId, setEditSpeakerTargetId] = useState<number>(0) const [editSpeakerTargetId, setEditSpeakerTargetId] = useState<number>(0)
const [editSpeakerTargetName, setEditSpeakerTargetName] = useState<string>("") const [editSpeakerTargetName, setEditSpeakerTargetName] = useState<string>("")

4
client/demo_v13/src/components/demo/604_F0FactorRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const F0FactorRow = () => { export const F0FactorRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const f0FactorRow = useMemo(() => { const f0FactorRow = useMemo(() => {
if (!speakerSetting.f0FactorEnable) { if (!speakerSetting.f0FactorEnable) {

4
client/demo_v13/src/components/demo/605_TuneRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const TuneRow = () => { export const TuneRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const tuneRow = useMemo(() => { const tuneRow = useMemo(() => {
if (!speakerSetting.tuningEnable) { if (!speakerSetting.tuningEnable) {

5
client/demo_v13/src/components/demo/606_ClusterInferRatioRow.tsx
View File

@ -1,9 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const ClusterInferRatioRow = () => { export const ClusterInferRatioRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const clusterRatioRow = useMemo(() => { const clusterRatioRow = useMemo(() => {
if (!speakerSetting.clusterInferRationEnable) { if (!speakerSetting.clusterInferRationEnable) {

4
client/demo_v13/src/components/demo/607_NoiseScaleRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const NoiseScaleRow = () => { export const NoiseScaleRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const noiseScaleRow = useMemo(() => { const noiseScaleRow = useMemo(() => {
if (!speakerSetting.noiseScaleEnable) { if (!speakerSetting.noiseScaleEnable) {

5
client/demo_v13/src/components/demo/608_SilentThresholdRow.tsx
View File

@ -1,9 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const SilentThresholdRow = () => { export const SilentThresholdRow = () => {
const appState = useAppState() const appState = useAppState()
const speakerSetting = appState.appGuiSettingState.appGuiSetting.front.speakerSetting const { appGuiSettingState } = useAppRoot()
const speakerSetting = appGuiSettingState.appGuiSetting.front.speakerSetting
const silentThresholdRow = useMemo(() => { const silentThresholdRow = useMemo(() => {
if (!speakerSetting.silentThresholdEnable) { if (!speakerSetting.silentThresholdEnable) {

4
client/demo_v13/src/components/demo/702_ExtraDataLengthRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const ExtraDataLengthRow = () => { export const ExtraDataLengthRow = () => {
const appState = useAppState() const appState = useAppState()
const converterSetting = appState.appGuiSettingState.appGuiSetting.front.converterSetting const { appGuiSettingState } = useAppRoot()
const converterSetting = appGuiSettingState.appGuiSetting.front.converterSetting
const extraDataLengthRow = useMemo(() => { const extraDataLengthRow = useMemo(() => {

4
client/demo_v13/src/components/demo/801_ServerURLRow.tsx
View File

@ -1,9 +1,11 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const ServerURLRow = () => { export const ServerURLRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const serverUrlRow = useMemo(() => { const serverUrlRow = useMemo(() => {
if (!advancedSetting.serverURLEnable) { if (!advancedSetting.serverURLEnable) {

4
client/demo_v13/src/components/demo/802_ProtocolRow.tsx
View File

@ -1,10 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { Protocol } from "@dannadori/voice-changer-client-js" import { Protocol } from "@dannadori/voice-changer-client-js"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const ProtocolRow = () => { export const ProtocolRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const protocolRow = useMemo(() => { const protocolRow = useMemo(() => {
if (!advancedSetting.protocolEnable) { if (!advancedSetting.protocolEnable) {

4
client/demo_v13/src/components/demo/803_SampleRateRow.tsx
View File

@ -1,10 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { SampleRate } from "@dannadori/voice-changer-client-js" import { SampleRate } from "@dannadori/voice-changer-client-js"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const SampleRateRow = () => { export const SampleRateRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const sampleRateRow = useMemo(() => { const sampleRateRow = useMemo(() => {
if (!advancedSetting.sampleRateEnable) { if (!advancedSetting.sampleRateEnable) {

5
client/demo_v13/src/components/demo/804_SendingSampleRateRow.tsx
View File

@ -1,10 +1,13 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { InputSampleRate } from "@dannadori/voice-changer-client-js" import { InputSampleRate } from "@dannadori/voice-changer-client-js"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const SendingSampleRateRow = () => { export const SendingSampleRateRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const sendingSampleRateRow = useMemo(() => { const sendingSampleRateRow = useMemo(() => {
if (!advancedSetting.sendingSampleRateEnable) { if (!advancedSetting.sendingSampleRateEnable) {

5
client/demo_v13/src/components/demo/805_CrossFadeOverlapSizeRow.tsx
View File

@ -1,10 +1,13 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { CrossFadeOverlapSize } from "@dannadori/voice-changer-client-js" import { CrossFadeOverlapSize } from "@dannadori/voice-changer-client-js"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const CrossFadeOverlapSizeRow = () => { export const CrossFadeOverlapSizeRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const crossFadeOverlapSizeRow = useMemo(() => { const crossFadeOverlapSizeRow = useMemo(() => {
if (!advancedSetting.crossFadeOverlapSizeEnable) { if (!advancedSetting.crossFadeOverlapSizeEnable) {

5
client/demo_v13/src/components/demo/806_CrossFadeOffsetRateRow.tsx
View File

@ -1,9 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const CrossFadeOffsetRateRow = () => { export const CrossFadeOffsetRateRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const crossFadeOffsetRateRow = useMemo(() => { const crossFadeOffsetRateRow = useMemo(() => {
if (!advancedSetting.crossFadeOffsetRateEnable) { if (!advancedSetting.crossFadeOffsetRateEnable) {

5
client/demo_v13/src/components/demo/807_CrossFadeEndRateRow.tsx
View File

@ -1,9 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const CrossFadeEndRateRow = () => { export const CrossFadeEndRateRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const crossFadeEndRateRow = useMemo(() => { const crossFadeEndRateRow = useMemo(() => {
if (!advancedSetting.crossFadeEndRateEnable) { if (!advancedSetting.crossFadeEndRateEnable) {

5
client/demo_v13/src/components/demo/808_DownSamplingModeRow.tsx
View File

@ -1,10 +1,13 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
import { DownSamplingMode } from "@dannadori/voice-changer-client-js" import { DownSamplingMode } from "@dannadori/voice-changer-client-js"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
export const DownSamplingModeRow = () => { export const DownSamplingModeRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const downSamplingModeRow = useMemo(() => { const downSamplingModeRow = useMemo(() => {
if (!advancedSetting.downSamplingModeEnable) { if (!advancedSetting.downSamplingModeEnable) {

5
client/demo_v13/src/components/demo/809_TrancateNumTresholdRow.tsx
View File

@ -1,9 +1,12 @@
import React, { useMemo } from "react" import React, { useMemo } from "react"
import { useAppRoot } from "../../001_provider/001_AppRootProvider"
import { useAppState } from "../../001_provider/001_AppStateProvider" import { useAppState } from "../../001_provider/001_AppStateProvider"
export const TrancateNumTresholdRow = () => { export const TrancateNumTresholdRow = () => {
const appState = useAppState() const appState = useAppState()
const advancedSetting = appState.appGuiSettingState.appGuiSetting.front.advancedSetting const { appGuiSettingState } = useAppRoot()
const advancedSetting = appGuiSettingState.appGuiSetting.front.advancedSetting
const trancateNumTresholdRow = useMemo(() => { const trancateNumTresholdRow = useMemo(() => {
if (!advancedSetting.trancateNumTresholdEnable) { if (!advancedSetting.trancateNumTresholdEnable) {

4
client/demo_v13/src/components/demo/901_LicenseDialog.tsx
View File

@ -1,10 +1,10 @@
import React, { useMemo } from "react"; import React, { useMemo } from "react";
import { useAppState } from "../../001_provider/001_AppStateProvider"; import { useAppRoot } from "../../001_provider/001_AppRootProvider";
import { useGuiState } from "./001_GuiStateProvider"; import { useGuiState } from "./001_GuiStateProvider";
export const LicenseDialog = () => { export const LicenseDialog = () => {
const { appGuiSettingState } = useAppState() const { appGuiSettingState } = useAppRoot()
const guiState = useGuiState() const guiState = useGuiState()
const licenses = appGuiSettingState.appGuiSetting.dialogs.license const licenses = appGuiSettingState.appGuiSetting.dialogs.license

17
server/const.py
View File

@ -35,6 +35,23 @@ def setModelType(_modelType: str):
def getFrontendPath(): def getFrontendPath():
if modelType == "MMVCv15":
frontend_path = os.path.join(sys._MEIPASS, "dist_v13") if hasattr(sys, "_MEIPASS") else "../client/demo_v13/dist"
elif modelType == "MMVCv13":
frontend_path = os.path.join(sys._MEIPASS, "dist_v13") if hasattr(sys, "_MEIPASS") else "../client/demo_v13/dist"
elif modelType == "so-vits-svc-40":
frontend_path = os.path.join(sys._MEIPASS, "dist_v13") if hasattr(sys, "_MEIPASS") else "../client/demo_v13/dist"
elif modelType == "so-vits-svc-40v2":
frontend_path = os.path.join(sys._MEIPASS, "dist_v13") if hasattr(sys, "_MEIPASS") else "../client/demo_v13/dist"
elif modelType == "DDSP-SVC":
frontend_path = os.path.join(sys._MEIPASS, "dist_v13") if hasattr(sys, "_MEIPASS") else "../client/demo_v13/dist"
elif modelType == "so-vits-svc-40_c":
frontend_path = os.path.join(sys._MEIPASS, "dist_v13") if hasattr(sys, "_MEIPASS") \
else "../client/demo_v13/dist"
return frontend_path
def getFrontendPath2():
if modelType == "MMVCv15": if modelType == "MMVCv15":
frontend_path = os.path.join(sys._MEIPASS, "dist_v15") if hasattr(sys, "_MEIPASS") else "../client/demo_v15/dist" frontend_path = os.path.join(sys._MEIPASS, "dist_v15") if hasattr(sys, "_MEIPASS") else "../client/demo_v15/dist"
elif modelType == "MMVCv13": elif modelType == "MMVCv13":