WIP: refactoring, passthru server config 2

client/lib/src/ServerConfigurator.ts

@@ -1,4 +1,4 @@
-import { ServerAudioDevices, ServerInfo, ServerSettingKey } from "./const";
+import { ServerInfo, ServerSettingKey } from "./const";
 
 
 type FileChunk = {
@@ -7,6 +7,12 @@ type FileChunk = {
 }
 export class ServerConfigurator {
     private serverUrl = ""
+
+    setServerUrl = (serverUrl: string) => {
+        this.serverUrl = serverUrl
+        console.log(`[ServerConfigurator] Server URL: ${this.serverUrl}`)
+    }
+
     getSettings = async () => {
         const url = this.serverUrl + "/info"
         const info = await new Promise<ServerInfo>((resolve) => {
@@ -21,11 +27,6 @@ export class ServerConfigurator {
         return info
     }
 
-    setServerUrl = (serverUrl: string) => {
-        this.serverUrl = serverUrl
-        console.log(`[ServerConfigurator] Server URL: ${this.serverUrl}`)
-    }
-
     updateSettings = async (key: ServerSettingKey, val: string) => {
         const url = this.serverUrl + "/update_setteings"
         const info = await new Promise<ServerInfo>(async (resolve) => {
@@ -125,19 +126,4 @@ export class ServerConfigurator {
         return await info
     }
 
-
-    // Local Mic
-    getServerDevices = async () => {
-        const url = this.serverUrl + "/device"
-        const info = await new Promise<ServerAudioDevices>((resolve) => {
-            const request = new Request(url, {
-                method: 'GET',
-            });
-            fetch(request).then(async (response) => {
-                const json = await response.json() as ServerAudioDevices
-                resolve(json)
-            })
-        })
-        return info
-    }
 }

client/lib/src/VoiceChangerClient.ts

@@ -114,8 +114,11 @@ export class VoiceChangerClient {
         return true
     }
 
-    // forceVfDisable is for the condition that vf is enabled in constructor. 
-    //noiseSuppression2 => VoiceFocus
+
+    /////////////////////////////////////////////////////
+    // オペレーション
+    /////////////////////////////////////////////////////
+    /// Operations ///
     setup = async (input: string | MediaStream | null, bufferSize: BufferSize, echoCancel: boolean = true, noiseSuppression: boolean = true, noiseSuppression2: boolean = false) => {
         const lockNum = await this.lock()
 
@@ -220,7 +223,10 @@ export class VoiceChangerClient {
     get isVoiceChanging(): boolean {
         return this._isVoiceChanging
     }
-    // Audio Streamer Settingg
+
+    ////////////////////////
+    /// 設定
+    //////////////////////////////
     setServerUrl = (serverUrl: string, openTab: boolean = false) => {
         const url = validateUrl(serverUrl)
         const pageUrl = `${location.protocol}//${location.host}`
@@ -240,6 +246,51 @@ export class VoiceChangerClient {
         this.configurator.setServerUrl(url)
     }
 
+    setInputGain = (val: number) => {
+        this.inputGain = val
+        if (!this.inputGainNode) {
+            return
+        }
+        this.inputGainNode.gain.value = val
+    }
+
+    setOutputGain = (val: number) => {
+        if (!this.outputGainNode) {
+            return
+        }
+        this.outputGainNode.gain.value = val
+    }
+
+    /////////////////////////////////////////////////////
+    // コンポーネント設定、操作
+    /////////////////////////////////////////////////////
+    //##  Server ##//
+    updateServerSettings = (key: ServerSettingKey, val: string) => {
+        return this.configurator.updateSettings(key, val)
+    }
+    uploadFile = (buf: ArrayBuffer, filename: string, onprogress: (progress: number, end: boolean) => void) => {
+        return this.configurator.uploadFile(buf, filename, onprogress)
+    }
+    concatUploadedFile = (filename: string, chunkNum: number) => {
+        return this.configurator.concatUploadedFile(filename, chunkNum)
+    }
+    loadModel = (configFilename: string, pyTorchModelFilename: string | null, onnxModelFilename: string | null) => {
+        return this.configurator.loadModel(configFilename, pyTorchModelFilename, onnxModelFilename)
+    }
+
+    //##  Worklet ##//
+    configureWorklet = (setting: WorkletSetting) => {
+        this.vcNode.configure(setting)
+    }
+    startOutputRecordingWorklet = () => {
+        this.vcNode.startOutputRecordingWorklet()
+    }
+    stopOutputRecordingWorklet = () => {
+        this.vcNode.stopOutputRecordingWorklet()
+    }
+
+
+    //##  Audio Streamer ##//
     setProtocol = (mode: Protocol) => {
         this.audioStreamer.setProtocol(mode)
     }
@@ -261,52 +312,8 @@ export class VoiceChangerClient {
 
 
     /////////////////////////////////////////////////////
-    // コンポーネント設定、操作
+    // 情報取得
     /////////////////////////////////////////////////////
-    //##  Server ##//
-
-    //##  Worklet ##//
-    configureWorklet = (setting: WorkletSetting) => {
-        this.vcNode.configure(setting)
-    }
-    startOutputRecordingWorklet = () => {
-        this.vcNode.startOutputRecordingWorklet()
-    }
-    stopOutputRecordingWorklet = () => {
-        this.vcNode.stopOutputRecordingWorklet()
-    }
-
-
-    // Configurator Method
-    uploadFile = (buf: ArrayBuffer, filename: string, onprogress: (progress: number, end: boolean) => void) => {
-        return this.configurator.uploadFile(buf, filename, onprogress)
-    }
-    concatUploadedFile = (filename: string, chunkNum: number) => {
-        return this.configurator.concatUploadedFile(filename, chunkNum)
-    }
-    loadModel = (configFilename: string, pyTorchModelFilename: string | null, onnxModelFilename: string | null) => {
-        return this.configurator.loadModel(configFilename, pyTorchModelFilename, onnxModelFilename)
-    }
-    updateServerSettings = (key: ServerSettingKey, val: string) => {
-        return this.configurator.updateSettings(key, val)
-    }
-
-    setInputGain = (val: number) => {
-        this.inputGain = val
-        if (!this.inputGainNode) {
-            return
-        }
-        this.inputGainNode.gain.value = val
-    }
-
-    setOutputGain = (val: number) => {
-        if (!this.outputGainNode) {
-            return
-        }
-        this.outputGainNode.gain.value = val
-    }
-
-
     // Information
     getClientSettings = () => {
         return this.audioStreamer.getSettings()
@@ -315,10 +322,6 @@ export class VoiceChangerClient {
         return this.configurator.getSettings()
     }
 
-    getServerDevices = () => {
-        return this.configurator.getServerDevices()
-    }
-
 
     getSocketId = () => {
         return this.audioStreamer.getSocketId()

client/lib/src/hooks/useServerSetting.ts

@@ -1,5 +1,5 @@
 import { useState, useMemo, useEffect } from "react"
-import { VoiceChangerServerSetting, ServerInfo, ServerSettingKey, INDEXEDDB_KEY_SERVER, INDEXEDDB_KEY_MODEL_DATA, ServerAudioDevices, DefaultServerSetting } from "../const"
+import { VoiceChangerServerSetting, ServerInfo, ServerSettingKey, INDEXEDDB_KEY_SERVER, INDEXEDDB_KEY_MODEL_DATA, DefaultServerSetting } from "../const"
 import { VoiceChangerClient } from "../VoiceChangerClient"
 import { useIndexedDB } from "./useIndexedDB"
 
@@ -38,8 +38,6 @@ export type ServerSettingState = {
     uploadProgress: number
     isUploading: boolean
 
-    getServerDevices: () => Promise<ServerAudioDevices>
-
 }
 
 export const useServerSetting = (props: UseServerSettingProps): ServerSettingState => {
@@ -196,16 +194,6 @@ export const useServerSetting = (props: UseServerSettingProps): ServerSettingSta
         await removeItem(INDEXEDDB_KEY_MODEL_DATA)
     }
 
-    const getServerDevices = async (): Promise<ServerAudioDevices> => {
-        if (!props.voiceChangerClient) {
-            return {
-                audio_input_devices: [],
-                audio_output_devices: []
-            }
-        }
-        const res = await props.voiceChangerClient.getServerDevices()
-        return res
-    }
 
     return {
         serverSetting,
@@ -218,7 +206,5 @@ export const useServerSetting = (props: UseServerSettingProps): ServerSettingSta
         loadModel,
         uploadProgress,
         isUploading,
-
-        getServerDevices,
     }
 }