From a22d430539990909b982c79708974e6d24109a8d Mon Sep 17 00:00:00 2001 From: wataru Date: Thu, 12 Jan 2023 17:23:57 +0900 Subject: [PATCH] hide advanced setting --- client/demo/dist/index.html | 11 +- client/demo/dist/index.js | 641 +---------------------- client/demo/dist/index.js.LICENSE.txt | 31 ++ client/demo/src/101_server_setting.tsx | 21 +- client/demo/src/102_device_setting.tsx | 21 +- client/demo/src/104_convert_setting.tsx | 80 +-- client/demo/src/105_advanced_setting.tsx | 152 +++++- client/demo/src/css/App.css | 6 + 8 files changed, 188 insertions(+), 775 deletions(-) create mode 100644 client/demo/dist/index.js.LICENSE.txt diff --git a/client/demo/dist/index.html b/client/demo/dist/index.html index bd2ec274..83226387 100644 --- a/client/demo/dist/index.html +++ b/client/demo/dist/index.html @@ -1,10 +1 @@ - - - - - Voice Changer Client Demo - - -
- - +Voice Changer Client Demo
\ No newline at end of file diff --git a/client/demo/dist/index.js b/client/demo/dist/index.js index 13977561..2021577e 100644 --- a/client/demo/dist/index.js +++ b/client/demo/dist/index.js @@ -1,639 +1,2 @@ -/* - * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development"). - * This devtool is neither made for production nor for readable output files. - * It uses "eval()" calls to create a separate source file in the browser devtools. - * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/) - * or disable the default devtool with "devtool: false". - * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/). - */ -/******/ (() => { // webpackBootstrap -/******/ var __webpack_modules__ = ({ - -/***/ "./src/000_index.tsx": -/*!***************************!*\ - !*** ./src/000_index.tsx ***! - \***************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-dom/client */ \"./node_modules/react-dom/client.js\");\n/* harmony import */ var _css_App_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./css/App.css */ \"./src/css/App.css\");\n/* harmony import */ var _100_options_microphone__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./100_options_microphone */ \"./src/100_options_microphone.tsx\");\n\n\n\n\n\n\n\nvar container = document.getElementById(\"app\");\nvar root = (0,react_dom_client__WEBPACK_IMPORTED_MODULE_3__.createRoot)(container);\nvar App = function App() {\n var _useMicrophoneOptions = (0,_100_options_microphone__WEBPACK_IMPORTED_MODULE_5__.useMicrophoneOptions)(),\n voiceChangerSetting = _useMicrophoneOptions.voiceChangerSetting;\n var onClearSettingClicked = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_1___default().mark(function _callee() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_1___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n _context.next = 2;\n return chrome.storage.local.clear();\n case 2:\n _context.next = 4;\n return chrome.storage.sync.clear();\n case 4:\n location.reload();\n case 5:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function onClearSettingClicked() {\n return _ref.apply(this, arguments);\n };\n }();\n var clearRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(react__WEBPACK_IMPORTED_MODULE_2__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-button\",\n onClick: onClearSettingClicked\n }, \"clear setting\")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-item-text\"\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-item-text\"\n })));\n }, []);\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-row\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", {\n className: \"body-top-title\"\n }, \"Voice Changer Setting\")), clearRow, voiceChangerSetting, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(\"audio\", {\n id: \"audio-output\"\n })));\n};\nroot.render( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(App, null));\n\n//# sourceURL=webpack://demo/./src/000_index.tsx?"); - -/***/ }), - -/***/ "./src/100_options_microphone.tsx": -/*!****************************************!*\ - !*** ./src/100_options_microphone.tsx ***! - \****************************************/ -/***/ ((__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 */ \"useMicrophoneOptions\": () => (/* binding */ useMicrophoneOptions)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.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 _const__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./const */ \"./src/const.ts\");\n/* harmony import */ var _101_server_setting__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./101_server_setting */ \"./src/101_server_setting.tsx\");\n/* harmony import */ var _102_device_setting__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./102_device_setting */ \"./src/102_device_setting.tsx\");\n/* harmony import */ var _104_convert_setting__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./104_convert_setting */ \"./src/104_convert_setting.tsx\");\n/* harmony import */ var _105_advanced_setting__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./105_advanced_setting */ \"./src/105_advanced_setting.tsx\");\n/* harmony import */ var _103_speaker_setting__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./103_speaker_setting */ \"./src/103_speaker_setting.tsx\");\n/* harmony import */ var _hooks_useClient__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./hooks/useClient */ \"./src/hooks/useClient.ts\");\n/* harmony import */ var _106_server_control__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./106_server_control */ \"./src/106_server_control.tsx\");\n\n\n\n\n\n\n\n\n\n\n\nvar useMicrophoneOptions = function useMicrophoneOptions() {\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(_useState, 2),\n audioContext = _useState2[0],\n setAudioContext = _useState2[1];\n var clientState = (0,_hooks_useClient__WEBPACK_IMPORTED_MODULE_8__.useClient)({\n audioContext: audioContext,\n audioOutputElementId: _const__WEBPACK_IMPORTED_MODULE_2__.AUDIO_ELEMENT_FOR_PLAY_RESULT\n });\n var serverSetting = (0,_101_server_setting__WEBPACK_IMPORTED_MODULE_3__.useServerSettingArea)({\n clientState: clientState\n });\n var deviceSetting = (0,_102_device_setting__WEBPACK_IMPORTED_MODULE_4__.useDeviceSetting)(audioContext, {\n clientState: clientState\n });\n var speakerSetting = (0,_103_speaker_setting__WEBPACK_IMPORTED_MODULE_7__.useSpeakerSetting)({\n clientState: clientState\n });\n var convertSetting = (0,_104_convert_setting__WEBPACK_IMPORTED_MODULE_5__.useConvertSetting)({\n clientState: clientState\n });\n var advancedSetting = (0,_105_advanced_setting__WEBPACK_IMPORTED_MODULE_6__.useAdvancedSetting)({\n clientState: clientState\n });\n var serverControl = (0,_106_server_control__WEBPACK_IMPORTED_MODULE_9__.useServerControl)({\n clientState: clientState\n });\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n var createAudioContext = function createAudioContext() {\n var ctx = new AudioContext();\n setAudioContext(ctx);\n document.removeEventListener('touchstart', createAudioContext);\n document.removeEventListener('mousedown', createAudioContext);\n };\n document.addEventListener('touchstart', createAudioContext);\n document.addEventListener('mousedown', createAudioContext);\n }, []);\n var voiceChangerSetting = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(react__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(\"div\", {\n className: \"body-row left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(\"div\", {\n className: \"body-section-title\"\n }, \"Virtual Microphone\")), serverControl.serverControl, serverSetting.serverSetting, deviceSetting.deviceSetting, speakerSetting.speakerSetting, convertSetting.convertSetting, advancedSetting.advancedSetting);\n }, [serverControl.serverControl, serverSetting.serverSetting, deviceSetting.deviceSetting, speakerSetting.speakerSetting, convertSetting.convertSetting, advancedSetting.advancedSetting]);\n return {\n voiceChangerSetting: voiceChangerSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/100_options_microphone.tsx?"); - -/***/ }), - -/***/ "./src/101_server_setting.tsx": -/*!************************************!*\ - !*** ./src/101_server_setting.tsx ***! - \************************************/ -/***/ ((__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 */ \"useServerSettingArea\": () => (/* binding */ useServerSettingArea)\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 _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);\n\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 useServerSettingArea = function useServerSettingArea(props) {\n var mmvcServerUrlRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n var onSetServerClicked = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee() {\n var input;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n input = document.getElementById(\"mmvc-server-url\");\n props.clientState.clientSetting.setServerUrl(input.value);\n case 2:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function onSetServerClicked() {\n return _ref.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"MMVC Server\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"input\", {\n type: \"text\",\n defaultValue: props.clientState.clientSetting.setting.mmvcServerUrl,\n id: \"mmvc-server-url\",\n className: \"body-item-input\"\n })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onSetServerClicked\n }, \"set\")));\n }, [props.clientState.clientSetting.setting.mmvcServerUrl, props.clientState.clientSetting.setServerUrl]);\n var uploadeModelRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n var _props$clientState$se, _props$clientState$se2, _props$clientState$se3;\n var onPyTorchFileLoadClicked = /*#__PURE__*/function () {\n var _ref2 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee2() {\n var file;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee2$(_context2) {\n while (1) switch (_context2.prev = _context2.next) {\n case 0:\n _context2.next = 2;\n return (0,_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.fileSelector)(\"\");\n case 2:\n file = _context2.sent;\n if (!(file.name.endsWith(\".pth\") == false)) {\n _context2.next = 6;\n break;\n }\n alert(\"モデルファイルの拡張子はpthである必要があります。\");\n return _context2.abrupt(\"return\");\n case 6:\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n pyTorchModel: file\n }));\n case 7:\n case \"end\":\n return _context2.stop();\n }\n }, _callee2);\n }));\n return function onPyTorchFileLoadClicked() {\n return _ref2.apply(this, arguments);\n };\n }();\n var onPyTorchFileClearClicked = function onPyTorchFileClearClicked() {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n pyTorchModel: null\n }));\n };\n var onConfigFileLoadClicked = /*#__PURE__*/function () {\n var _ref3 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee3() {\n var file;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee3$(_context3) {\n while (1) switch (_context3.prev = _context3.next) {\n case 0:\n _context3.next = 2;\n return (0,_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.fileSelector)(\"\");\n case 2:\n file = _context3.sent;\n if (!(file.name.endsWith(\".json\") == false)) {\n _context3.next = 6;\n break;\n }\n alert(\"モデルファイルの拡張子はjsonである必要があります。\");\n return _context3.abrupt(\"return\");\n case 6:\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n configFile: file\n }));\n case 7:\n case \"end\":\n return _context3.stop();\n }\n }, _callee3);\n }));\n return function onConfigFileLoadClicked() {\n return _ref3.apply(this, arguments);\n };\n }();\n var onConfigFileClearClicked = function onConfigFileClearClicked() {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n configFile: null\n }));\n };\n var onOnnxFileLoadClicked = /*#__PURE__*/function () {\n var _ref4 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee4() {\n var file;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee4$(_context4) {\n while (1) switch (_context4.prev = _context4.next) {\n case 0:\n _context4.next = 2;\n return (0,_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.fileSelector)(\"\");\n case 2:\n file = _context4.sent;\n if (!(file.name.endsWith(\".onnx\") == false)) {\n _context4.next = 6;\n break;\n }\n alert(\"モデルファイルの拡張子はonnxである必要があります。\");\n return _context4.abrupt(\"return\");\n case 6:\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n onnxModel: file\n }));\n case 7:\n case \"end\":\n return _context4.stop();\n }\n }, _callee4);\n }));\n return function onOnnxFileLoadClicked() {\n return _ref4.apply(this, arguments);\n };\n }();\n var onOnnxFileClearClicked = function onOnnxFileClearClicked() {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n onnxModel: null\n }));\n };\n var onModelUploadClicked = /*#__PURE__*/function () {\n var _ref5 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee5() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee5$(_context5) {\n while (1) switch (_context5.prev = _context5.next) {\n case 0:\n props.clientState.loadModel();\n case 1:\n case \"end\":\n return _context5.stop();\n }\n }, _callee5);\n }));\n return function onModelUploadClicked() {\n return _ref5.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement((react__WEBPACK_IMPORTED_MODULE_4___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Model Uploader\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-2\"\n }, \"PyTorch(.pth)\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null, (_props$clientState$se = props.clientState.settingState.pyTorchModel) === null || _props$clientState$se === void 0 ? void 0 : _props$clientState$se.name)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onPyTorchFileLoadClicked\n }, \"select\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button left-margin-1\",\n onClick: onPyTorchFileClearClicked\n }, \"clear\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-2\"\n }, \"Config(.json)\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null, (_props$clientState$se2 = props.clientState.settingState.configFile) === null || _props$clientState$se2 === void 0 ? void 0 : _props$clientState$se2.name)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onConfigFileLoadClicked\n }, \"select\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button left-margin-1\",\n onClick: onConfigFileClearClicked\n }, \"clear\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-2\"\n }, \"Onnx(.onnx)\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null, (_props$clientState$se3 = props.clientState.settingState.onnxModel) === null || _props$clientState$se3 === void 0 ? void 0 : _props$clientState$se3.name)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onOnnxFileLoadClicked\n }, \"select\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button left-margin-1\",\n onClick: onOnnxFileClearClicked\n }, \"clear\"))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-2\"\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, props.clientState.isUploading ? \"uploading.... \".concat(props.clientState.uploadProgress, \"%\") : \"\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onModelUploadClicked\n }, \"upload\"))));\n }, [props.clientState.settingState, props.clientState.loadModel, props.clientState.isUploading, props.clientState.uploadProgress]);\n var protocolRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n var onProtocolChanged = /*#__PURE__*/function () {\n var _ref6 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee6(val) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee6$(_context6) {\n while (1) switch (_context6.prev = _context6.next) {\n case 0:\n props.clientState.clientSetting.setProtocol(val);\n case 1:\n case \"end\":\n return _context6.stop();\n }\n }, _callee6);\n }));\n return function onProtocolChanged(_x) {\n return _ref6.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Protocol\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.clientSetting.setting.protocol,\n onChange: function onChange(e) {\n onProtocolChanged(e.target.value);\n }\n }, Object.values(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.Protocol).map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x,\n value: x\n }, x);\n }))));\n }, [props.clientState.clientSetting.setting.protocol, props.clientState.clientSetting.setProtocol]);\n var frameworkRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n var onFrameworkChanged = /*#__PURE__*/function () {\n var _ref7 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee7(val) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee7$(_context7) {\n while (1) switch (_context7.prev = _context7.next) {\n case 0:\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n framework: val\n }));\n case 1:\n case \"end\":\n return _context7.stop();\n }\n }, _callee7);\n }));\n return function onFrameworkChanged(_x2) {\n return _ref7.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Framework\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.settingState.framework,\n onChange: function onChange(e) {\n onFrameworkChanged(e.target.value);\n }\n }, Object.values(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.Framework).map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x,\n value: x\n }, x);\n }))));\n }, [props.clientState.settingState]);\n var onnxExecutionProviderRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n if (props.clientState.settingState.framework != \"ONNX\") {\n return;\n }\n var onOnnxExecutionProviderChanged = /*#__PURE__*/function () {\n var _ref8 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee8(val) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee8$(_context8) {\n while (1) switch (_context8.prev = _context8.next) {\n case 0:\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n onnxExecutionProvider: val\n }));\n case 1:\n case \"end\":\n return _context8.stop();\n }\n }, _callee8);\n }));\n return function onOnnxExecutionProviderChanged(_x3) {\n return _ref8.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-2\"\n }, \"OnnxExecutionProvider\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.settingState.onnxExecutionProvider,\n onChange: function onChange(e) {\n onOnnxExecutionProviderChanged(e.target.value);\n }\n }, Object.values(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.OnnxExecutionProvider).map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x,\n value: x\n }, x);\n }))));\n }, [props.clientState.settingState]);\n var serverSetting = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement((react__WEBPACK_IMPORTED_MODULE_4___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-sub-section-title\"\n }, \"Server Setting\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n })), mmvcServerUrlRow, uploadeModelRow, frameworkRow, onnxExecutionProviderRow, protocolRow);\n }, [mmvcServerUrlRow, uploadeModelRow, frameworkRow, onnxExecutionProviderRow, protocolRow]);\n return {\n serverSetting: serverSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/101_server_setting.tsx?"); - -/***/ }), - -/***/ "./src/102_device_setting.tsx": -/*!************************************!*\ - !*** ./src/102_device_setting.tsx ***! - \************************************/ -/***/ ((__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 */ \"useDeviceSetting\": () => (/* binding */ useDeviceSetting)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.js\");\n/* harmony import */ var _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _const__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./const */ \"./src/const.ts\");\n\n\n\n\n\n\nvar reloadDevices = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee() {\n var mediaDeviceInfos, audioInputs, audioOutputs;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n _context.prev = 0;\n _context.next = 3;\n return navigator.mediaDevices.getUserMedia({\n video: true,\n audio: true\n });\n case 3:\n _context.next = 8;\n break;\n case 5:\n _context.prev = 5;\n _context.t0 = _context[\"catch\"](0);\n console.warn(\"Enumerate device error::\", _context.t0);\n case 8:\n _context.next = 10;\n return navigator.mediaDevices.enumerateDevices();\n case 10:\n mediaDeviceInfos = _context.sent;\n audioInputs = mediaDeviceInfos.filter(function (x) {\n return x.kind == \"audioinput\";\n });\n audioInputs.push({\n deviceId: \"none\",\n groupId: \"none\",\n kind: \"audioinput\",\n label: \"none\",\n toJSON: function toJSON() {}\n });\n audioInputs.push({\n deviceId: \"file\",\n groupId: \"file\",\n kind: \"audioinput\",\n label: \"file\",\n toJSON: function toJSON() {}\n });\n audioOutputs = mediaDeviceInfos.filter(function (x) {\n return x.kind == \"audiooutput\";\n });\n return _context.abrupt(\"return\", [audioInputs, audioOutputs]);\n case 16:\n case \"end\":\n return _context.stop();\n }\n }, _callee, null, [[0, 5]]);\n }));\n return function reloadDevices() {\n return _ref.apply(this, arguments);\n };\n}();\nvar useDeviceSetting = function useDeviceSetting(audioContext, props) {\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)([]),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(_useState, 2),\n inputAudioDeviceInfo = _useState2[0],\n setInputAudioDeviceInfo = _useState2[1];\n var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)([]),\n _useState4 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(_useState3, 2),\n outputAudioDeviceInfo = _useState4[0],\n setOutputAudioDeviceInfo = _useState4[1];\n var _useState5 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(\"none\"),\n _useState6 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(_useState5, 2),\n audioInputForGUI = _useState6[0],\n setAudioInputForGUI = _useState6[1];\n var _useState7 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(\"none\"),\n _useState8 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(_useState7, 2),\n audioOutputForGUI = _useState8[0],\n setAudioOutputForGUI = _useState8[1];\n (0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(function () {\n var initialize = /*#__PURE__*/function () {\n var _ref2 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee2() {\n var audioInfo;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee2$(_context2) {\n while (1) switch (_context2.prev = _context2.next) {\n case 0:\n _context2.next = 2;\n return reloadDevices();\n case 2:\n audioInfo = _context2.sent;\n setInputAudioDeviceInfo(audioInfo[0]);\n setOutputAudioDeviceInfo(audioInfo[1]);\n // if (CHROME_EXTENSION) {\n // //@ts-ignore\n // const storedOptions = await chrome.storage.local.get(\"microphoneOptions\")\n // if (storedOptions) {\n // setOptions(storedOptions)\n // }\n // }\n case 5:\n case \"end\":\n return _context2.stop();\n }\n }, _callee2);\n }));\n return function initialize() {\n return _ref2.apply(this, arguments);\n };\n }();\n initialize();\n }, []);\n var audioInputRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"AudioInput\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: audioInputForGUI,\n onChange: function onChange(e) {\n setAudioInputForGUI(e.target.value);\n }\n }, inputAudioDeviceInfo.map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x.deviceId,\n value: x.deviceId\n }, x.label);\n }))));\n }, [inputAudioDeviceInfo, audioInputForGUI]);\n (0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(function () {\n if (!audioContext) {\n return;\n }\n if (audioInputForGUI == \"none\") {\n var ms = (0,_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.createDummyMediaStream)(audioContext);\n props.clientState.clientSetting.setAudioInput(ms);\n } else if (audioInputForGUI == \"file\") {\n // file selector (audioMediaInputRow)\n } else {\n props.clientState.clientSetting.setAudioInput(audioInputForGUI);\n }\n }, [audioContext, audioInputForGUI, props.clientState.clientSetting.setAudioInput]);\n var audioMediaInputRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n if (audioInputForGUI != \"file\") {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement((react__WEBPACK_IMPORTED_MODULE_4___default().Fragment), null);\n }\n var onFileLoadClicked = /*#__PURE__*/function () {\n var _ref3 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee3() {\n var url, audio, src, dst, audio_org;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee3$(_context3) {\n while (1) switch (_context3.prev = _context3.next) {\n case 0:\n _context3.next = 2;\n return (0,_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.fileSelectorAsDataURL)(\"\");\n case 2:\n url = _context3.sent;\n // input stream for client.\n audio = document.getElementById(_const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_TEST_CONVERTED);\n audio.src = url;\n _context3.next = 7;\n return audio.play();\n case 7:\n src = audioContext.createMediaElementSource(audio);\n dst = audioContext.createMediaStreamDestination();\n src.connect(dst);\n props.clientState.clientSetting.setAudioInput(dst.stream);\n // original stream to play.\n audio_org = document.getElementById(_const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_TEST_ORIGINAL);\n audio_org.src = url;\n audio_org.pause();\n\n // audio_org.onplay = () => {\n // console.log(audioOutputRef.current)\n // // @ts-ignore\n // audio_org.setSinkId(audioOutputRef.current)\n // }\n case 14:\n case \"end\":\n return _context3.stop();\n }\n }, _callee3);\n }));\n return function onFileLoadClicked() {\n return _ref3.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title\"\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null, \"org:\", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"audio\", {\n id: _const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_TEST_ORIGINAL,\n controls: true\n })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", null, \"cnv:\", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"audio\", {\n id: _const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_TEST_CONVERTED,\n controls: true\n }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onFileLoadClicked\n }, \"load\")));\n }, [audioInputForGUI, props.clientState.clientSetting.setAudioInput]);\n var audioOutputRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"AudioOutput\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: audioOutputForGUI,\n onChange: function onChange(e) {\n setAudioOutputForGUI(e.target.value);\n }\n }, outputAudioDeviceInfo.map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x.deviceId,\n value: x.deviceId\n }, x.label);\n })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"audio\", {\n hidden: true,\n id: _const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_PLAY_RESULT\n })));\n }, [outputAudioDeviceInfo, audioOutputForGUI]);\n (0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(function () {\n if (audioOutputForGUI == \"none\") return;\n [_const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_PLAY_RESULT, _const__WEBPACK_IMPORTED_MODULE_5__.AUDIO_ELEMENT_FOR_TEST_ORIGINAL].forEach(function (x) {\n var audio = document.getElementById(x);\n if (audio) {\n // @ts-ignore\n audio.setSinkId(audioOutputForGUI);\n }\n });\n }, [audioOutputForGUI]);\n var sampleRateRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Sample Rate\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.clientSetting.setting.sampleRate,\n onChange: function onChange(e) {\n props.clientState.clientSetting.setSampleRate(Number(e.target.value));\n }\n }, Object.values(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.SampleRate).map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x,\n value: x\n }, x);\n }))));\n }, [props.clientState.clientSetting.setting.sampleRate, props.clientState.clientSetting.setSampleRate]);\n var deviceSetting = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement((react__WEBPACK_IMPORTED_MODULE_4___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-sub-section-title\"\n }, \"Device Setting\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n })), audioInputRow, audioMediaInputRow, sampleRateRow, audioOutputRow);\n }, [audioInputRow, audioMediaInputRow, sampleRateRow, audioOutputRow]);\n return {\n deviceSetting: deviceSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/102_device_setting.tsx?"); - -/***/ }), - -/***/ "./src/103_speaker_setting.tsx": -/*!*************************************!*\ - !*** ./src/103_speaker_setting.tsx ***! - \*************************************/ -/***/ ((__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 */ \"useSpeakerSetting\": () => (/* binding */ useSpeakerSetting)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ \"./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js\");\n/* harmony import */ var _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ \"./node_modules/@babel/runtime/helpers/esm/defineProperty.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);\n\n\n\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_2__[\"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\nvar useSpeakerSetting = function useSpeakerSetting(props) {\n var srcIdRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Source Speaker Id\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.settingState.srcId,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n srcId: Number(e.target.value)\n }));\n }\n }, props.clientState.clientSetting.setting.speakers.map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x.id,\n value: x.id\n }, x.name, \"(\", x.id, \")\");\n }))));\n }, [props.clientState.clientSetting.setting.speakers, props.clientState.settingState]);\n var dstIdRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Destination Speaker Id\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.settingState.dstId,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n dstId: Number(e.target.value)\n }));\n }\n }, props.clientState.clientSetting.setting.speakers.map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"option\", {\n key: x.id,\n value: x.id\n }, x.name, \"(\", x.id, \")\");\n }))));\n }, [props.clientState.clientSetting.setting.speakers, props.clientState.settingState]);\n var editSpeakerIdMappingRow = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n var onSetSpeakerMappingClicked = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee() {\n var targetId, targetName, targetSpeaker, newSpeakers;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n targetId = props.clientState.settingState.editSpeakerTargetId;\n targetName = props.clientState.settingState.editSpeakerTargetName;\n targetSpeaker = props.clientState.clientSetting.setting.speakers.find(function (x) {\n return x.id == targetId;\n });\n if (targetSpeaker) {\n if (targetName.length == 0) {\n // Delete\n newSpeakers = props.clientState.clientSetting.setting.speakers.filter(function (x) {\n return x.id != targetId;\n });\n props.clientState.clientSetting.setSpeakers(newSpeakers);\n } else {\n // Update\n targetSpeaker.name = targetName;\n props.clientState.clientSetting.setSpeakers((0,_babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(props.clientState.clientSetting.setting.speakers));\n }\n } else {\n if (targetName.length == 0) {// Noop\n } else {\n // add\n props.clientState.clientSetting.setting.speakers.push({\n id: targetId,\n name: targetName\n });\n props.clientState.clientSetting.setSpeakers((0,_babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(props.clientState.clientSetting.setting.speakers));\n }\n }\n case 4:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function onSetSpeakerMappingClicked() {\n return _ref.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-1-2-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Edit Speaker Mapping\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"input\", {\n type: \"number\",\n min: 1,\n max: 256,\n step: 1,\n value: props.clientState.settingState.editSpeakerTargetId,\n onChange: function onChange(e) {\n var _props$clientState$cl;\n var id = Number(e.target.value);\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n editSpeakerTargetId: id,\n editSpeakerTargetName: ((_props$clientState$cl = props.clientState.clientSetting.setting.speakers.find(function (x) {\n return x.id == id;\n })) === null || _props$clientState$cl === void 0 ? void 0 : _props$clientState$cl.name) || \"\"\n }));\n }\n })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"input\", {\n type: \"text\",\n value: props.clientState.settingState.editSpeakerTargetName,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n editSpeakerTargetName: e.target.value\n }));\n }\n })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onSetSpeakerMappingClicked\n }, \"set\")));\n }, [props.clientState.settingState, props.clientState.clientSetting.setting.speakers]);\n var speakerSetting = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement((react__WEBPACK_IMPORTED_MODULE_4___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-sub-section-title\"\n }, \"Speaker Setting\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4___default().createElement(\"div\", {\n className: \"body-select-container\"\n })), srcIdRow, dstIdRow, editSpeakerIdMappingRow);\n }, [srcIdRow, dstIdRow, editSpeakerIdMappingRow]);\n return {\n speakerSetting: speakerSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/103_speaker_setting.tsx?"); - -/***/ }), - -/***/ "./src/104_convert_setting.tsx": -/*!*************************************!*\ - !*** ./src/104_convert_setting.tsx ***! - \*************************************/ -/***/ ((__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 */ \"useConvertSetting\": () => (/* binding */ useConvertSetting)\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 _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);\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\nvar useConvertSetting = function useConvertSetting(props) {\n var bufferSizeRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Buffer Size\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.clientSetting.setting.bufferSize,\n onChange: function onChange(e) {\n props.clientState.clientSetting.setBufferSize(Number(e.target.value));\n }\n }, Object.values(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__.BufferSize).map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"option\", {\n key: x,\n value: x\n }, x);\n }))));\n }, [props.clientState.clientSetting.setting.bufferSize, props.clientState.clientSetting.setBufferSize]);\n var inputChunkNumRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Input Chunk Num(128sample/chunk)\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 1,\n max: 256,\n step: 1,\n value: props.clientState.clientSetting.setting.inputChunkNum,\n onChange: function onChange(e) {\n props.clientState.clientSetting.setInputChunkNum(Number(e.target.value));\n }\n })));\n }, [props.clientState.clientSetting.setting.inputChunkNum, props.clientState.clientSetting.setInputChunkNum]);\n var convertChunkNumRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Convert Chunk Num(128sample/chunk)\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 1,\n max: 256,\n step: 1,\n value: props.clientState.settingState.convertChunkNum,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n convertChunkNum: Number(e.target.value)\n }));\n }\n })));\n }, [props.clientState.settingState]);\n var gpuRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"GPU\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: -2,\n max: 5,\n step: 1,\n value: props.clientState.settingState.gpu,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n gpu: Number(e.target.value)\n }));\n }\n })));\n }, [props.clientState.settingState]);\n var crossFadeOverlapRateRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Cross Fade Overlap Rate\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 0.1,\n max: 1,\n step: 0.1,\n value: props.clientState.settingState.crossFadeOverlapRate,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n crossFadeOverlapRate: Number(e.target.value)\n }));\n }\n })));\n }, [props.clientState.settingState]);\n var crossFadeOffsetRateRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Cross Fade Offset Rate\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 0,\n max: 1,\n step: 0.1,\n value: props.clientState.settingState.crossFadeOffsetRate,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n crossFadeOffsetRate: Number(e.target.value)\n }));\n }\n })));\n }, [props.clientState.settingState]);\n var crossFadeEndRateRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Cross Fade End Rate\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 0,\n max: 1,\n step: 0.1,\n value: props.clientState.settingState.crossFadeEndRate,\n onChange: function onChange(e) {\n props.clientState.setSettingState(_objectSpread(_objectSpread({}, props.clientState.settingState), {}, {\n crossFadeEndRate: Number(e.target.value)\n }));\n }\n })));\n }, [props.clientState.settingState]);\n var convertSetting = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-sub-section-title\"\n }, \"Converter Setting\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-select-container\"\n })), bufferSizeRow, inputChunkNumRow, convertChunkNumRow, gpuRow, crossFadeOverlapRateRow, crossFadeOffsetRateRow, crossFadeEndRateRow);\n }, [bufferSizeRow, inputChunkNumRow, convertChunkNumRow, gpuRow, crossFadeOverlapRateRow, crossFadeOffsetRateRow, crossFadeEndRateRow]);\n return {\n convertSetting: convertSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/104_convert_setting.tsx?"); - -/***/ }), - -/***/ "./src/105_advanced_setting.tsx": -/*!**************************************!*\ - !*** ./src/105_advanced_setting.tsx ***! - \**************************************/ -/***/ ((__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 */ \"useAdvancedSetting\": () => (/* binding */ useAdvancedSetting)\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 _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);\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\nvar useAdvancedSetting = function useAdvancedSetting(props) {\n var vfForceDisableRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1 \"\n }, \"VF Disabled\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"checkbox\",\n checked: props.clientState.clientSetting.setting.forceVfDisable,\n onChange: function onChange(e) {\n props.clientState.clientSetting.setVfForceDisabled(e.target.checked);\n }\n })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-button-container\"\n }));\n }, [props.clientState.clientSetting.setting.forceVfDisable, props.clientState.clientSetting.setVfForceDisabled]);\n var voiceChangeModeRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1 \"\n }, \"Voice Change Mode\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-select-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"select\", {\n className: \"body-select\",\n value: props.clientState.clientSetting.setting.voiceChangerMode,\n onChange: function onChange(e) {\n props.clientState.clientSetting.setVoiceChangerMode(e.target.value);\n }\n }, Object.values(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__.VoiceChangerMode).map(function (x) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"option\", {\n key: x,\n value: x\n }, x);\n }))));\n }, [props.clientState.clientSetting.setting.voiceChangerMode, props.clientState.clientSetting.setVoiceChangerMode]);\n var workletSettingRow = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Trancate Num\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 50,\n max: 300,\n step: 1,\n value: props.clientState.workletSetting.setting.numTrancateTreshold,\n onChange: function onChange(e) {\n props.clientState.workletSetting.setSetting(_objectSpread(_objectSpread({}, props.clientState.workletSetting.setting), {}, {\n numTrancateTreshold: Number(e.target.value)\n }));\n }\n }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Trancate Vol\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 0.0001,\n max: 0.0009,\n step: 0.0001,\n value: props.clientState.workletSetting.setting.volTrancateThreshold,\n onChange: function onChange(e) {\n props.clientState.workletSetting.setSetting(_objectSpread(_objectSpread({}, props.clientState.workletSetting.setting), {}, {\n volTrancateThreshold: Number(e.target.value)\n }));\n }\n }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Trancate Vol Length\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-input-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"input\", {\n type: \"number\",\n min: 16,\n max: 128,\n step: 1,\n value: props.clientState.workletSetting.setting.volTrancateLength,\n onChange: function onChange(e) {\n props.clientState.workletSetting.setSetting(_objectSpread(_objectSpread({}, props.clientState.workletSetting.setting), {}, {\n volTrancateLength: Number(e.target.value)\n }));\n }\n }))));\n }, [props.clientState.workletSetting.setting, props.clientState.workletSetting.setSetting]);\n var advancedSetting = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-sub-section-title\"\n }, \"Advanced Setting\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(\"div\", {\n className: \"body-select-container\"\n })), vfForceDisableRow, voiceChangeModeRow, workletSettingRow);\n }, [vfForceDisableRow, voiceChangeModeRow, workletSettingRow]);\n return {\n advancedSetting: advancedSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/105_advanced_setting.tsx?"); - -/***/ }), - -/***/ "./src/106_server_control.tsx": -/*!************************************!*\ - !*** ./src/106_server_control.tsx ***! - \************************************/ -/***/ ((__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 */ \"useServerControl\": () => (/* binding */ useServerControl)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_3__);\n\n\n\n\nvar useServerControl = function useServerControl(props) {\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(false),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState, 2),\n isStarted = _useState2[0],\n setIsStarted = _useState2[1];\n var startButtonRow = (0,react__WEBPACK_IMPORTED_MODULE_3__.useMemo)(function () {\n var onStartClicked = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n setIsStarted(true);\n _context.next = 3;\n return props.clientState.start();\n case 3:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function onStartClicked() {\n return _ref.apply(this, arguments);\n };\n }();\n var onStopClicked = /*#__PURE__*/function () {\n var _ref2 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee2() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee2$(_context2) {\n while (1) switch (_context2.prev = _context2.next) {\n case 0:\n setIsStarted(false);\n _context2.next = 3;\n return props.clientState.stop();\n case 3:\n case \"end\":\n return _context2.stop();\n }\n }, _callee2);\n }));\n return function onStopClicked() {\n return _ref2.apply(this, arguments);\n };\n }();\n var startClassName = isStarted ? \"body-button-active\" : \"body-button-stanby\";\n var stopClassName = isStarted ? \"body-button-stanby\" : \"body-button-active\";\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Start\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n onClick: onStartClicked,\n className: startClassName\n }, \"start\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n onClick: onStopClicked,\n className: stopClassName\n }, \"stop\")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-input-container\"\n }));\n }, [isStarted, props.clientState.start, props.clientState.stop]);\n var performanceRow = (0,react__WEBPACK_IMPORTED_MODULE_3__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement((react__WEBPACK_IMPORTED_MODULE_3___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-row split-3-1-1-1-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"monitor:\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, \"vol(rms):\", props.clientState.volume.toFixed(4)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, \"buf(ms):\", props.clientState.bufferingTime), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, \"res(ms):\", props.clientState.responseTime), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-text\"\n })));\n }, [props.clientState.volume, props.clientState.bufferingTime, props.clientState.responseTime]);\n var infoRow = (0,react__WEBPACK_IMPORTED_MODULE_3__.useMemo)(function () {\n var _props$clientState$se, _props$clientState$se2, _props$clientState$se3;\n var onReloadClicked = /*#__PURE__*/function () {\n var _ref3 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee3() {\n var info;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee3$(_context3) {\n while (1) switch (_context3.prev = _context3.next) {\n case 0:\n _context3.next = 2;\n return props.clientState.getInfo();\n case 2:\n info = _context3.sent;\n console.log(\"info\", info);\n case 4:\n case \"end\":\n return _context3.stop();\n }\n }, _callee3);\n }));\n return function onReloadClicked() {\n return _ref3.apply(this, arguments);\n };\n }();\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement((react__WEBPACK_IMPORTED_MODULE_3___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-row split-3-3-4 left-padding-1 guided\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-title left-padding-1\"\n }, \"Model Info:\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-item-text\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"span\", {\n className: \"body-item-text-item\"\n }, ((_props$clientState$se = props.clientState.serverInfo) === null || _props$clientState$se === void 0 ? void 0 : _props$clientState$se.configFile) || \"\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"span\", {\n className: \"body-item-text-item\"\n }, ((_props$clientState$se2 = props.clientState.serverInfo) === null || _props$clientState$se2 === void 0 ? void 0 : _props$clientState$se2.pyTorchModelFile) || \"\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"span\", {\n className: \"body-item-text-item\"\n }, ((_props$clientState$se3 = props.clientState.serverInfo) === null || _props$clientState$se3 === void 0 ? void 0 : _props$clientState$se3.onnxModelFile) || \"\")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-button-container\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-button\",\n onClick: onReloadClicked\n }, \"reload\"))));\n }, [props.clientState.getInfo, props.clientState.serverInfo]);\n var serverControl = (0,react__WEBPACK_IMPORTED_MODULE_3__.useMemo)(function () {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement((react__WEBPACK_IMPORTED_MODULE_3___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-row split-3-7 left-padding-1\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-sub-section-title\"\n }, \"Server Control\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default().createElement(\"div\", {\n className: \"body-select-container\"\n })), startButtonRow, performanceRow, infoRow);\n }, [startButtonRow, performanceRow, infoRow]);\n return {\n serverControl: serverControl\n };\n};\n\n//# sourceURL=webpack://demo/./src/106_server_control.tsx?"); - -/***/ }), - -/***/ "./src/const.ts": -/*!**********************!*\ - !*** ./src/const.ts ***! - \**********************/ -/***/ ((__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 */ \"AUDIO_ELEMENT_FOR_PLAY_RESULT\": () => (/* binding */ AUDIO_ELEMENT_FOR_PLAY_RESULT),\n/* harmony export */ \"AUDIO_ELEMENT_FOR_TEST_CONVERTED\": () => (/* binding */ AUDIO_ELEMENT_FOR_TEST_CONVERTED),\n/* harmony export */ \"AUDIO_ELEMENT_FOR_TEST_ORIGINAL\": () => (/* binding */ AUDIO_ELEMENT_FOR_TEST_ORIGINAL),\n/* harmony export */ \"CHROME_EXTENSION\": () => (/* binding */ CHROME_EXTENSION)\n/* harmony export */ });\nvar CHROME_EXTENSION = false;\nvar AUDIO_ELEMENT_FOR_PLAY_RESULT = \"audio-result\";\nvar AUDIO_ELEMENT_FOR_TEST_ORIGINAL = \"audio-test-original\";\nvar AUDIO_ELEMENT_FOR_TEST_CONVERTED = \"audio-test-converted\";\n\n//# sourceURL=webpack://demo/./src/const.ts?"); - -/***/ }), - -/***/ "./src/hooks/useClient.ts": -/*!********************************!*\ - !*** ./src/hooks/useClient.ts ***! - \********************************/ -/***/ ((__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 */ \"useClient\": () => (/* binding */ useClient)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _useClientSetting__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./useClientSetting */ \"./src/hooks/useClientSetting.ts\");\n/* harmony import */ var _useServerSetting__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./useServerSetting */ \"./src/hooks/useServerSetting.ts\");\n/* harmony import */ var _useWorkletSetting__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./useWorkletSetting */ \"./src/hooks/useWorkletSetting.ts\");\n\n\n\n\n\n\n\n\nvar InitialSettingState = {\n pyTorchModel: null,\n configFile: null,\n onnxModel: null,\n framework: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.framework,\n onnxExecutionProvider: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.onnxExecutionProvider,\n // speakers: DefaultVoiceChangerClientSetting.speakers,\n editSpeakerTargetId: 0,\n editSpeakerTargetName: \"\",\n srcId: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.srcId,\n dstId: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.dstId,\n convertChunkNum: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.convertChunkNum,\n gpu: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.gpu,\n crossFadeOffsetRate: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.crossFadeOffsetRate,\n crossFadeEndRate: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.crossFadeEndRate,\n crossFadeOverlapRate: _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.DefaultVoiceChangerServerSetting.crossFadeOverlapRate\n};\nvar useClient = function useClient(props) {\n // (1) クライアント初期化\n var voiceChangerClientRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)(null);\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(voiceChangerClientRef.current),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState, 2),\n voiceChangerClient = _useState2[0],\n setVoiceChangerClient = _useState2[1];\n var clientSetting = (0,_useClientSetting__WEBPACK_IMPORTED_MODULE_5__.useClientSetting)({\n voiceChangerClient: voiceChangerClient,\n audioContext: props.audioContext\n });\n var workletSetting = (0,_useWorkletSetting__WEBPACK_IMPORTED_MODULE_7__.useWorkletSetting)({\n voiceChangerClient: voiceChangerClient\n });\n var serverSetting = (0,_useServerSetting__WEBPACK_IMPORTED_MODULE_6__.useServerSetting)({\n voiceChangerClient: voiceChangerClient\n });\n var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(false),\n _useState4 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState3, 2),\n clientInitialized = _useState4[0],\n setClientInitialized = _useState4[1];\n var initializedResolveRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)();\n var initializedPromise = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return new Promise(function (resolve) {\n initializedResolveRef.current = resolve;\n });\n }, []);\n var _useState5 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(0),\n _useState6 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState5, 2),\n bufferingTime = _useState6[0],\n setBufferingTime = _useState6[1];\n var _useState7 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(0),\n _useState8 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState7, 2),\n responseTime = _useState8[0],\n setResponseTime = _useState8[1];\n var _useState9 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(0),\n _useState10 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState9, 2),\n volume = _useState10[0],\n setVolume = _useState10[1];\n\n // Colab対応\n (0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(function () {\n var params = new URLSearchParams(location.search);\n var colab = params.get(\"colab\");\n if (colab == \"true\") {}\n }, []);\n (0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(function () {\n var initialized = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee() {\n var voiceChangerClient, audio;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n if (props.audioContext) {\n _context.next = 2;\n break;\n }\n return _context.abrupt(\"return\");\n case 2:\n voiceChangerClient = new _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_3__.VoiceChangerClient(props.audioContext, true, {\n notifySendBufferingTime: function notifySendBufferingTime(val) {\n setBufferingTime(val);\n },\n notifyResponseTime: function notifyResponseTime(val) {\n setResponseTime(val);\n },\n notifyException: function notifyException(mes) {\n if (mes.length > 0) {\n console.log(\"error:\".concat(mes));\n }\n }\n }, {\n notifyVolume: function notifyVolume(vol) {\n setVolume(vol);\n }\n });\n _context.next = 5;\n return voiceChangerClient.isInitialized();\n case 5:\n voiceChangerClientRef.current = voiceChangerClient;\n setVoiceChangerClient(voiceChangerClientRef.current);\n console.log(\"[useClient] client initialized\");\n setClientInitialized(true);\n audio = document.getElementById(props.audioOutputElementId);\n audio.srcObject = voiceChangerClientRef.current.stream;\n audio.play();\n initializedResolveRef.current();\n case 13:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function initialized() {\n return _ref.apply(this, arguments);\n };\n }();\n initialized();\n }, [props.audioContext]);\n\n // (2) 設定\n var _useState11 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(InitialSettingState),\n _useState12 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState11, 2),\n settingState = _useState12[0],\n setSettingState = _useState12[1];\n var _useState13 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(InitialSettingState),\n _useState14 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState13, 2),\n displaySettingState = _useState14[0],\n setDisplaySettingState = _useState14[1];\n var _useState15 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(),\n _useState16 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState15, 2),\n serverInfo = _useState16[0],\n setServerInfo = _useState16[1];\n var _useState17 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(0),\n _useState18 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState17, 2),\n uploadProgress = _useState18[0],\n setUploadProgress = _useState18[1];\n var _useState19 = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(false),\n _useState20 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(_useState19, 2),\n isUploading = _useState20[0],\n setIsUploading = _useState20[1];\n\n // (e) モデルアップロード\n var uploadFile = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref2 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee2(file, onprogress) {\n var num, res;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee2$(_context2) {\n while (1) switch (_context2.prev = _context2.next) {\n case 0:\n _context2.next = 2;\n return initializedPromise;\n case 2:\n _context2.next = 4;\n return voiceChangerClientRef.current.uploadFile(file, onprogress);\n case 4:\n num = _context2.sent;\n _context2.next = 7;\n return voiceChangerClientRef.current.concatUploadedFile(file, num);\n case 7:\n res = _context2.sent;\n console.log(\"uploaded\", num, res);\n case 9:\n case \"end\":\n return _context2.stop();\n }\n }, _callee2);\n }));\n return function (_x, _x2) {\n return _ref2.apply(this, arguments);\n };\n }();\n }, []);\n var loadModel = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/(0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee3() {\n var models, _loop, i, serverInfo;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee3$(_context4) {\n while (1) switch (_context4.prev = _context4.next) {\n case 0:\n if (!(!settingState.pyTorchModel && !settingState.onnxModel)) {\n _context4.next = 3;\n break;\n }\n alert(\"PyTorchモデルとONNXモデルのどちらか一つ以上指定する必要があります。\");\n return _context4.abrupt(\"return\");\n case 3:\n if (settingState.configFile) {\n _context4.next = 6;\n break;\n }\n alert(\"Configファイルを指定する必要があります。\");\n return _context4.abrupt(\"return\");\n case 6:\n _context4.next = 8;\n return initializedPromise;\n case 8:\n setUploadProgress(0);\n setIsUploading(true);\n models = [settingState.pyTorchModel, settingState.onnxModel].filter(function (x) {\n return x != null;\n });\n _loop = /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _loop() {\n var progRate, progOffset;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _loop$(_context3) {\n while (1) switch (_context3.prev = _context3.next) {\n case 0:\n progRate = 1 / models.length;\n progOffset = 100 * i * progRate;\n _context3.next = 4;\n return uploadFile(models[i], function (progress, end) {\n // console.log(progress * progRate + progOffset, end, progRate,)\n setUploadProgress(progress * progRate + progOffset);\n });\n case 4:\n case \"end\":\n return _context3.stop();\n }\n }, _loop);\n });\n i = 0;\n case 13:\n if (!(i < models.length)) {\n _context4.next = 18;\n break;\n }\n return _context4.delegateYield(_loop(), \"t0\", 15);\n case 15:\n i++;\n _context4.next = 13;\n break;\n case 18:\n _context4.next = 20;\n return uploadFile(settingState.configFile, function (progress, end) {\n console.log(progress, end);\n });\n case 20:\n _context4.next = 22;\n return voiceChangerClientRef.current.loadModel(settingState.configFile, settingState.pyTorchModel, settingState.onnxModel);\n case 22:\n serverInfo = _context4.sent;\n console.log(serverInfo);\n setUploadProgress(0);\n setIsUploading(false);\n case 26:\n case \"end\":\n return _context4.stop();\n }\n }, _callee3);\n }));\n }, [settingState.pyTorchModel, settingState.onnxModel, settingState.configFile]);\n\n // (2-6) server control\n // (1) start\n var start = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/(0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee4() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee4$(_context5) {\n while (1) switch (_context5.prev = _context5.next) {\n case 0:\n _context5.next = 2;\n return initializedPromise;\n case 2:\n voiceChangerClientRef.current.setServerUrl(clientSetting.setting.mmvcServerUrl, true);\n voiceChangerClientRef.current.start();\n case 4:\n case \"end\":\n return _context5.stop();\n }\n }, _callee4);\n }));\n }, [clientSetting.setting.mmvcServerUrl]);\n // (2) stop\n var stop = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/(0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee5() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee5$(_context6) {\n while (1) switch (_context6.prev = _context6.next) {\n case 0:\n _context6.next = 2;\n return initializedPromise;\n case 2:\n voiceChangerClientRef.current.stop();\n case 3:\n case \"end\":\n return _context6.stop();\n }\n }, _callee5);\n }));\n }, []);\n\n // (3) get info\n var getInfo = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {\n return /*#__PURE__*/(0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().mark(function _callee6() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default().wrap(function _callee6$(_context7) {\n while (1) switch (_context7.prev = _context7.next) {\n case 0:\n _context7.next = 2;\n return initializedPromise;\n case 2:\n _context7.next = 4;\n return clientSetting.reloadClientSetting();\n case 4:\n _context7.next = 6;\n return serverSetting.reloadServerInfo();\n case 6:\n case \"end\":\n return _context7.stop();\n }\n }, _callee6);\n }));\n }, []);\n return {\n clientInitialized: clientInitialized,\n bufferingTime: bufferingTime,\n responseTime: responseTime,\n volume: volume,\n uploadProgress: uploadProgress,\n isUploading: isUploading,\n settingState: displaySettingState,\n serverInfo: serverInfo,\n setSettingState: setSettingState,\n loadModel: loadModel,\n start: start,\n stop: stop,\n getInfo: getInfo,\n clientSetting: clientSetting,\n workletSetting: workletSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/hooks/useClient.ts?"); - -/***/ }), - -/***/ "./src/hooks/useClientSetting.ts": -/*!***************************************!*\ - !*** ./src/hooks/useClientSetting.ts ***! - \***************************************/ -/***/ ((__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 */ \"useClientSetting\": () => (/* binding */ useClientSetting)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ \"./node_modules/@babel/runtime/helpers/esm/defineProperty.js\");\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_5__);\n\n\n\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_1__[\"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\nvar useClientSetting = function useClientSetting(props) {\n var settingRef = (0,react__WEBPACK_IMPORTED_MODULE_5__.useRef)(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.DefaultVoiceChangerClientSetting);\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_5__.useState)(settingRef.current),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(_useState, 2),\n setting = _useState2[0],\n _setSetting = _useState2[1];\n var setServerUrl = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return function (url) {\n if (!props.voiceChangerClient) return;\n props.voiceChangerClient.setServerUrl(url);\n settingRef.current.mmvcServerUrl = url;\n _setSetting(_objectSpread({}, settingRef.current));\n };\n }, [props.voiceChangerClient]);\n var setProtocol = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return function (proto) {\n if (!props.voiceChangerClient) return;\n props.voiceChangerClient.setProtocol(proto);\n settingRef.current.protocol = proto;\n _setSetting(_objectSpread({}, settingRef.current));\n };\n }, [props.voiceChangerClient]);\n var _setInput = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee() {\n var ms;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context.next = 2;\n break;\n }\n return _context.abrupt(\"return\");\n case 2:\n if (!(!settingRef.current.audioInput || settingRef.current.audioInput == \"none\")) {\n _context.next = 9;\n break;\n }\n console.log(\"[useClient] setup!(1)\", settingRef.current.audioInput);\n ms = (0,_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.createDummyMediaStream)(props.audioContext);\n _context.next = 7;\n return props.voiceChangerClient.setup(ms, settingRef.current.bufferSize, settingRef.current.forceVfDisable);\n case 7:\n _context.next = 12;\n break;\n case 9:\n console.log(\"[useClient] setup!(2)\", settingRef.current.audioInput);\n _context.next = 12;\n return props.voiceChangerClient.setup(settingRef.current.audioInput, settingRef.current.bufferSize, settingRef.current.forceVfDisable);\n case 12:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function _setInput() {\n return _ref.apply(this, arguments);\n };\n }();\n var setAudioInput = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref2 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee2(audioInput) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee2$(_context2) {\n while (1) switch (_context2.prev = _context2.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context2.next = 2;\n break;\n }\n return _context2.abrupt(\"return\");\n case 2:\n settingRef.current.audioInput = audioInput;\n _context2.next = 5;\n return _setInput();\n case 5:\n _setSetting(_objectSpread({}, settingRef.current));\n case 6:\n case \"end\":\n return _context2.stop();\n }\n }, _callee2);\n }));\n return function (_x) {\n return _ref2.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setBufferSize = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref3 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee3(bufferSize) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee3$(_context3) {\n while (1) switch (_context3.prev = _context3.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context3.next = 2;\n break;\n }\n return _context3.abrupt(\"return\");\n case 2:\n settingRef.current.bufferSize = bufferSize;\n _context3.next = 5;\n return _setInput();\n case 5:\n _setSetting(_objectSpread({}, settingRef.current));\n case 6:\n case \"end\":\n return _context3.stop();\n }\n }, _callee3);\n }));\n return function (_x2) {\n return _ref3.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setVfForceDisabled = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref4 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee4(vfForceDisabled) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee4$(_context4) {\n while (1) switch (_context4.prev = _context4.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context4.next = 2;\n break;\n }\n return _context4.abrupt(\"return\");\n case 2:\n settingRef.current.forceVfDisable = vfForceDisabled;\n _context4.next = 5;\n return _setInput();\n case 5:\n _setSetting(_objectSpread({}, settingRef.current));\n case 6:\n case \"end\":\n return _context4.stop();\n }\n }, _callee4);\n }));\n return function (_x3) {\n return _ref4.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setInputChunkNum = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return function (num) {\n if (!props.voiceChangerClient) return;\n props.voiceChangerClient.setInputChunkNum(num);\n settingRef.current.inputChunkNum = num;\n _setSetting(_objectSpread({}, settingRef.current));\n };\n }, [props.voiceChangerClient]);\n var setVoiceChangerMode = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return function (mode) {\n if (!props.voiceChangerClient) return;\n props.voiceChangerClient.setVoiceChangerMode(mode);\n settingRef.current.voiceChangerMode = mode;\n _setSetting(_objectSpread({}, settingRef.current));\n };\n }, [props.voiceChangerClient]);\n var setSampleRate = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return function (num) {\n if (!props.voiceChangerClient) return;\n //props.voiceChangerClient.setSampleRate(num) // Not Implemented\n settingRef.current.sampleRate = num;\n _setSetting(_objectSpread({}, settingRef.current));\n };\n }, [props.voiceChangerClient]);\n var setSpeakers = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return function (speakers) {\n if (!props.voiceChangerClient) return;\n settingRef.current.speakers = speakers;\n _setSetting(_objectSpread({}, settingRef.current));\n };\n }, [props.voiceChangerClient]);\n var reloadClientSetting = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/(0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_0__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee5() {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee5$(_context5) {\n while (1) switch (_context5.prev = _context5.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context5.next = 2;\n break;\n }\n return _context5.abrupt(\"return\");\n case 2:\n _context5.next = 4;\n return props.voiceChangerClient.getClientSettings();\n case 4:\n case \"end\":\n return _context5.stop();\n }\n }, _callee5);\n }));\n }, [props.voiceChangerClient]);\n\n // Colab対応\n (0,react__WEBPACK_IMPORTED_MODULE_5__.useEffect)(function () {\n var params = new URLSearchParams(location.search);\n var colab = params.get(\"colab\");\n if (colab == \"true\") {\n settingRef.current.protocol = \"rest\";\n settingRef.current.inputChunkNum = 64;\n _setSetting(_objectSpread({}, settingRef.current));\n }\n }, []);\n return {\n setting: setting,\n setServerUrl: setServerUrl,\n setProtocol: setProtocol,\n setAudioInput: setAudioInput,\n setBufferSize: setBufferSize,\n setVfForceDisabled: setVfForceDisabled,\n setInputChunkNum: setInputChunkNum,\n setVoiceChangerMode: setVoiceChangerMode,\n setSampleRate: setSampleRate,\n setSpeakers: setSpeakers,\n reloadClientSetting: reloadClientSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/hooks/useClientSetting.ts?"); - -/***/ }), - -/***/ "./src/hooks/useServerSetting.ts": -/*!***************************************!*\ - !*** ./src/hooks/useServerSetting.ts ***! - \***************************************/ -/***/ ((__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 */ \"useServerSetting\": () => (/* binding */ useServerSetting)\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 _babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ \"./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js\");\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/regenerator */ \"./node_modules/@babel/runtime/regenerator/index.js\");\n/* harmony import */ var _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_5__);\n\n\n\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\nvar useServerSetting = function useServerSetting(props) {\n var settingRef = (0,react__WEBPACK_IMPORTED_MODULE_5__.useRef)(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.DefaultVoiceChangerServerSetting);\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_5__.useState)(settingRef.current),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(_useState, 2),\n setting = _useState2[0],\n _setSetting = _useState2[1];\n var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_5__.useState)(),\n _useState4 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(_useState3, 2),\n serverInfo = _useState4[0],\n _setServerInfo = _useState4[1];\n var _set_and_store = /*#__PURE__*/function () {\n var _ref = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee(key, newVal) {\n var res;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context.next = 2;\n break;\n }\n return _context.abrupt(\"return\", false);\n case 2:\n _context.next = 4;\n return props.voiceChangerClient.updateServerSettings(key, \"\" + newVal);\n case 4:\n res = _context.sent;\n _setServerInfo(res);\n if (!(newVal == res[key])) {\n _context.next = 11;\n break;\n }\n _setSetting(_objectSpread(_objectSpread({}, settingRef.current), {}, {\n convertChunkNum: res.convertChunkNum,\n srcId: res.srcId,\n dstId: res.dstId,\n gpu: res.gpu,\n crossFadeOffsetRate: res.crossFadeOffsetRate,\n crossFadeEndRate: res.crossFadeEndRate,\n crossFadeOverlapRate: res.crossFadeOverlapRate,\n framework: res.framework,\n onnxExecutionProvider: !!res.onnxExecutionProvider && res.onnxExecutionProvider.length > 0 ? res.onnxExecutionProvider[0] : _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.DefaultVoiceChangerServerSetting.onnxExecutionProvider\n }));\n return _context.abrupt(\"return\", true);\n case 11:\n alert(\"[ServerSetting] setting failed. [key:\".concat(key, \", new:\").concat(newVal, \", res:\").concat(res[key], \"]\"));\n return _context.abrupt(\"return\", false);\n case 13:\n case \"end\":\n return _context.stop();\n }\n }, _callee);\n }));\n return function _set_and_store(_x, _x2) {\n return _ref.apply(this, arguments);\n };\n }();\n var setFramework = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref2 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee2(framework) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee2$(_context2) {\n while (1) switch (_context2.prev = _context2.next) {\n case 0:\n _context2.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.framework, \"\" + framework);\n case 2:\n return _context2.abrupt(\"return\", _context2.sent);\n case 3:\n case \"end\":\n return _context2.stop();\n }\n }, _callee2);\n }));\n return function (_x3) {\n return _ref2.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setOnnxExecutionProvider = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref3 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee3(provider) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee3$(_context3) {\n while (1) switch (_context3.prev = _context3.next) {\n case 0:\n _context3.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.onnxExecutionProvider, \"\" + provider);\n case 2:\n return _context3.abrupt(\"return\", _context3.sent);\n case 3:\n case \"end\":\n return _context3.stop();\n }\n }, _callee3);\n }));\n return function (_x4) {\n return _ref3.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setSrcId = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref4 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee4(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee4$(_context4) {\n while (1) switch (_context4.prev = _context4.next) {\n case 0:\n _context4.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.srcId, \"\" + num);\n case 2:\n return _context4.abrupt(\"return\", _context4.sent);\n case 3:\n case \"end\":\n return _context4.stop();\n }\n }, _callee4);\n }));\n return function (_x5) {\n return _ref4.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setDstId = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref5 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee5(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee5$(_context5) {\n while (1) switch (_context5.prev = _context5.next) {\n case 0:\n _context5.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.dstId, \"\" + num);\n case 2:\n return _context5.abrupt(\"return\", _context5.sent);\n case 3:\n case \"end\":\n return _context5.stop();\n }\n }, _callee5);\n }));\n return function (_x6) {\n return _ref5.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setConvertChunkNum = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref6 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee6(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee6$(_context6) {\n while (1) switch (_context6.prev = _context6.next) {\n case 0:\n _context6.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.convertChunkNum, \"\" + num);\n case 2:\n return _context6.abrupt(\"return\", _context6.sent);\n case 3:\n case \"end\":\n return _context6.stop();\n }\n }, _callee6);\n }));\n return function (_x7) {\n return _ref6.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setGpu = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref7 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee7(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee7$(_context7) {\n while (1) switch (_context7.prev = _context7.next) {\n case 0:\n _context7.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.gpu, \"\" + num);\n case 2:\n return _context7.abrupt(\"return\", _context7.sent);\n case 3:\n case \"end\":\n return _context7.stop();\n }\n }, _callee7);\n }));\n return function (_x8) {\n return _ref7.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setCrossFadeOffsetRate = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref8 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee8(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee8$(_context8) {\n while (1) switch (_context8.prev = _context8.next) {\n case 0:\n _context8.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.crossFadeOffsetRate, \"\" + num);\n case 2:\n return _context8.abrupt(\"return\", _context8.sent);\n case 3:\n case \"end\":\n return _context8.stop();\n }\n }, _callee8);\n }));\n return function (_x9) {\n return _ref8.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setCrossFadeEndRate = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref9 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee9(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee9$(_context9) {\n while (1) switch (_context9.prev = _context9.next) {\n case 0:\n _context9.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.crossFadeEndRate, \"\" + num);\n case 2:\n return _context9.abrupt(\"return\", _context9.sent);\n case 3:\n case \"end\":\n return _context9.stop();\n }\n }, _callee9);\n }));\n return function (_x10) {\n return _ref9.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var setCrossFadeOverlapRate = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/function () {\n var _ref10 = (0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee10(num) {\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee10$(_context10) {\n while (1) switch (_context10.prev = _context10.next) {\n case 0:\n _context10.next = 2;\n return _set_and_store(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.ServerSettingKey.crossFadeOverlapRate, \"\" + num);\n case 2:\n return _context10.abrupt(\"return\", _context10.sent);\n case 3:\n case \"end\":\n return _context10.stop();\n }\n }, _callee10);\n }));\n return function (_x11) {\n return _ref10.apply(this, arguments);\n };\n }();\n }, [props.voiceChangerClient]);\n var reloadServerInfo = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(function () {\n return /*#__PURE__*/(0,_babel_runtime_helpers_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__[\"default\"])( /*#__PURE__*/_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().mark(function _callee11() {\n var res;\n return _babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_3___default().wrap(function _callee11$(_context11) {\n while (1) switch (_context11.prev = _context11.next) {\n case 0:\n if (props.voiceChangerClient) {\n _context11.next = 2;\n break;\n }\n return _context11.abrupt(\"return\");\n case 2:\n _context11.next = 4;\n return props.voiceChangerClient.getServerSettings();\n case 4:\n res = _context11.sent;\n _setServerInfo(res);\n _setSetting(_objectSpread(_objectSpread({}, settingRef.current), {}, {\n convertChunkNum: res.convertChunkNum,\n srcId: res.srcId,\n dstId: res.dstId,\n gpu: res.gpu,\n crossFadeOffsetRate: res.crossFadeOffsetRate,\n crossFadeEndRate: res.crossFadeEndRate,\n crossFadeOverlapRate: res.crossFadeOverlapRate,\n framework: res.framework,\n onnxExecutionProvider: !!res.onnxExecutionProvider && res.onnxExecutionProvider.length > 0 ? res.onnxExecutionProvider[0] : _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_4__.DefaultVoiceChangerServerSetting.onnxExecutionProvider\n }));\n case 7:\n case \"end\":\n return _context11.stop();\n }\n }, _callee11);\n }));\n }, [props.voiceChangerClient]);\n return {\n setting: setting,\n serverInfo: serverInfo,\n setFramework: setFramework,\n setOnnxExecutionProvider: setOnnxExecutionProvider,\n setSrcId: setSrcId,\n setDstId: setDstId,\n setConvertChunkNum: setConvertChunkNum,\n setGpu: setGpu,\n setCrossFadeOffsetRate: setCrossFadeOffsetRate,\n setCrossFadeEndRate: setCrossFadeEndRate,\n setCrossFadeOverlapRate: setCrossFadeOverlapRate,\n reloadServerInfo: reloadServerInfo\n };\n};\n\n//# sourceURL=webpack://demo/./src/hooks/useServerSetting.ts?"); - -/***/ }), - -/***/ "./src/hooks/useWorkletSetting.ts": -/*!****************************************!*\ - !*** ./src/hooks/useWorkletSetting.ts ***! - \****************************************/ -/***/ ((__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 */ \"useWorkletSetting\": () => (/* binding */ useWorkletSetting)\n/* harmony export */ });\n/* harmony import */ var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ \"./node_modules/@babel/runtime/helpers/esm/slicedToArray.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dannadori/voice-changer-client-js */ \"../lib/dist/index.js\");\n/* harmony import */ var _dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);\n\n\n\nvar useWorkletSetting = function useWorkletSetting(props) {\n var _useState = (0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(_dannadori_voice_changer_client_js__WEBPACK_IMPORTED_MODULE_1__.DefaultWorkletSetting),\n _useState2 = (0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(_useState, 2),\n setting = _useState2[0],\n _setSetting = _useState2[1];\n var setSetting = (0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)(function () {\n return function (setting) {\n if (!props.voiceChangerClient) return;\n props.voiceChangerClient.configureWorklet(setting);\n _setSetting(setting);\n };\n }, [props.voiceChangerClient]);\n return {\n setting: setting,\n setSetting: setSetting\n };\n};\n\n//# sourceURL=webpack://demo/./src/hooks/useWorkletSetting.ts?"); - -/***/ }), - -/***/ "./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./src/css/App.css": -/*!*************************************************************************************************************************************!*\ - !*** ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./src/css/App.css ***! - \*************************************************************************************************************************************/ -/***/ ((module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n___CSS_LOADER_EXPORT___.push([module.id, \"@import url(https://fonts.googleapis.com/css2?family=Chicle&family=Poppins:ital,wght@0,200;0,400;0,600;1,200;1,400;1,600&display=swap);\"]);\n___CSS_LOADER_EXPORT___.push([module.id, \"@import url(https://fonts.googleapis.com/css2?family=Yusei+Magic&display=swap);\"]);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \":root {\\n --text-color: #333;\\n --company-color1: rgba(64, 119, 187, 1);\\n --company-color2: rgba(29, 47, 78, 1);\\n --company-color3: rgba(255, 255, 255, 1);\\n --company-color1-alpha: rgba(64, 119, 187, 0.3);\\n --company-color2-alpha: rgba(29, 47, 78, 0.3);\\n --company-color3-alpha: rgba(255, 255, 255, 0.3);\\n --global-shadow-color: rgba(0, 0, 0, 0.4);\\n\\n --sidebar-transition-time: 0.3s;\\n --sidebar-transition-time-quick: 0.1s;\\n --sidebar-transition-animation: ease-in-out;\\n\\n --header-height: 1.5rem;\\n --right-sidebar-width: 320px;\\n\\n --dialog-border-color: rgba(100, 100, 100, 1);\\n --dialog-shadow-color: rgba(0, 0, 0, 0.3);\\n --dialog-background-color: rgba(255, 255, 255, 1);\\n --dialog-primary-color: rgba(19, 70, 209, 1);\\n --dialog-active-color: rgba(40, 70, 209, 1);\\n --dialog-input-border-color: rgba(200, 200, 200, 1);\\n --dialog-submit-button-color: rgba(180, 190, 230, 1);\\n --dialog-cancel-button-color: rgba(235, 80, 80, 1);\\n\\n --body-video-seeker-height: 3rem;\\n}\\n\\n* {\\n margin: 0;\\n padding: 0;\\n box-sizing: border-box;\\n font-family: \\\"Poppins\\\", sans-serif;\\n}\\nhtml {\\n font-size: 16px;\\n}\\nbody {\\n height: 100%;\\n width: 100%;\\n color: var(--text-color);\\n /* background: linear-gradient(45deg, var(--company-color1) 0, 5%, var(--company-color2) 5% 10%, var(--company-color3) 10% 80%, var(--company-color1) 80% 85%, var(--company-color2) 85% 100%); */\\n background: linear-gradient(45deg, var(--company-color1) 0, 1%, var(--company-color2) 1% 5%, var(--company-color3) 5% 80%, var(--company-color1) 80% 85%, var(--company-color2) 85% 100%);\\n}\\n#app {\\n height: 100%;\\n width: 100%;\\n}\\n\\n.body {\\n height: 100%;\\n width: 100%;\\n margin: 1rem;\\n font-family: \\\"Yusei Magic\\\", sans-serif;\\n display: flex;\\n flex-direction: column;\\n font-size: 1rem;\\n overflow-y: scroll;\\n}\\n.body-row {\\n}\\n.split-4-6 {\\n display: flex;\\n width: 100%;\\n justify-content: center;\\n margin: 1px 0px 1px 0px;\\n}\\n.split-4-6 > div:nth-child(1) {\\n left: 0px;\\n width: 40%;\\n }\\n.split-4-6 > div:nth-child(2) {\\n left: 40%;\\n width: 60%;\\n }\\n.split-3-7 {\\n display: flex;\\n width: 100%;\\n justify-content: center;\\n margin: 1px 0px 1px 0px;\\n}\\n.split-3-7 > div:nth-child(1) {\\n left: 0px;\\n width: 30%;\\n }\\n.split-3-7 > div:nth-child(2) {\\n left: 30%;\\n width: 70%;\\n }\\n\\n.split-3-3-4 {\\n display: flex;\\n width: 100%;\\n justify-content: center;\\n margin: 1px 0px 1px 0px;\\n}\\n\\n.split-3-3-4 > div:nth-child(1) {\\n left: 0px;\\n width: 30%;\\n }\\n\\n.split-3-3-4 > div:nth-child(2) {\\n left: 30%;\\n width: 30%;\\n }\\n\\n.split-3-3-4 > div:nth-child(3) {\\n left: 60%;\\n width: 40%;\\n }\\n.split-3-1-2-4 {\\n display: flex;\\n width: 100%;\\n justify-content: center;\\n margin: 1px 0px 1px 0px;\\n}\\n.split-3-1-2-4 > div:nth-child(1) {\\n left: 0px;\\n width: 30%;\\n }\\n.split-3-1-2-4 > div:nth-child(2) {\\n left: 30%;\\n width: 10%;\\n }\\n.split-3-1-2-4 > div:nth-child(3) {\\n left: 40%;\\n width: 20%;\\n }\\n.split-3-1-2-4 > div:nth-child(4) {\\n left: 60%;\\n width: 40%;\\n }\\n.split-3-2-2-2-1{\\n display: flex;\\n width: 100%;\\n justify-content: center;\\n margin: 1px 0px 1px 0px;\\n}\\n.split-3-2-2-2-1 > div:nth-child(1) {\\n left: 0px;\\n width: 30%;\\n }\\n.split-3-2-2-2-1 > div:nth-child(2) {\\n left: 30%;\\n width: 20%;\\n }\\n.split-3-2-2-2-1 > div:nth-child(3) {\\n left: 50%;\\n width: 20%;\\n }\\n.split-3-2-2-2-1 > div:nth-child(4) {\\n left: 70%;\\n width: 20%;\\n }\\n.split-3-2-2-2-1 > div:nth-child(5) {\\n left: 90%;\\n width: 10%;\\n }\\n.split-3-1-1-1-4{\\n display: flex;\\n width: 100%;\\n justify-content: center;\\n margin: 1px 0px 1px 0px;\\n\\n}\\n.split-3-1-1-1-4 > div:nth-child(1) {\\n left: 0px;\\n width: 30%;\\n }\\n.split-3-1-1-1-4 > div:nth-child(2) {\\n left: 30%;\\n width: 10%;\\n }\\n.split-3-1-1-1-4 > div:nth-child(3) {\\n left: 40%;\\n width: 10%;\\n }\\n.split-3-1-1-1-4 > div:nth-child(4) {\\n left: 50%;\\n width: 10%;\\n }\\n.split-3-1-1-1-4 > div:nth-child(5) {\\n left: 60%;\\n width: 40%;\\n }\\n.underline {\\n border-bottom: 3px solid #333;\\n}\\n.left-padding-1 {\\n padding-left: 1rem;\\n}\\n.left-padding-2 {\\n padding-left: 2rem;\\n}\\n.left-margin-1 {\\n margin-left: 1rem;\\n}\\n.left-margin-2 {\\n margin-left: 2rem;\\n}\\n.highlight {\\n background-color: rgba(200, 200, 255, 0.3);\\n}\\n.guided{\\n /* background-color: rgba(9, 133, 67, 0.3); */\\n background-color: rgba(159, 165, 162, 0.1);\\n /* border-bottom: 1px solid rgba(9, 133, 67, 0.3); */\\n}\\n\\n.body-top-title {\\n font-size: 3rem;\\n}\\n.body-section-title {\\n font-size: 1.5rem;\\n color: rgb(51, 49, 49);\\n}\\n.body-sub-section-title {\\n font-size: 1.1rem;\\n font-weight: 700;\\n color: rgb(3, 53, 12);\\n}\\n\\n.body-item-title {\\n color: rgb(51, 99, 49);\\n}\\n.body-item-text {\\n color: rgb(30, 30, 30);\\n}\\n.body-item-text .body-item-text-item{\\n padding-left: 1rem;\\n }\\n\\n.body-item-input {\\n width:90%;\\n}\\n\\n.body-button-container {\\n display: flex;\\n flex-direction: row;\\n align-items: center;\\n}\\n\\n.body-button-container .body-button {\\n -webkit-user-select: none;\\n -moz-user-select: none;\\n user-select: none;\\n border: solid 1px #333;\\n border-radius: 2px;\\n padding: 2px;\\n cursor:pointer;\\n vertical-align:middle;\\n }\\n\\n.body-button-container .body-button-active {\\n -webkit-user-select: none;\\n -moz-user-select: none;\\n user-select: none;\\n border: solid 1px #333;\\n border-radius: 2px;\\n padding: 2px;\\n background:#ada;\\n }\\n\\n.body-button-container .body-button-stanby {\\n -webkit-user-select: none;\\n -moz-user-select: none;\\n user-select: none;\\n border: solid 1px #333;\\n border-radius: 2px;\\n padding: 2px;\\n background:#aba;\\n cursor:pointer;\\n }\\n.body-select-container .body-select {\\n color: rgb(30, 30, 30);\\n }\\n\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://demo/./src/css/App.css?./node_modules/css-loader/dist/cjs.js??ruleSet%5B1%5D.rules%5B2%5D.use%5B1%5D!./node_modules/postcss-loader/dist/cjs.js"); - -/***/ }), - -/***/ "./node_modules/css-loader/dist/runtime/api.js": -/*!*****************************************************!*\ - !*** ./node_modules/css-loader/dist/runtime/api.js ***! - \*****************************************************/ -/***/ ((module) => { - -"use strict"; -eval("\n\n/*\n MIT License http://www.opensource.org/licenses/mit-license.php\n Author Tobias Koppers @sokra\n*/\nmodule.exports = function (cssWithMappingToString) {\n var list = [];\n\n // return the list of modules as css string\n list.toString = function toString() {\n return this.map(function (item) {\n var content = \"\";\n var needLayer = typeof item[5] !== \"undefined\";\n if (item[4]) {\n content += \"@supports (\".concat(item[4], \") {\");\n }\n if (item[2]) {\n content += \"@media \".concat(item[2], \" {\");\n }\n if (needLayer) {\n content += \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\");\n }\n content += cssWithMappingToString(item);\n if (needLayer) {\n content += \"}\";\n }\n if (item[2]) {\n content += \"}\";\n }\n if (item[4]) {\n content += \"}\";\n }\n return content;\n }).join(\"\");\n };\n\n // import a list of modules into the list\n list.i = function i(modules, media, dedupe, supports, layer) {\n if (typeof modules === \"string\") {\n modules = [[null, modules, undefined]];\n }\n var alreadyImportedModules = {};\n if (dedupe) {\n for (var k = 0; k < this.length; k++) {\n var id = this[k][0];\n if (id != null) {\n alreadyImportedModules[id] = true;\n }\n }\n }\n for (var _k = 0; _k < modules.length; _k++) {\n var item = [].concat(modules[_k]);\n if (dedupe && alreadyImportedModules[item[0]]) {\n continue;\n }\n if (typeof layer !== \"undefined\") {\n if (typeof item[5] === \"undefined\") {\n item[5] = layer;\n } else {\n item[1] = \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\").concat(item[1], \"}\");\n item[5] = layer;\n }\n }\n if (media) {\n if (!item[2]) {\n item[2] = media;\n } else {\n item[1] = \"@media \".concat(item[2], \" {\").concat(item[1], \"}\");\n item[2] = media;\n }\n }\n if (supports) {\n if (!item[4]) {\n item[4] = \"\".concat(supports);\n } else {\n item[1] = \"@supports (\".concat(item[4], \") {\").concat(item[1], \"}\");\n item[4] = supports;\n }\n }\n list.push(item);\n }\n };\n return list;\n};\n\n//# sourceURL=webpack://demo/./node_modules/css-loader/dist/runtime/api.js?"); - -/***/ }), - -/***/ "./node_modules/css-loader/dist/runtime/noSourceMaps.js": -/*!**************************************************************!*\ - !*** ./node_modules/css-loader/dist/runtime/noSourceMaps.js ***! - \**************************************************************/ -/***/ ((module) => { - -"use strict"; -eval("\n\nmodule.exports = function (i) {\n return i[1];\n};\n\n//# sourceURL=webpack://demo/./node_modules/css-loader/dist/runtime/noSourceMaps.js?"); - -/***/ }), - -/***/ "./node_modules/react-dom/cjs/react-dom.development.js": -/*!*************************************************************!*\ - !*** ./node_modules/react-dom/cjs/react-dom.development.js ***! - \*************************************************************/ -/***/ ((__unused_webpack_module, exports, __webpack_require__) => { - -"use strict"; -eval("/**\n * @license React\n * react-dom.development.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\n\nif (true) {\n (function() {\n\n 'use strict';\n\n/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */\nif (\n typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&\n typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart ===\n 'function'\n) {\n __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());\n}\n var React = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\nvar Scheduler = __webpack_require__(/*! scheduler */ \"./node_modules/scheduler/index.js\");\n\nvar ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;\n\nvar suppressWarning = false;\nfunction setSuppressWarning(newSuppressWarning) {\n {\n suppressWarning = newSuppressWarning;\n }\n} // In DEV, calls to console.warn and console.error get replaced\n// by calls to these methods by a Babel plugin.\n//\n// In PROD (or in packages without access to React internals),\n// they are left as they are instead.\n\nfunction warn(format) {\n {\n if (!suppressWarning) {\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n printWarning('warn', format, args);\n }\n }\n}\nfunction error(format) {\n {\n if (!suppressWarning) {\n for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {\n args[_key2 - 1] = arguments[_key2];\n }\n\n printWarning('error', format, args);\n }\n }\n}\n\nfunction printWarning(level, format, args) {\n // When changing this logic, you might want to also\n // update consoleWithStackDev.www.js as well.\n {\n var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;\n var stack = ReactDebugCurrentFrame.getStackAddendum();\n\n if (stack !== '') {\n format += '%s';\n args = args.concat([stack]);\n } // eslint-disable-next-line react-internal/safe-string-coercion\n\n\n var argsWithFormat = args.map(function (item) {\n return String(item);\n }); // Careful: RN currently depends on this prefix\n\n argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it\n // breaks IE9: https://github.com/facebook/react/issues/13610\n // eslint-disable-next-line react-internal/no-production-logging\n\n Function.prototype.apply.call(console[level], console, argsWithFormat);\n }\n}\n\nvar FunctionComponent = 0;\nvar ClassComponent = 1;\nvar IndeterminateComponent = 2; // Before we know whether it is function or class\n\nvar HostRoot = 3; // Root of a host tree. Could be nested inside another node.\n\nvar HostPortal = 4; // A subtree. Could be an entry point to a different renderer.\n\nvar HostComponent = 5;\nvar HostText = 6;\nvar Fragment = 7;\nvar Mode = 8;\nvar ContextConsumer = 9;\nvar ContextProvider = 10;\nvar ForwardRef = 11;\nvar Profiler = 12;\nvar SuspenseComponent = 13;\nvar MemoComponent = 14;\nvar SimpleMemoComponent = 15;\nvar LazyComponent = 16;\nvar IncompleteClassComponent = 17;\nvar DehydratedFragment = 18;\nvar SuspenseListComponent = 19;\nvar ScopeComponent = 21;\nvar OffscreenComponent = 22;\nvar LegacyHiddenComponent = 23;\nvar CacheComponent = 24;\nvar TracingMarkerComponent = 25;\n\n// -----------------------------------------------------------------------------\n\nvar enableClientRenderFallbackOnTextMismatch = true; // TODO: Need to review this code one more time before landing\n// the react-reconciler package.\n\nvar enableNewReconciler = false; // Support legacy Primer support on internal FB www\n\nvar enableLazyContextPropagation = false; // FB-only usage. The new API has different semantics.\n\nvar enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber\n\nvar enableSuspenseAvoidThisFallback = false; // Enables unstable_avoidThisFallback feature in Fizz\n// React DOM Chopping Block\n//\n// Similar to main Chopping Block but only flags related to React DOM. These are\n// grouped because we will likely batch all of them into a single major release.\n// -----------------------------------------------------------------------------\n// Disable support for comment nodes as React DOM containers. Already disabled\n// in open source, but www codebase still relies on it. Need to remove.\n\nvar disableCommentsAsDOMContainers = true; // Disable javascript: URL strings in href for XSS protection.\n// and client rendering, mostly to allow JSX attributes to apply to the custom\n// element's object properties instead of only HTML attributes.\n// https://github.com/facebook/react/issues/11347\n\nvar enableCustomElementPropertySupport = false; // Disables children for