mirror of
https://github.com/w-okada/voice-changer.git
synced 2025-01-23 13:35:12 +03:00
save client config
This commit is contained in:
parent
baeb771c29
commit
ad9f910163
12
client/demo/dist/index.js
vendored
12
client/demo/dist/index.js
vendored
File diff suppressed because one or more lines are too long
@ -36,14 +36,14 @@ export const AppStateProvider = ({ children }: Props) => {
|
||||
}, [])
|
||||
|
||||
const initializedRef = useRef<boolean>(false)
|
||||
useEffect(() => {
|
||||
if (clientState.clientState.initialized) {
|
||||
initializedRef.current = true
|
||||
clientState.clientState.setVoiceChangerClientSetting({
|
||||
...clientState.clientState.setting.voiceChangerClientSetting
|
||||
})
|
||||
}
|
||||
}, [clientState.clientState.initialized])
|
||||
// useEffect(() => {
|
||||
// if (clientState.clientState.initialized) {
|
||||
// initializedRef.current = true
|
||||
// clientState.clientState.setVoiceChangerClientSetting({
|
||||
// ...clientState.clientState.setting.voiceChangerClientSetting
|
||||
// })
|
||||
// }
|
||||
// }, [clientState.clientState.initialized])
|
||||
|
||||
useEffect(() => {
|
||||
if (clientState.clientState.ioErrorCount > 100) {
|
||||
|
@ -19,7 +19,7 @@ export const GetServerInfomationDialog = () => {
|
||||
)
|
||||
const content = (
|
||||
<div className="get-server-information-container">
|
||||
<textarea className="get-server-information-text-area" id="get-server-information-text-area" value={JSON.stringify(serverSetting.serverSetting, null, 4)} />
|
||||
<textarea className="get-server-information-text-area" id="get-server-information-text-area" value={JSON.stringify(serverSetting.serverSetting, null, 4)} onChange={() => { }} />
|
||||
</div>
|
||||
)
|
||||
return (
|
||||
|
@ -82,7 +82,7 @@ export const QualityArea = (props: QualityAreaProps) => {
|
||||
|
||||
</div>
|
||||
)
|
||||
}, [serverSetting.serverSetting, setting.voiceChangerClientSetting, serverSetting.updateServerSettings, setVoiceChangerClientSetting])
|
||||
}, [serverSetting.serverSetting, setting, serverSetting.updateServerSettings, setVoiceChangerClientSetting])
|
||||
|
||||
|
||||
return qualityArea
|
||||
|
@ -96,7 +96,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}, [setVoiceChangerClientSetting, setting.voiceChangerClientSetting, inputAudioDeviceInfo, audioInputForGUI, serverSetting.serverSetting.enableServerAudio])
|
||||
}, [setVoiceChangerClientSetting, setting, inputAudioDeviceInfo, audioInputForGUI, serverSetting.serverSetting.enableServerAudio])
|
||||
|
||||
|
||||
// (2-2) サーバ
|
||||
|
@ -106,7 +106,7 @@ export const RecorderArea = (_props: RecorderAreaProps) => {
|
||||
</>
|
||||
)
|
||||
|
||||
}, [serverIORecording])
|
||||
}, [serverIORecording, audioOutputForAnalyzer, outputAudioDeviceInfo])
|
||||
|
||||
return (
|
||||
<div className="config-sub-area">
|
||||
|
@ -80,11 +80,10 @@ export const useClient = (props: UseClientProps): ClientState => {
|
||||
})
|
||||
}, [])
|
||||
|
||||
|
||||
// (1-2) 各種設定I/F
|
||||
const voiceChangerClientSetting = useClientSetting({ voiceChangerClient, audioContext: props.audioContext, defaultVoiceChangerClientSetting: setting.voiceChangerClientSetting })
|
||||
const workletNodeSetting = useWorkletNodeSetting({ voiceChangerClient: voiceChangerClient, defaultWorkletNodeSetting: setting.workletNodeSetting })
|
||||
useWorkletSetting({ voiceChangerClient, defaultWorkletSetting: setting.workletSetting })
|
||||
const voiceChangerClientSetting = useClientSetting({ voiceChangerClient, audioContext: props.audioContext, voiceChangerClientSetting: setting.voiceChangerClientSetting })
|
||||
const workletNodeSetting = useWorkletNodeSetting({ voiceChangerClient: voiceChangerClient, workletNodeSetting: setting.workletNodeSetting })
|
||||
useWorkletSetting({ voiceChangerClient, workletSetting: setting.workletSetting })
|
||||
const serverSetting = useServerSetting({ voiceChangerClient })
|
||||
const indexedDBState = useIndexedDB({ clientType: null })
|
||||
|
||||
@ -128,7 +127,36 @@ export const useClient = (props: UseClientProps): ClientState => {
|
||||
setIoErrorCount(ioErrorCountRef.current)
|
||||
}
|
||||
|
||||
// (2-1) 初期化処理
|
||||
// 設定データ管理
|
||||
const { setItem, getItem } = useIndexedDB({ clientType: null })
|
||||
// 設定データの更新と保存
|
||||
const _setSetting = (_setting: ClientSetting) => {
|
||||
const storeData = { ..._setting }
|
||||
storeData.voiceChangerClientSetting = { ...storeData.voiceChangerClientSetting }
|
||||
if (typeof storeData.voiceChangerClientSetting.audioInput != "string") {
|
||||
storeData.voiceChangerClientSetting.audioInput = "none"
|
||||
}
|
||||
setItem("clientSetting", storeData)
|
||||
|
||||
setSetting(_setting)
|
||||
}
|
||||
// 設定データ初期化
|
||||
useEffect(() => {
|
||||
if (!voiceChangerClient) {
|
||||
return
|
||||
}
|
||||
const loadCache = async () => {
|
||||
const _setting = await getItem("clientSetting") as ClientSetting
|
||||
setSetting(_setting)
|
||||
}
|
||||
loadCache()
|
||||
}, [voiceChangerClient])
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// (2-1) クライアント初期化処理
|
||||
useEffect(() => {
|
||||
const initialized = async () => {
|
||||
if (!props.audioContext) {
|
||||
@ -202,7 +230,7 @@ export const useClient = (props: UseClientProps): ClientState => {
|
||||
setting.voiceChangerClientSetting = _voiceChangerClientSetting
|
||||
console.log("setting.voiceChangerClientSetting", setting.voiceChangerClientSetting)
|
||||
// workletSettingIF.setSetting(_workletSetting)
|
||||
setSetting({ ...setting })
|
||||
_setSetting({ ...setting })
|
||||
}
|
||||
|
||||
|
||||
@ -210,14 +238,14 @@ export const useClient = (props: UseClientProps): ClientState => {
|
||||
setting.workletNodeSetting = _workletNodeSetting
|
||||
console.log("setting.workletNodeSetting", setting.workletNodeSetting)
|
||||
// workletSettingIF.setSetting(_workletSetting)
|
||||
setSetting({ ...setting })
|
||||
_setSetting({ ...setting })
|
||||
}
|
||||
|
||||
const setWorkletSetting = (_workletSetting: WorkletSetting) => {
|
||||
setting.workletSetting = _workletSetting
|
||||
console.log("setting.workletSetting", setting.workletSetting)
|
||||
// workletSettingIF.setSetting(_workletSetting)
|
||||
setSetting({ ...setting })
|
||||
_setSetting({ ...setting })
|
||||
}
|
||||
|
||||
return {
|
||||
|
@ -6,7 +6,7 @@ import { VoiceChangerClient } from "../VoiceChangerClient"
|
||||
export type UseClientSettingProps = {
|
||||
voiceChangerClient: VoiceChangerClient | null
|
||||
audioContext: AudioContext | null
|
||||
defaultVoiceChangerClientSetting: VoiceChangerClientSetting
|
||||
voiceChangerClientSetting: VoiceChangerClientSetting
|
||||
}
|
||||
|
||||
export type ClientSettingState = {
|
||||
@ -19,23 +19,23 @@ export type ClientSettingState = {
|
||||
|
||||
export const useClientSetting = (props: UseClientSettingProps): ClientSettingState => {
|
||||
// 更新比較用
|
||||
const [voiceChangerClientSetting, setVoiceChangerClientSetting] = useState<VoiceChangerClientSetting>(props.defaultVoiceChangerClientSetting)
|
||||
const [voiceChangerClientSetting, setVoiceChangerClientSetting] = useState<VoiceChangerClientSetting>(props.voiceChangerClientSetting)
|
||||
|
||||
useEffect(() => {
|
||||
const update = async () => {
|
||||
if (!props.voiceChangerClient) return
|
||||
for (let k in props.defaultVoiceChangerClientSetting) {
|
||||
for (let k in props.voiceChangerClientSetting) {
|
||||
const cur_v = voiceChangerClientSetting[k as keyof VoiceChangerClientSetting]
|
||||
const new_v = props.defaultVoiceChangerClientSetting[k as keyof VoiceChangerClientSetting]
|
||||
const new_v = props.voiceChangerClientSetting[k as keyof VoiceChangerClientSetting]
|
||||
if (cur_v != new_v) {
|
||||
setVoiceChangerClientSetting(props.defaultVoiceChangerClientSetting)
|
||||
await props.voiceChangerClient.updateClientSetting(props.defaultVoiceChangerClientSetting)
|
||||
setVoiceChangerClientSetting(props.voiceChangerClientSetting)
|
||||
await props.voiceChangerClient.updateClientSetting(props.voiceChangerClientSetting)
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
update()
|
||||
}, [props.voiceChangerClient, props.defaultVoiceChangerClientSetting])
|
||||
}, [props.voiceChangerClient, props.voiceChangerClientSetting])
|
||||
|
||||
|
||||
const setServerUrl = useMemo(() => {
|
||||
|
@ -6,7 +6,7 @@ import { VoiceChangerClient } from "../VoiceChangerClient"
|
||||
|
||||
export type UseWorkletNodeSettingProps = {
|
||||
voiceChangerClient: VoiceChangerClient | null
|
||||
defaultWorkletNodeSetting: WorkletNodeSetting
|
||||
workletNodeSetting: WorkletNodeSetting
|
||||
}
|
||||
|
||||
export type WorkletNodeSettingState = {
|
||||
@ -17,7 +17,7 @@ export type WorkletNodeSettingState = {
|
||||
|
||||
export const useWorkletNodeSetting = (props: UseWorkletNodeSettingProps): WorkletNodeSettingState => {
|
||||
// 更新比較用
|
||||
const [workletNodeSetting, _setWorkletNodeSetting] = useState<WorkletNodeSetting>(props.defaultWorkletNodeSetting)
|
||||
const [workletNodeSetting, _setWorkletNodeSetting] = useState<WorkletNodeSetting>(props.workletNodeSetting)
|
||||
|
||||
//////////////
|
||||
// 設定
|
||||
@ -25,17 +25,17 @@ export const useWorkletNodeSetting = (props: UseWorkletNodeSettingProps): Workle
|
||||
useEffect(() => {
|
||||
|
||||
if (!props.voiceChangerClient) return
|
||||
for (let k in props.defaultWorkletNodeSetting) {
|
||||
for (let k in props.workletNodeSetting) {
|
||||
const cur_v = workletNodeSetting[k as keyof WorkletNodeSetting]
|
||||
const new_v = props.defaultWorkletNodeSetting[k as keyof WorkletNodeSetting]
|
||||
const new_v = props.workletNodeSetting[k as keyof WorkletNodeSetting]
|
||||
if (cur_v != new_v) {
|
||||
_setWorkletNodeSetting(props.defaultWorkletNodeSetting)
|
||||
props.voiceChangerClient.updateWorkletNodeSetting(props.defaultWorkletNodeSetting)
|
||||
_setWorkletNodeSetting(props.workletNodeSetting)
|
||||
props.voiceChangerClient.updateWorkletNodeSetting(props.workletNodeSetting)
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
}, [props.voiceChangerClient, props.defaultWorkletNodeSetting])
|
||||
}, [props.voiceChangerClient, props.workletNodeSetting])
|
||||
|
||||
|
||||
const startOutputRecording = useMemo(() => {
|
||||
|
@ -4,7 +4,7 @@ import { VoiceChangerClient } from "../VoiceChangerClient";
|
||||
|
||||
export type UseWorkletSettingProps = {
|
||||
voiceChangerClient: VoiceChangerClient | null
|
||||
defaultWorkletSetting: WorkletSetting
|
||||
workletSetting: WorkletSetting
|
||||
}
|
||||
|
||||
export type WorkletSettingState = {
|
||||
@ -14,12 +14,12 @@ export type WorkletSettingState = {
|
||||
}
|
||||
|
||||
export const useWorkletSetting = (props: UseWorkletSettingProps): WorkletSettingState => {
|
||||
const [setting, _setSetting] = useState<WorkletSetting>(props.defaultWorkletSetting)
|
||||
const [setting, _setSetting] = useState<WorkletSetting>(props.workletSetting)
|
||||
|
||||
useEffect(() => {
|
||||
if (!props.voiceChangerClient) return
|
||||
props.voiceChangerClient.configureWorklet(setting)
|
||||
}, [props.voiceChangerClient, props.defaultWorkletSetting])
|
||||
}, [props.voiceChangerClient, props.workletSetting])
|
||||
|
||||
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user