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

bugfix: server deivce

Browse Source
This commit is contained in:
wataru 2023-06-10 21:12:03 +09:00
parent e5d5df17db
commit 631b9b3bf6
2 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/demo/dist/index.js vendored
View File

File diff suppressed because one or more lines are too long

25
client/demo/src/components/demo/components2/102-3_DeviceArea.tsx
View File

@ -11,7 +11,8 @@ export type DeviceAreaProps = {
export const DeviceArea = (_props: DeviceAreaProps) => { export const DeviceArea = (_props: DeviceAreaProps) => {
const { clientSetting, serverSetting, workletNodeSetting, audioContext, setAudioOutputElementId, initializedRef } = useAppState() const { clientSetting, serverSetting, workletNodeSetting, audioContext, setAudioOutputElementId, initializedRef } = useAppState()
const { isConverting, audioInputForGUI, inputAudioDeviceInfo, setAudioInputForGUI, fileInputEchoback, setFileInputEchoback, setAudioOutputForGUI, audioOutputForGUI, outputAudioDeviceInfo } = useGuiState() const { isConverting, audioInputForGUI, inputAudioDeviceInfo, setAudioInputForGUI, fileInputEchoback, setFileInputEchoback, setAudioOutputForGUI, audioOutputForGUI, outputAudioDeviceInfo } = useGuiState()
const [hostApi, setHostApi] = useState<string>("ALL") const [inputHostApi, setInputHostApi] = useState<string>("ALL")
const [outputHostApi, setOutputHostApi] = useState<string>("ALL")
const audioSrcNode = useRef<MediaElementAudioSourceNode>() const audioSrcNode = useRef<MediaElementAudioSourceNode>()
const { appGuiSettingState } = useAppRoot() const { appGuiSettingState } = useAppRoot()
const clientType = appGuiSettingState.appGuiSetting.id const clientType = appGuiSettingState.appGuiSetting.id
@ -111,7 +112,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
const hostAPIOptions = Array.from(hostAPIs).map((x, index) => { return <option value={x} key={index} >{x}</option> }) const hostAPIOptions = Array.from(hostAPIs).map((x, index) => { return <option value={x} key={index} >{x}</option> })
const filteredDevice = devices.map((x, index) => { const filteredDevice = devices.map((x, index) => {
if (hostApi != "ALL" && x.hostAPI != hostApi) { if (inputHostApi != "ALL" && x.hostAPI != inputHostApi) {
return null return null
} }
return <option value={x.index} key={index}>[{x.hostAPI}]{x.name}</option> return <option value={x.index} key={index}>[{x.hostAPI}]{x.name}</option>
@ -122,7 +123,8 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
<div className="config-sub-area-control-title left-padding-1">input</div> <div className="config-sub-area-control-title left-padding-1">input</div>
<div className="config-sub-area-control-field"> <div className="config-sub-area-control-field">
<div className="config-sub-area-control-field-auido-io"> <div className="config-sub-area-control-field-auido-io">
<select className="config-sub-area-control-field-auido-io-filter" name="kinds" id="kinds" value={hostApi} onChange={(e) => { setHostApi(e.target.value) }}> <select className="config-sub-area-control-field-auido-io-filter" name="kinds" id="kinds" value={inputHostApi} onChange={(e) => { setInputHostApi(e.target.value) }}>
<option value="ALL" key="ALL" >ALL</option>
{hostAPIOptions} {hostAPIOptions}
</select> </select>
<select className="config-sub-area-control-field-auido-io-select" value={serverSetting.serverSetting.serverInputDeviceId} onChange={(e) => { <select className="config-sub-area-control-field-auido-io-select" value={serverSetting.serverSetting.serverInputDeviceId} onChange={(e) => {
@ -136,7 +138,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
</div> </div>
) )
}, [hostApi, serverSetting.serverSetting, serverSetting.updateServerSettings, serverSetting.serverSetting.enableServerAudio]) }, [inputHostApi, serverSetting.serverSetting, serverSetting.updateServerSettings, serverSetting.serverSetting.enableServerAudio])
// (2-3) File // (2-3) File
useEffect(() => { useEffect(() => {
@ -306,23 +308,24 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
const hostAPIs = new Set(devices.map(x => { return x.hostAPI })) const hostAPIs = new Set(devices.map(x => { return x.hostAPI }))
const hostAPIOptions = Array.from(hostAPIs).map((x, index) => { return <option value={x} key={index} >{x}</option> }) const hostAPIOptions = Array.from(hostAPIs).map((x, index) => { return <option value={x} key={index} >{x}</option> })
// const filteredDevice = devices.filter(x => { return x.hostAPI == hostApi || hostApi == "" }).map((x, index) => { return <option value={x.index} key={index}>{x.name}</option> })
const filteredDevice = devices.map((x, index) => { const filteredDevice = devices.map((x, index) => {
const className = (x.hostAPI == hostApi || hostApi == "") ? "select-option-red" : "" if (outputHostApi != "ALL" && x.hostAPI != outputHostApi) {
return <option className={className} value={x.index} key={index}>[{x.hostAPI}]{x.name}</option> return null
}) }
return <option value={x.index} key={index}>[{x.hostAPI}]{x.name}</option>
}).filter(x => x != null)
return ( return (
<div className="config-sub-area-control"> <div className="config-sub-area-control">
<div className="config-sub-area-control-title left-padding-1">output</div> <div className="config-sub-area-control-title left-padding-1">output</div>
<div className="config-sub-area-control-field"> <div className="config-sub-area-control-field">
<div className="config-sub-area-control-field-auido-io"> <div className="config-sub-area-control-field-auido-io">
<select className="config-sub-area-control-field-auido-io-filter" name="kinds" id="kinds" value={hostApi} onChange={(e) => { setHostApi(e.target.value) }}> <select className="config-sub-area-control-field-auido-io-filter" name="kinds" id="kinds" value={outputHostApi} onChange={(e) => { setOutputHostApi(e.target.value) }}>
<option value="ALL" key="ALL" >ALL</option>
{hostAPIOptions} {hostAPIOptions}
</select> </select>
<select className="config-sub-area-control-field-auido-io-select" value={serverSetting.serverSetting.serverOutputDeviceId} onChange={(e) => { <select className="config-sub-area-control-field-auido-io-select" value={serverSetting.serverSetting.serverOutputDeviceId} onChange={(e) => {
serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverOutputDeviceId: Number(e.target.value) }) serverSetting.updateServerSettings({ ...serverSetting.serverSetting, serverOutputDeviceId: Number(e.target.value) })
}}> }}>
{filteredDevice} {filteredDevice}
</select> </select>
@ -330,7 +333,7 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
</div> </div>
</div> </div>
) )
}, [hostApi, serverSetting.serverSetting, serverSetting.updateServerSettings, serverSetting.serverSetting.enableServerAudio]) }, [outputHostApi, serverSetting.serverSetting, serverSetting.updateServerSettings, serverSetting.serverSetting.enableServerAudio])
// (4) レコーダー // (4) レコーダー