remove old gui 4

This commit is contained in:
wataru 2023-06-25 16:39:18 +09:00
parent 767dfc520c
commit 73a96c654a
19 changed files with 202 additions and 211 deletions

File diff suppressed because one or more lines are too long

View File

@ -39,8 +39,8 @@ export const AppStateProvider = ({ children }: Props) => {
useEffect(() => {
if (clientState.clientState.initialized) {
initializedRef.current = true
clientState.clientState.clientSetting.updateClientSetting({
...clientState.clientState.clientSetting.clientSetting
clientState.clientState.setVoiceChangerClientSetting({
...clientState.clientState.setting.voiceChangerClientSetting
})
}
}, [clientState.clientState.initialized])

View File

@ -6,7 +6,7 @@ import { CrossFadeOverlapSize, Protocol } from "@dannadori/voice-changer-client-
export const AdvancedSettingDialog = () => {
const guiState = useGuiState()
const { workletNodeSetting, workletSetting, serverSetting } = useAppState()
const { setting, serverSetting, setWorkletNodeSetting, setWorkletSetting } = useAppState()
const dialog = useMemo(() => {
const closeButtonRow = (
<div className="body-row split-3-4-3 left-padding-1">
@ -21,7 +21,7 @@ export const AdvancedSettingDialog = () => {
)
const onProtocolChanged = async (val: Protocol) => {
workletNodeSetting.updateWorkletNodeSetting({ ...workletNodeSetting.workletNodeSetting, protocol: val })
setWorkletNodeSetting({ ...setting.workletNodeSetting, protocol: val })
}
const protocolRow = (
<div className="advanced-setting-container-row">
@ -29,7 +29,7 @@ export const AdvancedSettingDialog = () => {
protocol
</div>
<div className="advanced-setting-container-row-field">
<select value={workletNodeSetting.workletNodeSetting.protocol} onChange={(e) => {
<select value={setting.workletNodeSetting.protocol} onChange={(e) => {
onProtocolChanged(e.target.value as
Protocol)
}}>
@ -90,9 +90,9 @@ export const AdvancedSettingDialog = () => {
Trancate
</div>
<div className="advanced-setting-container-row-field">
<input type="number" min={5} max={300} step={1} value={workletSetting.setting.numTrancateTreshold} onChange={(e) => {
workletSetting.setSetting({
...workletSetting.setting,
<input type="number" min={5} max={300} step={1} value={setting.workletSetting.numTrancateTreshold} onChange={(e) => {
setWorkletSetting({
...setting.workletSetting,
numTrancateTreshold: Number(e.target.value)
})
}} />
@ -176,7 +176,7 @@ export const AdvancedSettingDialog = () => {
</div>
</div>
);
}, [serverSetting.serverSetting, serverSetting.updateServerSettings, workletNodeSetting.workletNodeSetting, workletNodeSetting.updateWorkletNodeSetting, workletSetting.setting, workletSetting.setSetting]);
}, [serverSetting.serverSetting, serverSetting.updateServerSettings, setting.workletNodeSetting, setWorkletNodeSetting, setting.workletSetting, setWorkletSetting]);
return dialog;
};

View File

@ -15,7 +15,7 @@ export type CharacterAreaProps = {
export const CharacterArea = (_props: CharacterAreaProps) => {
const { serverSetting, clientSetting, initializedRef, volume, bufferingTime, performance } = useAppState()
const { serverSetting, initializedRef, volume, bufferingTime, performance, setting, setVoiceChangerClientSetting, start, stop } = useAppState()
const guiState = useGuiState()
const messageBuilderState = useMessageBuilder()
@ -80,7 +80,7 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
return
}
guiState.setIsConverting(true)
clientSetting.start()
start()
}, [startWithAudioContextCreate])
const startControl = useMemo(() => {
@ -98,7 +98,7 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
setStartWithAudioContextCreate(true)
} else {
guiState.setIsConverting(true)
await clientSetting.start()
await start()
}
} else {
serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverAudioStated: 1 })
@ -108,7 +108,7 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
const onStopClicked = async () => {
if (serverSetting.serverSetting.enableServerAudio == 0) {
guiState.setIsConverting(false)
await clientSetting.stop()
await stop()
} else {
guiState.setIsConverting(false)
serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverAudioStated: 0 })
@ -127,26 +127,26 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
)
}, [
guiState.isConverting,
clientSetting.start,
clientSetting.stop,
start,
stop,
serverSetting.serverSetting,
serverSetting.updateServerSettings
])
const gainControl = useMemo(() => {
const currentInputGain = serverSetting.serverSetting.enableServerAudio == 0 ? clientSetting.clientSetting.inputGain : serverSetting.serverSetting.serverInputAudioGain
const currentInputGain = serverSetting.serverSetting.enableServerAudio == 0 ? setting.voiceChangerClientSetting.inputGain : serverSetting.serverSetting.serverInputAudioGain
const inputValueUpdatedAction = serverSetting.serverSetting.enableServerAudio == 0 ?
async (val: number) => {
await clientSetting.updateClientSetting({ ...clientSetting.clientSetting, inputGain: val })
await setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, inputGain: val })
} :
async (val: number) => {
await serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverInputAudioGain: val })
}
const currentOutputGain = serverSetting.serverSetting.enableServerAudio == 0 ? clientSetting.clientSetting.outputGain : serverSetting.serverSetting.serverOutputAudioGain
const currentOutputGain = serverSetting.serverSetting.enableServerAudio == 0 ? setting.voiceChangerClientSetting.outputGain : serverSetting.serverSetting.serverOutputAudioGain
const outputValueUpdatedAction = serverSetting.serverSetting.enableServerAudio == 0 ?
async (val: number) => {
await clientSetting.updateClientSetting({ ...clientSetting.clientSetting, outputGain: val })
await setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, outputGain: val })
} :
async (val: number) => {
await serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverOutputAudioGain: val })
@ -182,7 +182,7 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
</div>
</div>
)
}, [serverSetting.serverSetting, clientSetting.clientSetting, clientSetting.updateClientSetting, serverSetting.updateServerSettings])
}, [serverSetting.serverSetting, setting, setVoiceChangerClientSetting, serverSetting.updateServerSettings])

