From 3de900fbdf6b049ec9fdd39cd19b3e03f49f3280 Mon Sep 17 00:00:00 2001 From: wataru Date: Thu, 20 Apr 2023 17:38:27 +0900 Subject: [PATCH] bugfix:audio input remains. --- client/demo/dist/index.js | 4 ++-- client/demo/src/001_provider/001_AppStateProvider.tsx | 2 +- .../components/demo/components/401_AudioInputRow.tsx | 11 ++++------- 3 files changed, 7 insertions(+), 10 deletions(-) diff --git a/client/demo/dist/index.js b/client/demo/dist/index.js index d85f93aa..f3084b4e 100644 --- a/client/demo/dist/index.js +++ b/client/demo/dist/index.js @@ -114,7 +114,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"AppStateProvider\": () => (/* binding */ AppStateProvider),\n/* harmony export */ \"useAppState\": () => (/* binding */ useAppState)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ \"./node_modules/@babel/runtime/helpers/esm/defineProperty.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _001_globalHooks_001_useVCClient__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../001_globalHooks/001_useVCClient */ \"./src/001_globalHooks/001_useVCClient.ts\");\n/* harmony import */ var _001_AppRootProvider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./001_AppRootProvider */ \"./src/001_provider/001_AppRootProvider.tsx\");\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0,_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\n\n\nvar AppStateContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nvar useAppState = function useAppState() {\n var state = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(AppStateContext);\n if (!state) {\n throw new Error(\"useAppState must be used within AppStateProvider\");\n }\n return state;\n};\nvar AppStateProvider = function AppStateProvider(_ref) {\n var children = _ref.children;\n var appRoot = (0,_001_AppRootProvider__WEBPACK_IMPORTED_MODULE_3__.useAppRoot)();\n var clientState = (0,_001_globalHooks_001_useVCClient__WEBPACK_IMPORTED_MODULE_2__.useVCClient)({\n audioContext: appRoot.audioContextState.audioContext,\n clientType: appRoot.clientType\n });\n var initializedRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(false);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n if (clientState.clientState.initialized) {\n initializedRef.current = true;\n clientState.clientState.clientSetting.updateClientSetting(_objectSpread(_objectSpread({}, clientState.clientState.clientSetting.clientSetting), {}, {\n speakers: [{\n \"id\": 107,\n \"name\": \"user\"\n }, {\n \"id\": 100,\n \"name\": \"ずんだもん\"\n }, {\n \"id\": 101,\n \"name\": \"そら\"\n }, {\n \"id\": 102,\n \"name\": \"めたん\"\n }, {\n \"id\": 103,\n \"name\": \"つむぎ\"\n }]\n }));\n }\n }, [clientState.clientState.initialized]);\n var providerValue = _objectSpread(_objectSpread({\n audioContext: appRoot.audioContextState.audioContext\n }, clientState.clientState), {}, {\n initializedRef: initializedRef\n });\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(AppStateContext.Provider, {\n value: providerValue\n }, children);\n};\n\n//# sourceURL=webpack://demo/./src/001_provider/001_AppStateProvider.tsx?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"AppStateProvider\": () => (/* binding */ AppStateProvider),\n/* harmony export */ \"useAppState\": () => (/* binding */ useAppState)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ \"./node_modules/@babel/runtime/helpers/esm/defineProperty.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _001_globalHooks_001_useVCClient__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../001_globalHooks/001_useVCClient */ \"./src/001_globalHooks/001_useVCClient.ts\");\n/* harmony import */ var _001_AppRootProvider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./001_AppRootProvider */ \"./src/001_provider/001_AppRootProvider.tsx\");\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0,_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\n\n\nvar AppStateContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nvar useAppState = function useAppState() {\n var state = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(AppStateContext);\n if (!state) {\n throw new Error(\"useAppState must be used within AppStateProvider\");\n }\n return state;\n};\nvar AppStateProvider = function AppStateProvider(_ref) {\n var children = _ref.children;\n var appRoot = (0,_001_AppRootProvider__WEBPACK_IMPORTED_MODULE_3__.useAppRoot)();\n var clientState = (0,_001_globalHooks_001_useVCClient__WEBPACK_IMPORTED_MODULE_2__.useVCClient)({\n audioContext: appRoot.audioContextState.audioContext,\n clientType: appRoot.clientType\n });\n var initializedRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(false);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n if (clientState.clientState.initialized) {\n initializedRef.current = true;\n console.log(\"Updating Client Setting.................................\", clientState.clientState.clientSetting.clientSetting);\n clientState.clientState.clientSetting.updateClientSetting(_objectSpread(_objectSpread({}, clientState.clientState.clientSetting.clientSetting), {}, {\n speakers: [{\n \"id\": 107,\n \"name\": \"user\"\n }, {\n \"id\": 100,\n \"name\": \"ずんだもん\"\n }, {\n \"id\": 101,\n \"name\": \"そら\"\n }, {\n \"id\": 102,\n \"name\": \"めたん\"\n }, {\n \"id\": 103,\n \"name\": \"つむぎ\"\n }]\n }));\n }\n }, [clientState.clientState.initialized]);\n var providerValue = _objectSpread(_objectSpread({\n audioContext: appRoot.audioContextState.audioContext\n }, clientState.clientState), {}, {\n initializedRef: initializedRef\n });\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(AppStateContext.Provider, {\n value: providerValue\n }, children);\n};\n\n//# sourceURL=webpack://demo/./src/001_provider/001_AppStateProvider.tsx?"); /***/ }), @@ -499,7 +499,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"AudioInputRow\": () => (/* binding */ AudioInputRow)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ \"./node_modules/@babel/runtime/helpers/esm/defineProperty.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _001_provider_001_AppStateProvider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../001_provider/001_AppStateProvider */ \"./src/001_provider/001_AppStateProvider.tsx\");\n/* harmony import */ var _001_GuiStateProvider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../001_GuiStateProvider */ \"./src/components/demo/001_GuiStateProvider.tsx\");\n/* harmony import */ var _401_1_AudioInputMediaRow__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./401-1_AudioInputMediaRow */ \"./src/components/demo/components/401-1_AudioInputMediaRow.tsx\");\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0,_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\n\n\n\nvar AudioInputRow = function AudioInputRow(_props) {\n var appState = (0,_001_provider_001_AppStateProvider__WEBPACK_IMPORTED_MODULE_2__.useAppState)();\n var guiState = (0,_001_GuiStateProvider__WEBPACK_IMPORTED_MODULE_3__.useGuiState)();\n\n // キャッシュの設定は反映（たぶん、設定操作の時も起動していしまう。が問題は起こらないはず）\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n if (typeof appState.clientSetting.clientSetting.audioInput == \"string\") {\n if (guiState.inputAudioDeviceInfo.find(function (x) {\n // console.log(\"COMPARE:\", x.deviceId, appState.clientSetting.setting.audioInput)\n return x.deviceId == appState.clientSetting.clientSetting.audioInput;\n })) {\n guiState.setAudioInputForGUI(appState.clientSetting.clientSetting.audioInput);\n }\n }\n }, [guiState.inputAudioDeviceInfo, appState.clientSetting.clientSetting.audioInput]);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n if (guiState.audioInputForGUI == \"file\") {} else {\n appState.clientSetting.updateClientSetting(_objectSpread(_objectSpread({}, appState.clientSetting.clientSetting), {}, {\n audioInput: guiState.audioInputForGUI\n }));\n }\n }, [guiState.audioInputForGUI, appState.clientSetting.updateClientSetting]);\n var audioInputRow = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"AudioInput\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"select\", {\n className: \"body-select\",\n value: guiState.audioInputForGUI,\n onChange: function onChange(e) {\n guiState.setAudioInputForGUI(e.target.value);\n }\n }, guiState.inputAudioDeviceInfo.map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"option\", {\n key: x.deviceId,\n value: x.deviceId\n }, x.label);\n }))));\n }, [guiState.inputAudioDeviceInfo, guiState.audioInputForGUI]);\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, audioInputRow, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_401_1_AudioInputMediaRow__WEBPACK_IMPORTED_MODULE_4__.AudioInputMediaRow, null));\n};\n\n//# sourceURL=webpack://demo/./src/components/demo/components/401_AudioInputRow.tsx?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"AudioInputRow\": () => (/* binding */ AudioInputRow)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ \"./node_modules/@babel/runtime/helpers/esm/defineProperty.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _001_provider_001_AppStateProvider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../001_provider/001_AppStateProvider */ \"./src/001_provider/001_AppStateProvider.tsx\");\n/* harmony import */ var _001_GuiStateProvider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../001_GuiStateProvider */ \"./src/components/demo/001_GuiStateProvider.tsx\");\n/* harmony import */ var _401_1_AudioInputMediaRow__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./401-1_AudioInputMediaRow */ \"./src/components/demo/components/401-1_AudioInputMediaRow.tsx\");\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0,_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\n\n\n\nvar AudioInputRow = function AudioInputRow(_props) {\n var appState = (0,_001_provider_001_AppStateProvider__WEBPACK_IMPORTED_MODULE_2__.useAppState)();\n var guiState = (0,_001_GuiStateProvider__WEBPACK_IMPORTED_MODULE_3__.useGuiState)();\n\n // キャッシュの設定は反映（たぶん、設定操作の時も起動していしまう。が問題は起こらないはず）\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n if (typeof appState.clientSetting.clientSetting.audioInput == \"string\") {\n if (guiState.inputAudioDeviceInfo.find(function (x) {\n // console.log(\"COMPARE:\", x.deviceId, appState.clientSetting.setting.audioInput)\n return x.deviceId == appState.clientSetting.clientSetting.audioInput;\n })) {\n guiState.setAudioInputForGUI(appState.clientSetting.clientSetting.audioInput);\n }\n }\n }, [guiState.inputAudioDeviceInfo, appState.clientSetting.clientSetting.audioInput]);\n\n // useEffect(() => {\n // if (guiState.audioInputForGUI == \"file\") {\n // } else {\n // console.log(\"Updating Client Setting.................11111.1.1.1..1.1\", appState.clientSetting.clientSetting)\n // }\n // }, [guiState.audioInputForGUI, appState.clientSetting.updateClientSetting])\n\n var audioInputRow = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"AudioInput\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"select\", {\n className: \"body-select\",\n value: guiState.audioInputForGUI,\n onChange: function onChange(e) {\n guiState.setAudioInputForGUI(e.target.value);\n if (guiState.audioInputForGUI != \"file\") {\n appState.clientSetting.updateClientSetting(_objectSpread(_objectSpread({}, appState.clientSetting.clientSetting), {}, {\n audioInput: e.target.value\n }));\n }\n }\n }, guiState.inputAudioDeviceInfo.map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(\"option\", {\n key: x.deviceId,\n value: x.deviceId\n }, x.label);\n }))));\n }, [guiState.inputAudioDeviceInfo, guiState.audioInputForGUI, appState.clientSetting.clientSetting, appState.clientSetting.updateClientSetting]);\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, audioInputRow, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_401_1_AudioInputMediaRow__WEBPACK_IMPORTED_MODULE_4__.AudioInputMediaRow, null));\n};\n\n//# sourceURL=webpack://demo/./src/components/demo/components/401_AudioInputRow.tsx?"); /***/ }), diff --git a/client/demo/src/001_provider/001_AppStateProvider.tsx b/client/demo/src/001_provider/001_AppStateProvider.tsx index 55e55067..7fab6c70 100644 --- a/client/demo/src/001_provider/001_AppStateProvider.tsx +++ b/client/demo/src/001_provider/001_AppStateProvider.tsx @@ -31,7 +31,7 @@ export const AppStateProvider = ({ children }: Props) => { useEffect(() => { if (clientState.clientState.initialized) { initializedRef.current = true - + console.log("Updating Client Setting.................................", clientState.clientState.clientSetting.clientSetting) clientState.clientState.clientSetting.updateClientSetting({ ...clientState.clientState.clientSetting.clientSetting, speakers: [ { diff --git a/client/demo/src/components/demo/components/401_AudioInputRow.tsx b/client/demo/src/components/demo/components/401_AudioInputRow.tsx index 0e0b90fb..21caf659 100644 --- a/client/demo/src/components/demo/components/401_AudioInputRow.tsx +++ b/client/demo/src/components/demo/components/401_AudioInputRow.tsx @@ -22,12 +22,6 @@ export const AudioInputRow = (_props: AudioInputRowProps) => { } }, [guiState.inputAudioDeviceInfo, appState.clientSetting.clientSetting.audioInput]) - useEffect(() => { - if (guiState.audioInputForGUI == "file") { - } else { - appState.clientSetting.updateClientSetting({ ...appState.clientSetting.clientSetting, audioInput: guiState.audioInputForGUI }) - } - }, [guiState.audioInputForGUI, appState.clientSetting.updateClientSetting]) const audioInputRow = useMemo(() => { return ( @@ -36,6 +30,9 @@ export const AudioInputRow = (_props: AudioInputRowProps) => {