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

improve web edition gui

Browse Source
This commit is contained in:
w-okada 2023-11-23 06:20:54 +09:00
parent b895bdec4f
commit 6fd61b9591
4 changed files with 207 additions and 195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/demo/src/001_globalHooks/100_useWebInfo.ts
View File

@ -125,10 +125,10 @@ const f0ModelUrl: { [modelType in VoiceChangerType]: { [inputLength in InputLeng
};
export const useWebInfo = (props: UseWebInfoProps): WebInfoStateAndMethod => {
const initVoiceChangerType: VoiceChangerType = "rvcv1";
const initVoiceChangerType: VoiceChangerType = "rvcv2";
const initInputLength: InputLengthKey = "24000";
const initUseF0 = false;
const initSampleRate: ModelSampleRateStr = "40k";
const initSampleRate: ModelSampleRateStr = "32k";
const progressCallback = (data: ProgreeeUpdateCallbcckInfo) => {
if (data.progressUpdateType === ProgressUpdateType.loadPreprocessModel) {

16
client/demo/src/components/demo/components2/101_CharacterArea.tsx
View File

@ -142,6 +142,7 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
throw new Error("invalid webModelLoadingState");
}
} else {
if (webEdition) {
return (
<div className="character-area-control">
<div className="character-area-control-buttons">
@ -151,6 +152,20 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
<div onClick={onStopClicked} className={stopClassName}>
stop
</div>
</div>
</div>
);
} else {
return (
<div className="character-area-control">
<div className="character-area-control-buttons">
<div onClick={onStartClicked} className={startClassName}>
start
</div>
<div onClick={onStopClicked} className={stopClassName}>
stop
</div>
<div onClick={onPassThroughClicked} className={passThruClassName}>
passthru
</div>
@ -158,6 +173,7 @@ export const CharacterArea = (_props: CharacterAreaProps) => {
</div>
);
}
}
}, [guiState.isConverting, start, stop, serverSetting.serverSetting, serverSetting.updateServerSettings, webInfoState.progressLoadPreprocess, webInfoState.progressLoadVCModel, webInfoState.progressWarmup, webInfoState.webModelLoadingState]);
const gainControl = useMemo(() => {

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

@ -4,6 +4,7 @@ import { fileSelectorAsDataURL, useIndexedDB } from "@dannadori/voice-changer-cl
import { useGuiState } from "../001_GuiStateProvider";
import { AUDIO_ELEMENT_FOR_PLAY_MONITOR, AUDIO_ELEMENT_FOR_PLAY_RESULT, AUDIO_ELEMENT_FOR_TEST_CONVERTED, AUDIO_ELEMENT_FOR_TEST_CONVERTED_ECHOBACK, AUDIO_ELEMENT_FOR_TEST_ORIGINAL, INDEXEDDB_KEY_AUDIO_MONITR, INDEXEDDB_KEY_AUDIO_OUTPUT } from "../../../const";
import { isDesktopApp } from "../../../const";
import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
export type DeviceAreaProps = {};
@ -19,8 +20,19 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
const { getItem, setItem } = useIndexedDB({ clientType: null });
const [outputRecordingStarted, setOutputRecordingStarted] = useState<boolean>(false);
const { appGuiSettingState } = useAppRoot();
const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
// (1) Audio Mode
const deviceModeRow = useMemo(() => {
if (webEdition) {
return (
<div className="config-sub-area-control">
<div className="config-sub-area-control-title">AUDIO:</div>
<div className="config-sub-area-control-field"></div>
</div>
);
}
const enableServerAudio = serverSetting.serverSetting.enableServerAudio;
const clientChecked = enableServerAudio == 1 ? false : true;
const serverChecked = enableServerAudio == 1 ? true : false;

26
client/lib/worklet/src/voice-changer-worklet-processor.ts
View File

@ -108,26 +108,17 @@ class VoiceChangerWorkletProcessor extends AudioWorkletProcessor {
// this.trancateBuffer();
// }
if (this.playBuffer.length > (f32Data.length / this.BLOCK_SIZE) * 1.5) {
console.log(
`[worklet] Truncate ${this.playBuffer.length} > ${
f32Data.length / this.BLOCK_SIZE
}`
);
console.log(`[worklet] Truncate ${this.playBuffer.length} > ${f32Data.length / this.BLOCK_SIZE}`);
this.trancateBuffer();
}
const concatedF32Data = new Float32Array(
this.unpushedF32Data.length + f32Data.length
);
const concatedF32Data = new Float32Array(this.unpushedF32Data.length + f32Data.length);
concatedF32Data.set(this.unpushedF32Data);
concatedF32Data.set(f32Data, this.unpushedF32Data.length);
const chunkNum = Math.floor(concatedF32Data.length / this.BLOCK_SIZE);
for (let i = 0; i < chunkNum; i++) {
const block = concatedF32Data.slice(
i * this.BLOCK_SIZE,
(i + 1) * this.BLOCK_SIZE
);
const block = concatedF32Data.slice(i * this.BLOCK_SIZE, (i + 1) * this.BLOCK_SIZE);
this.playBuffer.push(block);
}
this.unpushedF32Data = concatedF32Data.slice(chunkNum * this.BLOCK_SIZE);
@ -141,11 +132,7 @@ class VoiceChangerWorkletProcessor extends AudioWorkletProcessor {
this.port.postMessage(volumeResponse);
};
process(
_inputs: Float32Array[][],
outputs: Float32Array[][],
_parameters: Record<string, Float32Array>
) {
process(_inputs: Float32Array[][], outputs: Float32Array[][], _parameters: Record<string, Float32Array>) {
if (!this.initialized) {
console.warn("[worklet] worklet_process not ready");
return true;
@ -201,7 +188,4 @@ class VoiceChangerWorkletProcessor extends AudioWorkletProcessor {
return true;
}
}
registerProcessor(
"voice-changer-worklet-processor",
VoiceChangerWorkletProcessor
);
registerProcessor("voice-changer-worklet-processor", VoiceChangerWorkletProcessor);