View File

@ -7,9 +7,9 @@ export type QualityAreaProps = {
}
export const QualityArea = (props: QualityAreaProps) => {
const { clientSetting, serverSetting } = useAppState()
const { setVoiceChangerClientSetting, serverSetting, setting } = useAppState()
const qualityArea = useMemo(() => {
if (!serverSetting.updateServerSettings || !clientSetting.updateClientSetting || !serverSetting.serverSetting || !clientSetting.clientSetting) {
if (!serverSetting.updateServerSettings || !setVoiceChangerClientSetting || !serverSetting.serverSetting || !setting) {
return <></>
}
return (
@ -19,9 +19,9 @@ export const QualityArea = (props: QualityAreaProps) => {
<div className="config-sub-area-control-field">
<div className="config-sub-area-noise-container">
<div className="config-sub-area-noise-checkbox-container">
<input type="checkbox" disabled={serverSetting.serverSetting.enableServerAudio != 0} checked={clientSetting.clientSetting.echoCancel} onChange={(e) => {
<input type="checkbox" disabled={serverSetting.serverSetting.enableServerAudio != 0} checked={setting.voiceChangerClientSetting.echoCancel} onChange={(e) => {
try {
clientSetting.updateClientSetting({ ...clientSetting.clientSetting, echoCancel: e.target.checked })
setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, echoCancel: e.target.checked })
} catch (e) {
console.error(e)
}
@ -29,9 +29,9 @@ export const QualityArea = (props: QualityAreaProps) => {
</div>
<div className="config-sub-area-noise-checkbox-container">
<input type="checkbox" disabled={serverSetting.serverSetting.enableServerAudio != 0} checked={clientSetting.clientSetting.noiseSuppression} onChange={(e) => {
<input type="checkbox" disabled={serverSetting.serverSetting.enableServerAudio != 0} checked={setting.voiceChangerClientSetting.noiseSuppression} onChange={(e) => {
try {
clientSetting.updateClientSetting({ ...clientSetting.clientSetting, noiseSuppression: e.target.checked })
setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, noiseSuppression: e.target.checked })
} catch (e) {
console.error(e)
}
@ -39,9 +39,9 @@ export const QualityArea = (props: QualityAreaProps) => {
</div>
<div className="config-sub-area-noise-checkbox-container">
<input type="checkbox" disabled={serverSetting.serverSetting.enableServerAudio != 0} checked={clientSetting.clientSetting.noiseSuppression2} onChange={(e) => {
<input type="checkbox" disabled={serverSetting.serverSetting.enableServerAudio != 0} checked={setting.voiceChangerClientSetting.noiseSuppression2} onChange={(e) => {
try {
clientSetting.updateClientSetting({ ...clientSetting.clientSetting, noiseSuppression2: e.target.checked })
setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, noiseSuppression2: e.target.checked })
} catch (e) {
console.error(e)
}
@ -82,7 +82,7 @@ export const QualityArea = (props: QualityAreaProps) => {
</div>
)
}, [serverSetting.serverSetting, clientSetting.clientSetting, serverSetting.updateServerSettings, clientSetting.updateClientSetting])
}, [serverSetting.serverSetting, setting.voiceChangerClientSetting, serverSetting.updateServerSettings, setVoiceChangerClientSetting])
return qualityArea

View File

@ -8,7 +8,7 @@ export type ConvertProps = {
export const ConvertArea = (props: ConvertProps) => {
const { clientSetting, serverSetting, workletNodeSetting } = useAppState()
const { setting, serverSetting, setWorkletNodeSetting, trancateBuffer } = useAppState()
const { appGuiSettingState } = useAppRoot()
const edition = appGuiSettingState.edition
const convertArea = useMemo(() => {
@ -62,9 +62,9 @@ export const ConvertArea = (props: ConvertProps) => {
<div className="config-sub-area-control">
<div className="config-sub-area-control-title">CHUNK:</div>
<div className="config-sub-area-control-field">
<select className="body-select" value={workletNodeSetting.workletNodeSetting.inputChunkNum} onChange={(e) => {
workletNodeSetting.updateWorkletNodeSetting({ ...workletNodeSetting.workletNodeSetting, inputChunkNum: Number(e.target.value) })
workletNodeSetting.trancateBuffer()
<select className="body-select" value={setting.workletNodeSetting.inputChunkNum} onChange={(e) => {
setWorkletNodeSetting({ ...setting.workletNodeSetting, inputChunkNum: Number(e.target.value) })
trancateBuffer()
serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverReadChunkSize: Number(e.target.value) })
}}>
{
@ -81,7 +81,7 @@ export const ConvertArea = (props: ConvertProps) => {
<div className="config-sub-area-control-field">
<select className="body-select" value={serverSetting.serverSetting.extraConvertSize} onChange={(e) => {
serverSetting.updateServerSettings({ ...serverSetting.serverSetting, extraConvertSize: Number(e.target.value) })
workletNodeSetting.trancateBuffer()
trancateBuffer()
}}>
{
[1024 * 4, 1024 * 8, 1024 * 16, 1024 * 32, 1024 * 64, 1024 * 128].map(x => {
@ -94,7 +94,7 @@ export const ConvertArea = (props: ConvertProps) => {
{gpuSelect}
</div>
)
}, [serverSetting.serverSetting, clientSetting.clientSetting, workletNodeSetting.workletNodeSetting, serverSetting.updateServerSettings, clientSetting.updateClientSetting, workletNodeSetting.updateWorkletNodeSetting, edition])
}, [serverSetting.serverSetting, setting, serverSetting.updateServerSettings, setWorkletNodeSetting, edition])
return convertArea

View File

@ -3,21 +3,18 @@ import { useAppState } from "../../../001_provider/001_AppStateProvider"
import { fileSelectorAsDataURL, useIndexedDB, } from "@dannadori/voice-changer-client-js"
import { useGuiState } from "../001_GuiStateProvider"
import { AUDIO_ELEMENT_FOR_PLAY_RESULT, AUDIO_ELEMENT_FOR_TEST_CONVERTED, 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 type DeviceAreaProps = {
}
export const DeviceArea = (_props: DeviceAreaProps) => {
const { clientSetting, serverSetting, workletNodeSetting, audioContext, setAudioOutputElementId, initializedRef } = useAppState()
const { setting, serverSetting, audioContext, setAudioOutputElementId, initializedRef, setVoiceChangerClientSetting, startOutputRecording, stopOutputRecording } = useAppState()
const { isConverting, audioInputForGUI, inputAudioDeviceInfo, setAudioInputForGUI, fileInputEchoback, setFileInputEchoback, setAudioOutputForGUI, audioOutputForGUI, outputAudioDeviceInfo } = useGuiState()
const [inputHostApi, setInputHostApi] = useState<string>("ALL")
const [outputHostApi, setOutputHostApi] = useState<string>("ALL")
const audioSrcNode = useRef<MediaElementAudioSourceNode>()
const { appGuiSettingState } = useAppRoot()
const clientType = appGuiSettingState.appGuiSetting.id
const { getItem, setItem } = useIndexedDB({ clientType: clientType })
const { getItem, setItem } = useIndexedDB({ clientType: null })
const [outputRecordingStarted, setOutputRecordingStarted] = useState<boolean>(false)
// (1) Audio Mode
@ -57,15 +54,15 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
// (2) Audio Input
// キャッシュの設定は反映(たぶん、設定操作の時も起動していしまう。が問題は起こらないはず)
useEffect(() => {
if (typeof clientSetting.clientSetting.audioInput == "string") {
if (typeof setting.voiceChangerClientSetting.audioInput == "string") {
if (inputAudioDeviceInfo.find(x => {
// console.log("COMPARE:", x.deviceId, appState.clientSetting.setting.audioInput)
return x.deviceId == clientSetting.clientSetting.audioInput
return x.deviceId == setting.voiceChangerClientSetting.audioInput
})) {
setAudioInputForGUI(clientSetting.clientSetting.audioInput)
setAudioInputForGUI(setting.voiceChangerClientSetting.audioInput)
}
}
}, [inputAudioDeviceInfo, clientSetting.clientSetting.audioInput])
}, [inputAudioDeviceInfo, setting.voiceChangerClientSetting.audioInput])
// (2-1) クライアント
const clientAudioInputRow = useMemo(() => {
@ -81,12 +78,12 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
setAudioInputForGUI(e.target.value)
if (audioInputForGUI != "file") {
try {
await clientSetting.updateClientSetting({ ...clientSetting.clientSetting, audioInput: e.target.value })
await setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, audioInput: e.target.value })
} catch (e) {
alert(e)
console.error(e)
setAudioInputForGUI("none")
await clientSetting.updateClientSetting({ ...clientSetting.clientSetting, audioInput: null })
await setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, audioInput: null })
}
}
}}>
@ -99,7 +96,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
</div>
</div>
)
}, [clientSetting.updateClientSetting, clientSetting.clientSetting, inputAudioDeviceInfo, audioInputForGUI, serverSetting.serverSetting.enableServerAudio])
}, [setVoiceChangerClientSetting, setting.voiceChangerClientSetting, inputAudioDeviceInfo, audioInputForGUI, serverSetting.serverSetting.enableServerAudio])
// (2-2) サーバ
@ -175,7 +172,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
const dst = audioContext.createMediaStreamDestination()
audioSrcNode.current.connect(dst)
try {
clientSetting.updateClientSetting({ ...clientSetting.clientSetting, audioInput: dst.stream })
setVoiceChangerClientSetting({ ...setting.voiceChangerClientSetting, audioInput: dst.stream })
} catch (e) {
console.error(e)
}
@ -344,11 +341,11 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
}
const onOutputRecordStartClicked = async () => {
setOutputRecordingStarted(true)
await workletNodeSetting.startOutputRecording()
await startOutputRecording()
}
const onOutputRecordStopClicked = async () => {
setOutputRecordingStarted(false)
const record = await workletNodeSetting.stopOutputRecording()
const record = await stopOutputRecording()
downloadRecord(record)
}
@ -366,7 +363,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
</div>
)
}, [outputRecordingStarted, workletNodeSetting])
}, [outputRecordingStarted, startOutputRecording, stopOutputRecording])

View File

@ -7,7 +7,7 @@ export type RecorderAreaProps = {
}
export const RecorderArea = (_props: RecorderAreaProps) => {
const { serverSetting, workletNodeSetting } = useAppState()
const { serverSetting } = useAppState()
const { audioOutputForAnalyzer, setAudioOutputForAnalyzer, outputAudioDeviceInfo } = useGuiState()
const [serverIORecording, setServerIORecording] = useState<boolean>(false)
@ -106,7 +106,7 @@ export const RecorderArea = (_props: RecorderAreaProps) => {
</>
)
}, [serverIORecording, workletNodeSetting])
}, [serverIORecording])
return (
<div className="config-sub-area">

View File

@ -3,7 +3,7 @@ import { VoiceChangerWorkletNode, VoiceChangerWorkletListener } from "./VoiceCha
import workerjs from "raw-loader!../worklet/dist/index.js";
import { VoiceFocusDeviceTransformer, VoiceFocusTransformDevice } from "amazon-chime-sdk-js";
import { createDummyMediaStream, validateUrl } from "./util";
import { DefaultVoiceChangerClientSetting, MergeModelRequest, ServerSettingKey, VoiceChangerClientSetting, WorkletNodeSetting, WorkletSetting } from "./const";
import { DefaultClientSettng, MergeModelRequest, ServerSettingKey, VoiceChangerClientSetting, WorkletNodeSetting, WorkletSetting } from "./const";
import { ServerConfigurator } from "./ServerConfigurator";
// オーディオデータの流れ
@ -31,7 +31,7 @@ export class VoiceChangerClient {
private promiseForInitialize: Promise<void>
private _isVoiceChanging = false
private setting: VoiceChangerClientSetting = DefaultVoiceChangerClientSetting
private setting: VoiceChangerClientSetting = DefaultClientSettng.voiceChangerClientSetting
private sslCertified: string[] = []

View File

@ -1,5 +1,5 @@
import { VoiceChangerWorkletProcessorRequest } from "./@types/voice-changer-worklet-processor";
import { DefaultWorkletNodeSetting, DownSamplingMode, VOICE_CHANGER_CLIENT_EXCEPTION, WorkletNodeSetting, WorkletSetting } from "./const";
import { DefaultClientSettng, DownSamplingMode, VOICE_CHANGER_CLIENT_EXCEPTION, WorkletNodeSetting, WorkletSetting } from "./const";
import { io, Socket } from "socket.io-client";
import { DefaultEventsMap } from "@socket.io/component-emitter";
@ -13,7 +13,7 @@ export type VoiceChangerWorkletListener = {
export class VoiceChangerWorkletNode extends AudioWorkletNode {
private listener: VoiceChangerWorkletListener
private setting: WorkletNodeSetting = DefaultWorkletNodeSetting
private setting: WorkletNodeSetting = DefaultClientSettng.workletNodeSetting
private requestChunks: ArrayBuffer[] = []
private socket: Socket<DefaultEventsMap, DefaultEventsMap> | null = null
// performance monitor

View File

@ -39,21 +39,6 @@ export const CrossFadeOverlapSize = {
} as const
export type CrossFadeOverlapSize = typeof CrossFadeOverlapSize[keyof typeof CrossFadeOverlapSize]
export const OnnxExecutionProvider = {
"CPUExecutionProvider": "CPUExecutionProvider",
"CUDAExecutionProvider": "CUDAExecutionProvider",
"DmlExecutionProvider": "DmlExecutionProvider",
"OpenVINOExecutionProvider": "OpenVINOExecutionProvider",
} as const
export type OnnxExecutionProvider = typeof OnnxExecutionProvider[keyof typeof OnnxExecutionProvider]
export const Framework = {
"PyTorch": "PyTorch",
"ONNX": "ONNX",
} as const
export type Framework = typeof Framework[keyof typeof Framework]
export const F0Detector = {
"dio": "dio",
"harvest": "harvest",
@ -147,9 +132,6 @@ export type VoiceChangerServerSetting = {
crossFadeEndRate: number,
crossFadeOverlapSize: CrossFadeOverlapSize,
framework: Framework
onnxExecutionProvider: OnnxExecutionProvider,
f0Factor: number
f0Detector: F0Detector // dio or harvest
recordIO: number // 0:off, 1:on
@ -280,11 +262,8 @@ type ServerAudioDevice = {
}
export type ServerInfo = VoiceChangerServerSetting & {
// コンフィグ対象外 (getInfoで取得のみ可能な情報)
status: string
configFile: string,
pyTorchModelFile: string,
onnxModelFile: string,
onnxExecutionProviders: OnnxExecutionProvider[]
modelSlots: ModelSlotUnion[]
serverAudioInputDevices: ServerAudioDevice[]
serverAudioOutputDevices: ServerAudioDevice[]
@ -297,9 +276,6 @@ export type ServerInfo = VoiceChangerServerSetting & {
}
export type ServerInfoSoVitsSVC = ServerInfo & {
speakers: { [key: string]: number }
}
export type RVCSampleModel = {
id: string
@ -346,9 +322,7 @@ export const DefaultServerSetting: ServerInfo = {
gpu: 0,
framework: Framework.PyTorch,
f0Factor: 1.0,
onnxExecutionProvider: OnnxExecutionProvider.CPUExecutionProvider,
f0Detector: F0Detector.dio,
tran: 0,
@ -379,33 +353,10 @@ export const DefaultServerSetting: ServerInfo = {
enableDirectML: 0,
//
status: "ok",
configFile: "",
pyTorchModelFile: "",
onnxModelFile: "",
onnxExecutionProviders: [],
modelSlots: [],
serverAudioInputDevices: [],
serverAudioOutputDevices: []
}
export const DefaultServerSetting_MMVCv15: ServerInfo = {
...DefaultServerSetting, dstId: 101,
}
export const DefaultServerSetting_MMVCv13: ServerInfo = {
...DefaultServerSetting, srcId: 107, dstId: 100,
}
export const DefaultServerSetting_so_vits_svc_40: ServerInfo = {
...DefaultServerSetting, tran: 10, noiseScale: 0.3, extraConvertSize: 1024 * 8, clusterInferRatio: 0.1,
}
export const DefaultServerSetting_DDSP_SVC: ServerInfo = {
...DefaultServerSetting, dstId: 1, tran: 10, extraConvertSize: 1024 * 8
}
export const DefaultServerSetting_RVC: ServerInfo = {
...DefaultServerSetting, tran: 10, extraConvertSize: 1024 * 4, f0Detector: F0Detector.harvest
}
///////////////////////
// Workletセッティング
@ -416,11 +367,6 @@ export type WorkletSetting = {
volTrancateThreshold: number,
volTrancateLength: number
}
export const DefaultWorkletSetting: WorkletSetting = {
numTrancateTreshold: 100,
volTrancateThreshold: 0.0005,
volTrancateLength: 32
}
///////////////////////
// Worklet Nodeセッティング
///////////////////////
@ -451,13 +397,6 @@ export type WorkletNodeSetting = {
inputChunkNum: number,
downSamplingMode: DownSamplingMode,
}
export const DefaultWorkletNodeSetting: WorkletNodeSetting = {
serverUrl: "",
protocol: "sio",
sendingSampleRate: 48000,
inputChunkNum: 48,
downSamplingMode: "average"
}
///////////////////////
@ -479,14 +418,36 @@ export type VoiceChangerClientSetting = {
outputGain: number
}
export const DefaultVoiceChangerClientSetting: VoiceChangerClientSetting = {
audioInput: null,
sampleRate: 48000,
echoCancel: false,
noiseSuppression: false,
noiseSuppression2: false,
inputGain: 1.0,
outputGain: 1.0
///////////////////////
// Client セッティング
///////////////////////
export type ClientSetting = {
workletSetting: WorkletSetting
workletNodeSetting: WorkletNodeSetting
voiceChangerClientSetting: VoiceChangerClientSetting
}
export const DefaultClientSettng: ClientSetting = {
workletSetting: {
numTrancateTreshold: 100,
volTrancateThreshold: 0.0005,
volTrancateLength: 32
},
workletNodeSetting: {
serverUrl: "",
protocol: "sio",
sendingSampleRate: 48000,
inputChunkNum: 48,
downSamplingMode: "average"
},
voiceChangerClientSetting: {
audioInput: null,
sampleRate: 48000,
echoCancel: false,
noiseSuppression: false,
noiseSuppression2: false,
inputGain: 1.0,
outputGain: 1.0
}
}

View File

@ -1,11 +1,11 @@
import { useEffect, useMemo, useRef, useState } from "react"
import { VoiceChangerClient } from "../VoiceChangerClient"
import { ClientSettingState, useClientSetting } from "./useClientSetting"
import { useClientSetting } from "./useClientSetting"
import { IndexedDBStateAndMethod, useIndexedDB } from "./useIndexedDB"
import { ServerSettingState, useServerSetting } from "./useServerSetting"
import { useWorkletNodeSetting, WorkletNodeSettingState } from "./useWorkletNodeSetting"
import { useWorkletSetting, WorkletSettingState } from "./useWorkletSetting"
import { DefaultVoiceChangerClientSetting, DefaultWorkletNodeSetting, DefaultWorkletSetting } from "../const"
import { useWorkletNodeSetting } from "./useWorkletNodeSetting"
import { useWorkletSetting } from "./useWorkletSetting"
import { ClientSetting, DefaultClientSettng, VoiceChangerClientSetting, WorkletNodeSetting, WorkletSetting } from "../const"
export type UseClientProps = {
audioContext: AudioContext | null
@ -13,10 +13,24 @@ export type UseClientProps = {
export type ClientState = {
initialized: boolean
setting: ClientSetting,
// 各種設定I/Fへの参照
workletSetting: WorkletSettingState
clientSetting: ClientSettingState
workletNodeSetting: WorkletNodeSettingState
setVoiceChangerClientSetting: (_voiceChangerClientSetting: VoiceChangerClientSetting) => void
setServerUrl: (url: string) => void;
start: () => Promise<void>
stop: () => Promise<void>
reloadClientSetting: () => Promise<void>
setWorkletNodeSetting: (_workletNodeSetting: WorkletNodeSetting) => void
startOutputRecording: () => void
stopOutputRecording: () => Promise<Float32Array>
trancateBuffer: () => Promise<void>
setWorkletSetting: (_workletSetting: WorkletSetting) => void
// workletSetting: WorkletSetting
// workletSetting: WorkletSettingState
// clientSetting: ClientSettingState
// workletNodeSetting: WorkletNodeSettingState
serverSetting: ServerSettingState
indexedDBState: IndexedDBStateAndMethod
@ -54,7 +68,7 @@ const InitialPerformanceData: PerformanceData = {
export const useClient = (props: UseClientProps): ClientState => {
const [initialized, setInitialized] = useState<boolean>(false)
// const [clientType, setClientType] = useState<ClientType | null>(null)
const [setting, setSetting] = useState<ClientSetting>(DefaultClientSettng)
// (1-1) クライアント
const voiceChangerClientRef = useRef<VoiceChangerClient | null>(null)
const [voiceChangerClient, setVoiceChangerClient] = useState<VoiceChangerClient | null>(voiceChangerClientRef.current)
@ -68,9 +82,9 @@ export const useClient = (props: UseClientProps): ClientState => {
// (1-2) 各種設定I/F
const clientSetting = useClientSetting({ voiceChangerClient, audioContext: props.audioContext, defaultVoiceChangerClientSetting: DefaultVoiceChangerClientSetting })
const workletNodeSetting = useWorkletNodeSetting({ voiceChangerClient: voiceChangerClient, defaultWorkletNodeSetting: DefaultWorkletNodeSetting })
const workletSetting = useWorkletSetting({ voiceChangerClient, defaultWorkletSetting: DefaultWorkletSetting })
const voiceChangerClientSetting = useClientSetting({ voiceChangerClient, audioContext: props.audioContext, defaultVoiceChangerClientSetting: setting.voiceChangerClientSetting })
const workletNodeSetting = useWorkletNodeSetting({ voiceChangerClient: voiceChangerClient, defaultWorkletNodeSetting: setting.workletNodeSetting })
useWorkletSetting({ voiceChangerClient, defaultWorkletSetting: setting.workletSetting })
const serverSetting = useServerSetting({ voiceChangerClient })
const indexedDBState = useIndexedDB({ clientType: null })
@ -173,22 +187,56 @@ export const useClient = (props: UseClientProps): ClientState => {
const getInfo = useMemo(() => {
return async () => {
await initializedPromise
await clientSetting.reloadClientSetting() // 実質的な処理の意味はない
await voiceChangerClientSetting.reloadClientSetting() // 実質的な処理の意味はない
await serverSetting.reloadServerInfo()
}
}, [clientSetting.reloadClientSetting, serverSetting.reloadServerInfo])
}, [voiceChangerClientSetting.reloadClientSetting, serverSetting.reloadServerInfo])
const clearSetting = async () => {
// TBD
}
// 設定変更
const setVoiceChangerClientSetting = (_voiceChangerClientSetting: VoiceChangerClientSetting) => {
setting.voiceChangerClientSetting = _voiceChangerClientSetting
console.log("setting.voiceChangerClientSetting", setting.voiceChangerClientSetting)
// workletSettingIF.setSetting(_workletSetting)
setSetting({ ...setting })
}
const setWorkletNodeSetting = (_workletNodeSetting: WorkletNodeSetting) => {
setting.workletNodeSetting = _workletNodeSetting
console.log("setting.workletNodeSetting", setting.workletNodeSetting)
// workletSettingIF.setSetting(_workletSetting)
setSetting({ ...setting })
}
const setWorkletSetting = (_workletSetting: WorkletSetting) => {
setting.workletSetting = _workletSetting
console.log("setting.workletSetting", setting.workletSetting)
// workletSettingIF.setSetting(_workletSetting)
setSetting({ ...setting })
}
return {
initialized,
setting,
// 各種設定I/Fへの参照
clientSetting,
workletNodeSetting,
workletSetting,
setVoiceChangerClientSetting,
setServerUrl: voiceChangerClientSetting.setServerUrl,
start: voiceChangerClientSetting.start,
stop: voiceChangerClientSetting.stop,
reloadClientSetting: voiceChangerClientSetting.reloadClientSetting,
setWorkletNodeSetting,
startOutputRecording: workletNodeSetting.startOutputRecording,
stopOutputRecording: workletNodeSetting.stopOutputRecording,
trancateBuffer: workletNodeSetting.trancateBuffer,
setWorkletSetting,
// workletSetting: workletSettingIF.setting,
serverSetting,
indexedDBState,

View File

@ -1,4 +1,4 @@
import { useState, useMemo } from "react"
import { useState, useMemo, useEffect } from "react"
import { VoiceChangerClientSetting } from "../const"
import { VoiceChangerClient } from "../VoiceChangerClient"
@ -10,35 +10,33 @@ export type UseClientSettingProps = {
}
export type ClientSettingState = {
clientSetting: VoiceChangerClientSetting;
setServerUrl: (url: string) => void;
updateClientSetting: (clientSetting: VoiceChangerClientSetting) => void
setServerUrl: (url: string) => void;
start: () => Promise<void>
stop: () => Promise<void>
reloadClientSetting: () => Promise<void>
}
export const useClientSetting = (props: UseClientSettingProps): ClientSettingState => {
const [clientSetting, setClientSetting] = useState<VoiceChangerClientSetting>(props.defaultVoiceChangerClientSetting)
// 更新比較用
const [voiceChangerClientSetting, setVoiceChangerClientSetting] = useState<VoiceChangerClientSetting>(props.defaultVoiceChangerClientSetting)
//////////////
// 設定
/////////////
const updateClientSetting = useMemo(() => {
return async (_clientSetting: VoiceChangerClientSetting) => {
useEffect(() => {
const update = async () => {
if (!props.voiceChangerClient) return
for (let k in _clientSetting) {
const cur_v = clientSetting[k as keyof VoiceChangerClientSetting]
const new_v = _clientSetting[k as keyof VoiceChangerClientSetting]
for (let k in props.defaultVoiceChangerClientSetting) {
const cur_v = voiceChangerClientSetting[k as keyof VoiceChangerClientSetting]
const new_v = props.defaultVoiceChangerClientSetting[k as keyof VoiceChangerClientSetting]
if (cur_v != new_v) {
setClientSetting(_clientSetting)
await props.voiceChangerClient.updateClientSetting(_clientSetting)
setVoiceChangerClientSetting(props.defaultVoiceChangerClientSetting)
await props.voiceChangerClient.updateClientSetting(props.defaultVoiceChangerClientSetting)
break
}
}
}
}, [props.voiceChangerClient, clientSetting])
update()
}, [props.voiceChangerClient, props.defaultVoiceChangerClientSetting])
const setServerUrl = useMemo(() => {
return (url: string) => {
@ -55,7 +53,6 @@ export const useClientSetting = (props: UseClientSettingProps): ClientSettingSta
const start = useMemo(() => {
return async () => {
if (!props.voiceChangerClient) return
// props.voiceChangerClient.setServerUrl(setting.mmvcServerUrl, true)
await props.voiceChangerClient.start()
}
}, [props.voiceChangerClient])
@ -74,9 +71,7 @@ export const useClientSetting = (props: UseClientSettingProps): ClientSettingSta
}, [props.voiceChangerClient])
return {
clientSetting,
setServerUrl,
updateClientSetting,
start,
stop,

View File

@ -12,7 +12,6 @@ export type IndexedDBStateAndMethod = IndexedDBState & {
setItem: (key: string, value: unknown) => Promise<void>,
getItem: (key: string) => Promise<unknown>
removeItem: (key: string) => Promise<void>
// clearAll: () => Promise<void>
removeDB: () => Promise<void>
}

View File

@ -93,11 +93,6 @@ export const useServerSetting = (props: UseServerSettingProps): ServerSettingSta
const new_v = setting[k]
if (cur_v != new_v) {
const res = await props.voiceChangerClient.updateServerSettings(k, "" + new_v)
if (res.onnxExecutionProviders && res.onnxExecutionProviders.length > 0) {
res.onnxExecutionProvider = res.onnxExecutionProviders[0]
} else {
res.onnxExecutionProvider = "CPUExecutionProvider"
}
setServerSetting(res)
const storeData = { ...res }

View File

@ -1,4 +1,4 @@
import { useState, useMemo } from "react"
import { useState, useMemo, useEffect } from "react"
import { WorkletNodeSetting } from "../const"
import { VoiceChangerClient } from "../VoiceChangerClient"
@ -10,35 +10,33 @@ export type UseWorkletNodeSettingProps = {
}
export type WorkletNodeSettingState = {
workletNodeSetting: WorkletNodeSetting;
updateWorkletNodeSetting: (setting: WorkletNodeSetting) => void
startOutputRecording: () => void
stopOutputRecording: () => Promise<Float32Array>
trancateBuffer: () => Promise<void>
}
export const useWorkletNodeSetting = (props: UseWorkletNodeSettingProps): WorkletNodeSettingState => {
// 更新比較用
const [workletNodeSetting, _setWorkletNodeSetting] = useState<WorkletNodeSetting>(props.defaultWorkletNodeSetting)
//////////////
// 設定
/////////////
useEffect(() => {
const updateWorkletNodeSetting = useMemo(() => {
return (_workletNodeSetting: WorkletNodeSetting) => {
if (!props.voiceChangerClient) return
for (let k in _workletNodeSetting) {
const cur_v = workletNodeSetting[k as keyof WorkletNodeSetting]
const new_v = _workletNodeSetting[k as keyof WorkletNodeSetting]
if (cur_v != new_v) {
_setWorkletNodeSetting(_workletNodeSetting)
props.voiceChangerClient.updateWorkletNodeSetting(_workletNodeSetting)
break
}
if (!props.voiceChangerClient) return
for (let k in props.defaultWorkletNodeSetting) {
const cur_v = workletNodeSetting[k as keyof WorkletNodeSetting]
const new_v = props.defaultWorkletNodeSetting[k as keyof WorkletNodeSetting]
if (cur_v != new_v) {
_setWorkletNodeSetting(props.defaultWorkletNodeSetting)
props.voiceChangerClient.updateWorkletNodeSetting(props.defaultWorkletNodeSetting)
break
}
}
}, [props.voiceChangerClient, workletNodeSetting])
}, [props.voiceChangerClient, props.defaultWorkletNodeSetting])
const startOutputRecording = useMemo(() => {
return () => {
@ -62,8 +60,6 @@ export const useWorkletNodeSetting = (props: UseWorkletNodeSettingProps): Workle
}, [props.voiceChangerClient])
return {
workletNodeSetting,
updateWorkletNodeSetting,
startOutputRecording,
stopOutputRecording,
trancateBuffer

View File

@ -1,4 +1,4 @@
import { useState, useMemo, useEffect } from "react"
import { useState, useEffect } from "react"
import { WorkletSetting } from "../const";
import { VoiceChangerClient } from "../VoiceChangerClient";
@ -8,30 +8,31 @@ export type UseWorkletSettingProps = {
}
export type WorkletSettingState = {
setting: WorkletSetting;
setSetting: (setting: WorkletSetting) => void;
// setting: WorkletSetting;
// setSetting: (setting: WorkletSetting) => void;
}
export const useWorkletSetting = (props: UseWorkletSettingProps): WorkletSettingState => {
const [setting, _setSetting] = useState<WorkletSetting>(props.defaultWorkletSetting)
// クライアントへ設定反映 初期化, 設定変更
useEffect(() => {
if (!props.voiceChangerClient) return
props.voiceChangerClient.configureWorklet(setting)
}, [props.voiceChangerClient, setting])
}, [props.voiceChangerClient, props.defaultWorkletSetting])
// 設定 _setSettingがトリガでuseEffectが呼ばれて、workletに設定が飛ぶ
const setSetting = useMemo(() => {
return (setting: WorkletSetting) => {
if (!props.voiceChangerClient) return
_setSetting(setting)
}
}, [props.voiceChangerClient])
// // 設定 _setSettingがトリガでuseEffectが呼ばれて、workletに設定が飛ぶ
// const setSetting = useMemo(() => {
// return (setting: WorkletSetting) => {
// if (!props.voiceChangerClient) return
// _setSetting(setting)
// }
// }, [props.voiceChangerClient])
return {
setting,
setSetting,
// setting,
// setSetting,
}
}

View File

@ -74,7 +74,7 @@ class VoiceChangerWorkletProcessor extends AudioWorkletProcessor {
this.numTrancateTreshold = request.numTrancateTreshold
// this.volTrancateLength = request.volTrancateLength
// this.volTrancateThreshold = request.volTrancateThreshold
// console.log("[worklet] worklet configured", request)
console.log("[worklet] worklet configured", request)
return
} else if (request.requestType === "start") {
if (this.isRecording) {

View File

@ -29,7 +29,6 @@ class GPUInfo:
@dataclass()
class VoiceChangerManagerSettings:
dummy: int
modelSlotIndex: int = -1
# ↓mutableな物だけ列挙
intData: list[str] = field(default_factory=lambda: ["modelSlotIndex"])
@ -59,7 +58,7 @@ class VoiceChangerManager(ServerDeviceCallbacks):
def __init__(self, params: VoiceChangerParams):
self.params = params
self.voiceChanger: VoiceChanger = None
self.settings: VoiceChangerManagerSettings = VoiceChangerManagerSettings(dummy=0)
self.settings: VoiceChangerManagerSettings = VoiceChangerManagerSettings()
self.modelSlotManager = ModelSlotManager.get_instance(self.params.model_dir)
# スタティックな情報を収集