@zegocloud/zego-uikit-prebuilt 1.8.2 → 1.8.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/zego-uikit-prebuilt.js +2 -2
package/package.json
CHANGED
package/zego-uikit-prebuilt.js
CHANGED
|
@@ -2695,7 +2695,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
2695
2695
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
2696
2696
|
|
|
2697
2697
|
"use strict";
|
|
2698
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ZegoRoom\": function() { return /* binding */ ZegoRoom; }\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/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 _model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../model */ \"./src/sdk/model/index.ts\");\n/* harmony import */ var _index_module_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./index.module.scss */ \"./src/sdk/view/pages/ZegoRoom/index.module.scss\");\n/* harmony import */ var _components_zegoTimer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/zegoTimer */ \"./src/sdk/view/pages/ZegoRoom/components/zegoTimer.tsx\");\n/* harmony import */ var _components_zegoOne2One__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/zegoOne2One */ \"./src/sdk/view/pages/ZegoRoom/components/zegoOne2One.tsx\");\n/* harmony import */ var _components_zegoMessage__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./components/zegoMessage */ \"./src/sdk/view/pages/ZegoRoom/components/zegoMessage.tsx\");\n/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../util */ \"./src/sdk/util.ts\");\n/* harmony import */ var _components_zegoSetting__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../components/zegoSetting */ \"./src/sdk/view/components/zegoSetting/index.tsx\");\n/* harmony import */ var _components_zegoModel__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../components/zegoModel */ \"./src/sdk/view/components/zegoModel/index.tsx\");\n/* harmony import */ var _components_zegoToast__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/zegoToast */ \"./src/sdk/view/components/zegoToast/index.tsx\");\n/* harmony import */ var _components_zegoGridLayout__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./components/zegoGridLayout */ \"./src/sdk/view/pages/ZegoRoom/components/zegoGridLayout.tsx\");\n/* harmony import */ var _components_zegoSidebarLayout__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/zegoSidebarLayout */ \"./src/sdk/view/pages/ZegoRoom/components/zegoSidebarLayout.tsx\");\n/* harmony import */ var _components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/zegoRoomInvite */ \"./src/sdk/view/pages/ZegoRoom/components/zegoRoomInvite.tsx\");\n/* harmony import */ var _components_zegoUserList__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/zegoUserList */ \"./src/sdk/view/pages/ZegoRoom/components/zegoUserList.tsx\");\n/* harmony import */ var _components_ZegoScreenSharingLayout__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./components/ZegoScreenSharingLayout */ \"./src/sdk/view/pages/ZegoRoom/components/ZegoScreenSharingLayout.tsx\");\n/* harmony import */ var _components_ZegoWhiteboardSharingLayout__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./components/ZegoWhiteboardSharingLayout */ \"./src/sdk/view/pages/ZegoRoom/components/ZegoWhiteboardSharingLayout.tsx\");\n/* harmony import */ var _context_showManage__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../context/showManage */ \"./src/sdk/view/pages/context/showManage.ts\");\n/* harmony import */ var _components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/zegoMedia/audio */ \"./src/sdk/view/components/zegoMedia/audio.tsx\");\n/* harmony import */ var _components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./components/zegoMixPlayer */ \"./src/sdk/view/pages/ZegoRoom/components/zegoMixPlayer.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nclass ZegoRoom extends (react__WEBPACK_IMPORTED_MODULE_1___default().PureComponent) {\n constructor() {\n super(...arguments);\n this.state = {\n localStream: undefined,\n layOutStatus: this.initLayout(),\n zegoCloudUserList: [],\n messageList: [],\n notificationList: [],\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n showSettings: false,\n isNetworkPoor: false,\n connecting: false,\n firstLoading: true,\n selectMic: this.props.core.status.micDeviceID,\n selectSpeaker: this.props.core.status.speakerDeviceID,\n selectCamera: this.props.core.status.cameraDeviceID,\n selectVideoResolution: this.props.core.status.videoResolution ||\n this.props.core._config.videoResolutionList[0],\n videoShowNumber: 9,\n gridRowNumber: 3,\n layout: this.props.core._config.layout || \"Auto\",\n showLayoutSettingsModel: false,\n isLayoutChanging: false,\n soundLevel: {},\n showNonVideoUser: this.props.core._config.showNonVideoUser,\n liveCountdown: -1,\n liveStatus: \"0\",\n isScreenSharingBySelf: false,\n screenSharingStream: undefined,\n zegoSuperBoardView: null,\n screenSharingUserList: [],\n showZegoSettings: false,\n haveUnReadMsg: false,\n isZegoWhiteboardSharing: false,\n isRequestingCohost: false,\n unreadInviteList: new Set(),\n isMixing: \"0\",\n };\n this.settingsRef = react__WEBPACK_IMPORTED_MODULE_1___default().createRef();\n this.moreRef = react__WEBPACK_IMPORTED_MODULE_1___default().createRef();\n this.micStatus = !!this.props.core._config.turnOnMicrophoneWhenJoining\n ? 1\n : 0;\n this.cameraStatus = !!this.props.core._config.turnOnCameraWhenJoining\n ? 1\n : 0;\n this.msgDelayed = true; // 5s不显示\n this.localUserPin = false;\n this.localStreamID = \"\";\n this.screenSharingStreamID = \"\";\n this.isCreatingScreenSharing = false;\n this.isCreatingWhiteboardSharing = false;\n this.fullScreen = false;\n this.showNotSupported = 0;\n this.notSupportMultipleVideoNotice = 0;\n this.inviteModelRoot = null;\n this.userUpdateCallBack = () => { };\n this.onOpenSettings = (event) => {\n var _a, _b;\n if (this.settingsRef.current === event.target ||\n ((_a = this.settingsRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target)) ||\n this.moreRef.current === event.target ||\n ((_b = this.moreRef.current) === null || _b === void 0 ? void 0 : _b.contains(event.target))) {\n }\n else {\n this.setState({\n showSettings: false,\n });\n }\n };\n this.onWindowResize = (0,_util__WEBPACK_IMPORTED_MODULE_7__.throttle)(this.computeByResize.bind(this), 500);\n this.menuOptions = {\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.ChangePin]: (user) => {\n if (user.userID === this.props.core._expressConfig.userID) {\n this.localUserPin = !this.localUserPin;\n this.props.core.setPin();\n }\n else {\n this.localUserPin = false;\n this.props.core.setPin(user.userID);\n }\n this.props.core.setSidebarLayOut(this.getScreenSharingUser.length > 0\n ? false\n : this.localUserPin === false);\n this.setState({ layout: \"Sidebar\" });\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteMic]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n if (((_b = (_a = user.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.micStatus) === \"MUTE\")\n return;\n let res;\n try {\n if (user.userID === this.props.core._expressConfig.userID) {\n res = yield this.toggleMic();\n }\n else {\n res = yield this.props.core.turnRemoteMicrophoneOff(user.userID);\n }\n if (res) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"Turned off the microphone successfully.\",\n });\n }\n }\n catch (error) { }\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteCamera]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _c, _d;\n if (((_d = (_c = user.streamList) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.cameraStatus) === \"MUTE\")\n return;\n let res;\n try {\n if (user.userID === this.props.core._expressConfig.userID) {\n res = yield this.toggleCamera();\n }\n else {\n res = yield this.props.core.turnRemoteCameraOff(user.userID);\n }\n if (res) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"Turned off the camera successfully.\",\n });\n }\n }\n catch (error) { }\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveUser]: (user) => {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Remove participant\",\n contentText: \"Are you sure to remove \" + user.userName + \" ?\",\n okText: \"Confirm\",\n cancelText: \"Cancel\",\n onOk: () => {\n this.props.core.removeMember(user.userID);\n },\n }, document.querySelector(\".zego_model_parent\"));\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.InviteCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _e;\n const res = yield ((_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.inviteJoinToCohost(user.userID, user.userName || \"\"));\n console.warn(\"InviteCohost\", res);\n let text = \"\";\n if ((res === null || res === void 0 ? void 0 : res.code) === 2) {\n text = \"Invitation has been sent.\";\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n text = \"Sent the invitation successfully.\";\n }\n else {\n text = \"Failed to send the invitation, please try again.\";\n }\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: text,\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n const isSelf = user.userID === this.props.core._expressConfig.userID;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"End the connection\",\n contentText: isSelf\n ? `Are you sure to end the connection with the host?`\n : \"Are you sure to end the connection with \" + user.userName + \" ?\",\n okText: \"Yes\",\n cancelText: \"Cancel\",\n onOk: () => {\n var _a;\n if (isSelf) {\n this.cohostToBeAudience();\n }\n else {\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.removeCohost(user.userID);\n }\n },\n }, document.querySelector(\".zego_model_parent\"));\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.DisagreeRequestCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _f;\n const res = yield ((_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.hostRefuseRequest(user.userID));\n this.updateUserRequestCohostState(user.userID, false);\n this.state.unreadInviteList.delete(user.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"DisagreeRequestCohost\", res);\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.AgreeRequestCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _g;\n const res = yield ((_g = this.props.core._zimManager) === null || _g === void 0 ? void 0 : _g._inRoomInviteMg.hostAcceptRequest(user.userID));\n if ((res === null || res === void 0 ? void 0 : res.code) === 6000276) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The request for connecting has expired.\",\n });\n }\n this.updateUserRequestCohostState(user.userID, false);\n this.state.unreadInviteList.delete(user.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"AgreeRequestCohost\", res);\n }),\n };\n }\n get showHeader() {\n var _a, _b;\n return !!(((_a = this.props.core._config.branding) === null || _a === void 0 ? void 0 : _a.logoURL) ||\n this.props.core._config.showRoomTimer ||\n ((_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming);\n }\n get isCDNLive() {\n var _a, _b;\n return (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_b = this.props.core._config.scenario.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.props.core._config.scenario.config.liveStreamingMode ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveStreamingMode.LiveStreaming);\n }\n get showRequestCohost() {\n var _a, _b, _c;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.state.liveStatus === \"1\" &&\n ((_c = this.props.core._config) === null || _c === void 0 ? void 0 : _c.showRemoveCohostButton));\n }\n componentDidMount() {\n var _a, _b, _c;\n this.setAllSinkId(this.state.selectSpeaker || \"\");\n this.computeByResize();\n setTimeout(() => {\n this.msgDelayed = false;\n }, 5000);\n this.initInRoomInviteMgListener();\n this.initSDK();\n // 点击其他区域时, 隐藏更多弹窗)\n document.addEventListener(\"click\", this.onOpenSettings);\n window.addEventListener(\"resize\", this.onWindowResize.bind(this));\n ((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.toggleLayOut(\"MESSAGE\");\n // if(this.props.core._zimManager && )\n }\n componentDidUpdate(preProps, preState) {\n if ((preState.notificationList.length > 0 &&\n this.state.notificationList.length > 0 &&\n preState.notificationList[preState.notificationList.length - 1]\n .messageID !==\n this.state.notificationList[this.state.notificationList.length - 1]\n .messageID) ||\n (preState.notificationList.length === 0 &&\n this.state.notificationList.length > 0)) {\n this.notifyTimer && clearTimeout(this.notifyTimer);\n this.notifyTimer = setTimeout(() => {\n this.setState({\n notificationList: [],\n });\n }, 3000);\n }\n if (preState.layout !== this.state.layout ||\n preState.isScreenSharingBySelf !== this.state.isScreenSharingBySelf ||\n preState.isZegoWhiteboardSharing !== this.state.isZegoWhiteboardSharing) {\n this.computeByResize();\n }\n if (preState.videoShowNumber !== this.state.videoShowNumber) {\n if (preState.zegoCloudUserList === this.state.zegoCloudUserList) {\n this.userUpdateCallBack();\n }\n }\n }\n componentWillUnmount() {\n document.removeEventListener(\"click\", this.onOpenSettings);\n window.removeEventListener(\"resize\", this.onWindowResize.bind(this));\n this.state.isScreenSharingBySelf && this.closeScreenSharing();\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n }\n initSDK() {\n return __awaiter(this, void 0, void 0, function* () {\n this.props.core.onNetworkStatusQuality((roomID, level) => {\n this.setState({\n isNetworkPoor: level > 2,\n });\n });\n this.props.core.onNetworkStatus((roomID, type, status) => {\n if (status === \"DISCONNECTED\" && type === \"ROOM\") {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n this.leaveRoom();\n }\n else if (status === \"CONNECTING\" && type !== \"STREAM\") {\n this.setState({\n connecting: true,\n });\n }\n else {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n }\n if (type === \"STREAM\" && status === \"CONNECTED\") {\n // 推流成功，开始混流\n }\n });\n this.props.core.onRemoteUserUpdate((roomID, updateType, userList, allUsers) => {\n var _a;\n let notificationList = [];\n if ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showUserJoinAndLeave) {\n userList.forEach((u) => {\n notificationList.push({\n content: u.userName +\n \" \" +\n (updateType === \"ADD\" ? \"enter\" : \"quite\") +\n \" the room\",\n type: \"USER\",\n userName: u.userName,\n messageID: (0,_util__WEBPACK_IMPORTED_MODULE_7__.randomNumber)(5),\n });\n });\n }\n // 当房间只剩自己的时候，自动离开房间\n if (updateType === \"DELETE\") {\n if (this.props.core._config.autoLeaveRoomWhenOnlySelfInRoom &&\n allUsers.length === 0) {\n this.leaveRoom();\n return;\n }\n }\n this.setState((state) => {\n return {\n notificationList: [...state.notificationList, ...notificationList],\n };\n });\n this.computeByResize();\n });\n this.props.core.onRoomMessageUpdate((roomID, messageList) => {\n this.setState((state) => {\n var _a;\n let lowerLeftNotification = [];\n if (this.state.layOutStatus !== \"MESSAGE\" &&\n ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showTextChat)) {\n lowerLeftNotification = [\n ...state.notificationList,\n ...messageList.map((m) => {\n return {\n content: m.message,\n type: \"MSG\",\n userName: m.fromUser.userName,\n messageID: m.messageID,\n };\n }),\n ];\n }\n return {\n messageList: [...state.messageList, ...messageList],\n notificationList: lowerLeftNotification,\n haveUnReadMsg: this.state.layOutStatus !== \"MESSAGE\",\n };\n });\n });\n this.props.core.subscribeUserList((userList) => {\n this.userUpdateCallBack();\n if (this.isCDNLive) {\n // CDN拉流最大限制6条，超过限制就不拉了\n let userListCopy = JSON.parse(JSON.stringify(userList));\n const userNum = userListCopy.filter((user) => user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")).length;\n let limitNum = this.state.screenSharingUserList.length > 0 ? 5 : 6;\n if ((0,_util__WEBPACK_IMPORTED_MODULE_7__.isSafari)()) {\n limitNum = 1;\n }\n if (userNum > limitNum) {\n let i = 0;\n let targetUsers = userListCopy\n .reverse()\n .map((user) => {\n if (user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")) {\n if (i >= limitNum) {\n user.streamList = [];\n }\n else {\n i++;\n }\n }\n return user;\n });\n this.setState({\n zegoCloudUserList: targetUsers.reverse(),\n });\n if ((0,_util__WEBPACK_IMPORTED_MODULE_7__.isSafari)() && this.notSupportMultipleVideoNotice === 0) {\n this.notSupportMultipleVideoNotice = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Your current browser does not support the display of multiple video screens during the live streaming.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n return;\n }\n }\n this.setState({\n zegoCloudUserList: userList,\n });\n });\n this.props.core.onRoomLiveStateUpdate((res) => {\n this.setState((preState) => {\n return {\n liveStatus: res,\n liveCountdown: preState.liveCountdown === -1 || preState.liveCountdown === 0\n ? res === \"1\"\n ? 0\n : -1\n : preState.liveCountdown,\n };\n });\n });\n this.props.core.onRoomMixingStateUpdate((isMixing) => {\n this.setState({\n isMixing,\n });\n });\n this.props.core.subscribeScreenStream((userList) => {\n if (this.isCDNLive &&\n (0,_util__WEBPACK_IMPORTED_MODULE_7__.isSafari)() &&\n this.state.zegoCloudUserList.filter((user) => user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")).length > 0) {\n this.setState({ screenSharingUserList: [] }, () => {\n this.computeByResize();\n });\n }\n else {\n this.setState({ screenSharingUserList: userList }, () => {\n this.computeByResize();\n });\n }\n });\n this.props.core.subscribeWhiteBoard((superBoardView) => {\n // 有变化才设置，否则不管，防止多个白板时被覆盖\n if ((!this.state.zegoSuperBoardView && superBoardView) ||\n (this.state.zegoSuperBoardView && !superBoardView)) {\n this.setState({\n zegoSuperBoardView: superBoardView,\n isZegoWhiteboardSharing: !!superBoardView,\n }, () => {\n this.computeByResize();\n });\n }\n });\n this.props.core.onSoundLevelUpdate((soundLevelList) => {\n let list = {};\n soundLevelList.forEach((s) => {\n let userId = s.streamID.split(\"_\")[1];\n if (list[userId]) {\n list[userId][s.streamID] = Math.floor(s.soundLevel);\n }\n else {\n list[userId] = {\n [s.streamID]: Math.floor(s.soundLevel),\n };\n }\n });\n this.setState({\n soundLevel: list,\n });\n });\n this.props.core.onScreenSharingEnded((stream) => {\n if (stream === this.state.screenSharingStream) {\n this.closeScreenSharing();\n }\n });\n this.props.core.onCoreError((code, msg) => {\n if (code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportStandardLive ||\n code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportCDNLive) {\n if (this.showNotSupported)\n return;\n this.showNotSupported = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"The service is not available, please contact the live streaming service provider to resolve.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n });\n // 监听呼叫邀请离开房间的通知\n this.props.core._zimManager &&\n this.props.core._zimManager.notifyLeaveRoom(() => {\n this.leaveRoom();\n });\n // 监听远端控制摄像头麦克风\n this.props.core.onChangeYourDeviceStatus((type, status, fromUser) => __awaiter(this, void 0, void 0, function* () {\n if (type === \"Camera\" && status === \"CLOSE\" && this.state.cameraOpen) {\n yield this.toggleCamera();\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n if (type === \"Microphone\" && status === \"CLOSE\" && this.state.micOpen) {\n yield this.toggleMic();\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n }));\n this.props.core.onKickedOutRoom(() => {\n this.leaveRoom(true);\n });\n const logInRsp = yield this.props.core.enterRoom();\n let massage = \"\";\n if (logInRsp === 0) {\n this.createStream();\n return;\n }\n else if (logInRsp === 1002034) {\n // 登录房间的用户数超过该房间配置的最大用户数量限制（测试环境下默认房间最大用户数为 50，正式环境无限制）。\n massage =\n \"Failed to join the room, the number of people in the room has reached the maximum.(2 people)\";\n }\n else if ([1002031, 1002053].includes(logInRsp)) {\n //登录房间超时，可能是由于网络原因导致。\n massage =\n \"There's something wrong with your network. Please check it and try again.\";\n }\n else if ([1102018, 1102016, 1102020].includes(logInRsp)) {\n // 登录 token 错误，\n massage = \"Failed to join the room, token authentication error.\";\n }\n else if (1002056 === logInRsp) {\n // 用户重复进行登录。\n massage =\n \"You are on a call in another room, please leave that room first.\";\n }\n else {\n massage =\n \"Failed to join the room, please try again.(error code:\" +\n logInRsp +\n \")\";\n }\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Login room Failed\",\n contentText: massage,\n okText: \"OK\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n });\n }\n initInRoomInviteMgListener() {\n var _a, _b, _c, _d, _e, _f;\n // 收到邀请上麦的通知\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.notifyInviteToCoHost((inviterName) => {\n this.inviteModelRoot = (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Invitation\",\n contentText: \"The host invites you to have a connection.\",\n okText: \"Confirm\",\n cancelText: \"Disagree\",\n onOk: () => __awaiter(this, void 0, void 0, function* () {\n var _a;\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceAcceptInvitation();\n // TODO 角色变更，更新config，开始推流,\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }),\n onCancel: () => {\n var _a;\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceRefuseInvitation();\n },\n countdown: 60,\n }, document.querySelector(\".zego_model_parent\"));\n });\n (_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.notifyInviteToCoHostRefused((reason, user) => {\n if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Disagree) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${user.inviteeName} disagreed with the invitation.`,\n });\n }\n else if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Busy) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"Invitation has been sent.\",\n });\n }\n });\n (_c = this.props.core._zimManager) === null || _c === void 0 ? void 0 : _c._inRoomInviteMg.notifyRemoveCoHost(() => {\n // Cohost 变成 Audience，停止推流\n this.cohostToBeAudience();\n });\n (_d = this.props.core._zimManager) === null || _d === void 0 ? void 0 : _d._inRoomInviteMg.notifyRequestCoHost((inviter, state) => {\n //收到观众连麦通知，0 取消|超时， 1 申请\n // 左侧通知\n if (state === 1) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${inviter.userName} is requesting a connection with you.`,\n });\n }\n // 设置红点\n if (state === 1) {\n this.state.unreadInviteList.add(inviter.userID);\n }\n else {\n this.state.unreadInviteList.delete(inviter.userID);\n }\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n // 设置观众状态\n this.updateUserRequestCohostState(inviter.userID, !!state);\n });\n (_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.notifyHostRespondRequestCohost((respond) => __awaiter(this, void 0, void 0, function* () {\n var _g;\n if (respond === 0) {\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }\n else if (respond === 1) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The host has rejected your request.\",\n });\n }\n else if (respond === 2) {\n (_g = this.inviteModelRoot) === null || _g === void 0 ? void 0 : _g.unmount();\n }\n this.setState({\n isRequestingCohost: false,\n });\n }));\n // 观众的连麦申请超时（观众端）\n (_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.notifyRequestCohostTimeout(() => {\n this.setState({\n isRequestingCohost: false,\n });\n });\n }\n createStream() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.props.core._config.turnOnCameraWhenJoining &&\n !this.props.core._config.turnOnMicrophoneWhenJoining &&\n !this.props.core._config.showMyCameraToggleButton &&\n !this.props.core._config.showMyMicrophoneToggleButton) {\n return false;\n }\n if (!this.props.core.status.videoRefuse ||\n !this.props.core.status.audioRefuse) {\n try {\n const solution = (0,_util__WEBPACK_IMPORTED_MODULE_7__.getVideoResolution)(this.state.selectVideoResolution);\n const localStream = yield this.props.core.createStream({\n camera: Object.assign({ video: !this.props.core.status.videoRefuse, audio: !this.props.core.status.audioRefuse, videoInput: this.state.selectCamera, audioInput: this.state.selectMic, videoQuality: 4 }, solution),\n });\n this.props.core.enableVideoCaptureDevice(localStream, !!this.props.core._config.turnOnCameraWhenJoining);\n this.props.core.muteMicrophone(!this.props.core._config.turnOnMicrophoneWhenJoining);\n this.setState({\n localStream,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n });\n const extraInfo = JSON.stringify({\n isCameraOn: !!this.props.core._config.turnOnCameraWhenJoining,\n isMicrophoneOn: this.props.core._config.turnOnMicrophoneWhenJoining,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n });\n try {\n const res = this.props.core.publishLocalStream(localStream, \"main\", extraInfo);\n if (res !== false) {\n this.localStreamID = res;\n }\n }\n catch (error) {\n // 推流失败就销毁创建的流\n console.error(\"【ZEGOCLOUD】publishStream failed:\", error);\n this.props.core.destroyStream(localStream);\n this.setState({\n localStream: null,\n });\n return false;\n }\n return true;\n }\n catch (error) {\n console.error(\"【ZEGOCLOUD】createStream or publishLocalStream failed,Reason: \", JSON.stringify(error));\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103065 || (error === null || error === void 0 ? void 0 : error.code) === 1103061) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The audio and video equipment is being occupied by another application.\",\n });\n }\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103064) {\n this.props.core.status.videoRefuse = true;\n this.props.core.status.audioRefuse = true;\n this.setState({\n cameraOpen: false,\n micOpen: false,\n });\n }\n return false;\n }\n }\n else {\n return false;\n }\n });\n }\n stopPublish() {\n try {\n this.localStreamID &&\n this.props.core.stopPublishingStream(this.localStreamID);\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.setState({\n localStream: null,\n });\n this.localStreamID = \"\";\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleMic() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.audioRefuse) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Equipment authorization\",\n contentText: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n return;\n }\n if (this.micStatus === -1)\n return;\n this.micStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getAudioTracks().length > 0) {\n result = yield this.props.core.muteMicrophone(this.state.micOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: this.state.cameraOpen,\n isMicrophoneOn: !this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.micStatus = !this.state.micOpen ? 1 : 0;\n if (result) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The microphone is \" + (this.micStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n micOpen: !!this.micStatus,\n }, () => {\n this.computeByResize(this.state.cameraOpen || this.state.micOpen);\n });\n }\n return !!result;\n });\n }\n toggleCamera() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.videoRefuse) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Equipment authorization\",\n contentText: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n return Promise.resolve(false);\n }\n if (this.cameraStatus === -1)\n return Promise.resolve(false);\n this.cameraStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getVideoTracks().length > 0) {\n result = yield this.props.core.enableVideoCaptureDevice(this.state.localStream, !this.state.cameraOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: !this.state.cameraOpen,\n isMicrophoneOn: this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.cameraStatus = !this.state.cameraOpen ? 1 : 0;\n if (result) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The camera is \" + (this.cameraStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n cameraOpen: !!this.cameraStatus,\n }, () => {\n this.computeByResize(this.state.cameraOpen || this.state.micOpen);\n });\n }\n return !!result;\n });\n }\n toggleScreenSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isScreenSharingBySelf) {\n this.closeScreenSharing();\n }\n else {\n this.createScreenSharing();\n }\n });\n }\n createScreenSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isZegoWhiteboardSharing)\n return;\n if (this.state.screenSharingUserList.length > 0) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${this.state.screenSharingUserList[0].userName} is presenting now. You cannot share your screen.`,\n });\n return;\n }\n if (this.isCreatingScreenSharing)\n return;\n this.isCreatingScreenSharing = true;\n try {\n const screenSharingStream = yield this.props.core.createStream({\n screen: {\n videoQuality: 2,\n bitRate: 1500,\n frameRate: 15,\n audio: !(0,_util__WEBPACK_IMPORTED_MODULE_7__.isFireFox)(),\n },\n });\n const streamID = this.props.core.publishLocalStream(screenSharingStream, \"screensharing\", JSON.stringify({\n isCameraOn: true,\n isMicrophoneOn: true,\n hasVideo: screenSharingStream.getVideoTracks().length > 0,\n hasAudio: screenSharingStream.getAudioTracks()[0].enabled,\n }));\n streamID && (this.screenSharingStreamID = streamID);\n this.setState({\n isScreenSharingBySelf: true,\n screenSharingStream: screenSharingStream,\n });\n }\n catch (error) {\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103043) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Your browser does not support screen sharing.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n else if ((error === null || error === void 0 ? void 0 : error.code) === 1103010 && (error === null || error === void 0 ? void 0 : error.msg.includes(\"Permission\"))) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Grant access to share your screen\",\n contentText: \"Your system does not have access to share a screen from the browser. Please grant access to share your screen on your system settings.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n else if ((error === null || error === void 0 ? void 0 : error.code) !== 1103042) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `Failed to present your screen. error code: ${(error === null || error === void 0 ? void 0 : error.code) || -1}`,\n });\n }\n }\n this.isCreatingScreenSharing = false;\n });\n }\n closeScreenSharing() {\n try {\n this.screenSharingStreamID &&\n this.props.core.stopPublishingStream(this.screenSharingStreamID);\n this.state.screenSharingStream &&\n this.props.core.destroyStream(this.state.screenSharingStream);\n this.setState({\n isScreenSharingBySelf: false,\n });\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleWhiteboardSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.getScreenSharingUser.length > 0)\n return;\n if (this.state.zegoSuperBoardView) {\n this.closeWhiteboardSharing();\n }\n else if (!this.state.isZegoWhiteboardSharing) {\n this.createWhiteboardSharing();\n }\n });\n }\n createWhiteboardSharing() {\n var _a;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length > 0) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${this.state.screenSharingUserList[0].userName} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n else if (this.state.zegoSuperBoardView) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${(_a = this.state.zegoSuperBoardView.getCurrentSuperBoardSubView()) === null || _a === void 0 ? void 0 : _a.getModel.name} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n if (this.isCreatingWhiteboardSharing)\n return;\n this.isCreatingWhiteboardSharing = true;\n this.setState({ isZegoWhiteboardSharing: true });\n });\n }\n closeWhiteboardSharing() {\n try {\n this.state.zegoSuperBoardView &&\n this.props.core.destroyAndStopPublishWhiteboard();\n this.setState({\n isZegoWhiteboardSharing: false,\n zegoSuperBoardView: null,\n });\n this.isCreatingWhiteboardSharing = false;\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleLayOut(layOutStatus) {\n this.setState((state) => {\n return {\n layOutStatus: state.layOutStatus === layOutStatus ? \"ONE_VIDEO\" : layOutStatus,\n };\n }, () => {\n this.computeByResize();\n });\n }\n sendMessage(msg) {\n return __awaiter(this, void 0, void 0, function* () {\n let messageID = (0,_util__WEBPACK_IMPORTED_MODULE_7__.randomNumber)(5);\n this.setState((state) => {\n return {\n messageList: [\n ...state.messageList,\n {\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n message: msg,\n sendTime: Date.now(),\n messageID,\n status: \"SENDING\",\n },\n ],\n };\n });\n let resp = {};\n try {\n resp = yield this.props.core.sendRoomMessage(msg);\n }\n catch (err) {\n console.error(\"【ZEGOCLOUD】sendMessage failed!\", JSON.stringify(err));\n }\n this.setState((state) => {\n const _messageList = state.messageList.map((msg) => {\n if (msg.messageID === messageID) {\n msg.status = (resp === null || resp === void 0 ? void 0 : resp.errorCode) === 0 ? \"SENDED\" : \"FAILED\";\n }\n return msg;\n });\n console.log(_messageList);\n return {\n messageList: _messageList,\n };\n });\n });\n }\n openSettings() {\n this.setState({\n showSettings: !this.state.showSettings,\n });\n }\n handleSetting() {\n this.setState({\n showZegoSettings: true,\n });\n }\n handleLeave() {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Leave the room\",\n contentText: \"Are you sure to leave the room?\",\n okText: \"Confirm\",\n cancelText: \"Cancel\",\n onOk: () => {\n var _a, _b;\n if (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) !== _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n this.props.core._config.turnOnCameraWhenJoining =\n this.state.cameraOpen;\n this.props.core._config.turnOnMicrophoneWhenJoining =\n this.state.micOpen;\n }\n this.props.core.status.micDeviceID = this.state.selectMic;\n this.props.core.status.cameraDeviceID = this.state.selectCamera;\n this.props.core.status.speakerDeviceID = this.state.selectSpeaker;\n this.props.core.status.videoResolution =\n this.state.selectVideoResolution;\n this.leaveRoom();\n },\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n leaveRoom(isKickedOut = false) {\n var _a, _b;\n (_b = (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg) === null || _b === void 0 ? void 0 : _b.audienceCancelRequest();\n this.state.isScreenSharingBySelf && this.closeScreenSharing();\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom(isKickedOut);\n }\n get showSelf() {\n if (this.props.core._config.showNonVideoUser) {\n return true;\n }\n else {\n if (this.props.core._config.showOnlyAudioUser) {\n return (this.localStreamID && (this.state.micOpen || this.state.cameraOpen));\n }\n else {\n return this.localStreamID && this.state.cameraOpen;\n }\n }\n }\n computeByResize(justSetNum = false) {\n return __awaiter(this, void 0, void 0, function* () {\n const width = Math.max(this.props.core._config.container.clientWidth, 640);\n const height = Math.max(this.props.core._config.container.clientHeight, 328);\n let videoShowNumber = 0, gridRowNumber = 0;\n if (this.getScreenSharingUser.length > 0 ||\n this.state.isZegoWhiteboardSharing) {\n //Screen Sidebar\n const videWrapHight = height -\n (this.showHeader ? 64 : 16) -\n 84 -\n (this.state.isZegoWhiteboardSharing ? 0 : 38);\n const n = parseInt(String(videWrapHight / 124)) || 1;\n videoShowNumber = Math.min(n * 124 + (n - 1) * 10 <= videWrapHight ? n : n - 1 || 1, 5);\n !justSetNum && (yield this.props.core.setSidebarLayOut(false));\n if (this.fullScreen) {\n this.setState({\n videoShowNumber: 0,\n });\n yield this.props.core.setMaxScreenNum(0);\n }\n else {\n this.setState({\n videoShowNumber: videoShowNumber,\n });\n yield this.props.core.setMaxScreenNum(this.showSelf ? videoShowNumber - 1 : videoShowNumber);\n }\n return;\n }\n if (this.state.layout === \"Sidebar\") {\n // Sidebar\n const videWrapHight = height - (this.showHeader ? 64 : 16) - 84;\n const n = parseInt(String(videWrapHight / 124)) || 1;\n videoShowNumber = Math.min(n * 124 + (n - 1) * 10 <= videWrapHight ? n : n - 1 || 1, 5);\n const sidebarEnabled = this.state.cameraOpen || this.state.micOpen ? !this.localUserPin : true;\n !justSetNum && (yield this.props.core.setSidebarLayOut(sidebarEnabled));\n this.setState({\n videoShowNumber: videoShowNumber,\n });\n yield this.props.core.setMaxScreenNum(this.showSelf ? videoShowNumber : videoShowNumber + 1);\n return;\n }\n if (this.state.layout === \"Grid\" || this.state.layout === \"Auto\") {\n if (height < 406 - (this.showHeader ? 16 : 64)) {\n const videoWrapWidth = width - 32 - (this.state.layOutStatus === \"ONE_VIDEO\" ? 0 : 350);\n const n = parseInt(String(videoWrapWidth / 160));\n videoShowNumber = Math.min(n * 160 + (n - 1) * 10 <= videoWrapWidth ? n : n - 1, 10);\n gridRowNumber = 1;\n }\n else if (height < 540 - (this.showHeader ? 16 : 64)) {\n const videoWrapWidth = width - 32 - (this.state.layOutStatus === \"ONE_VIDEO\" ? 0 : 350);\n const n = parseInt(String(videoWrapWidth / 124));\n videoShowNumber = Math.min(n * 124 + (n - 1) * 10 <= videoWrapWidth ? 2 * n : 2 * (n - 1), 10);\n gridRowNumber = 2;\n }\n else {\n videoShowNumber = 9;\n gridRowNumber = 3;\n }\n !justSetNum && (yield this.props.core.setSidebarLayOut(false));\n this.setState({\n videoShowNumber: videoShowNumber,\n gridRowNumber: gridRowNumber,\n });\n yield this.props.core.setMaxScreenNum(this.showSelf ? videoShowNumber - 1 : videoShowNumber);\n return;\n }\n });\n }\n showLayoutSettings(show) {\n this.setState({\n showLayoutSettingsModel: show,\n });\n }\n changeLayout(type) {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isLayoutChanging)\n return;\n return new Promise((resolve, reject) => {\n this.userUpdateCallBack = () => {\n this.setState({\n isLayoutChanging: false,\n });\n resolve(true);\n };\n if (type === \"Grid\" || type === \"Auto\") {\n this.props.core.setPin();\n this.localUserPin = false;\n }\n this.setState({\n isLayoutChanging: true,\n layout: type,\n });\n this.props.core.setSidebarLayOut(type === \"Sidebar\");\n setTimeout(() => {\n this.setState({\n isLayoutChanging: false,\n });\n resolve(false);\n }, 5000);\n });\n });\n }\n getAllUser() {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n pin: this.localUserPin,\n avatar: this.props.core._expressConfig.avatar,\n streamList: [\n {\n media: this.state.localStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: this.state.micOpen ? \"OPEN\" : \"MUTE\",\n cameraStatus: this.state.cameraOpen ? \"OPEN\" : \"MUTE\",\n state: \"PLAYING\",\n streamID: this.localStreamID,\n },\n ],\n },\n ...this.state.zegoCloudUserList,\n ];\n }\n getShownUser(forceShowNonVideoUser = false) {\n const shownUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser && !forceShowNonVideoUser) {\n if (item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS)) {\n if (item.streamList[0].cameraStatus === \"OPEN\") {\n return true;\n }\n else if (this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n }\n else {\n return false;\n }\n }\n else {\n return true;\n }\n });\n return shownUser;\n }\n get getScreenSharingUser() {\n if (this.state.isScreenSharingBySelf) {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n avatar: this.props.core._expressConfig.avatar,\n pin: false,\n streamList: [\n {\n media: this.state.screenSharingStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: \"OPEN\",\n cameraStatus: \"OPEN\",\n state: \"PLAYING\",\n streamID: this.screenSharingStreamID,\n },\n ],\n },\n ];\n }\n else {\n return this.state.screenSharingUserList;\n }\n }\n getHiddenUser() {\n const hiddenUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser &&\n item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS) &&\n item.streamList[0].cameraStatus !== \"OPEN\" &&\n !this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n });\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: hiddenUser.map((user) => {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_18__[\"default\"], { muted: user.userID === this.props.core._expressConfig.userID, userInfo: user }, user.userID + \"_hiddenAudio\"));\n }) }));\n }\n get showScreenShareBottomTip() {\n var _a, _b, _c;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.state.liveStatus !== \"1\") {\n return false;\n }\n else {\n return this.getScreenSharingUser.length > 0;\n }\n }\n getLayoutScreen() {\n var _a, _b, _c;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming) {\n const hasVideo = [\n ...this.getAllUser(),\n ...this.getScreenSharingUser,\n ].some((u) => {\n if (u.streamList) {\n return u.streamList.some((s) => {\n return s.cameraStatus === \"OPEN\" || s.micStatus === \"OPEN\";\n });\n }\n return false;\n });\n if (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n if (this.state.liveStatus !== \"1\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveNotStart }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"The Live has not started yet\" })] })));\n }\n else if (hasVideo &&\n this.props.core._config.scenario.config.enableVideoMixing &&\n this.props.core._config.scenario.config.role === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_19__.ZegoMixPlayer, { userInfo: this.props.core.mixUser, isPureAudio: this.props.core.zum.isPureAudio, isPureVideo: this.props.core.zum.isPureVideo }));\n }\n }\n if (!hasVideo) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].noOneStreaming }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"No one has turned on the camera or microphone yet.\" })] })));\n }\n }\n if (this.getScreenSharingUser.length > 0) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ZegoScreenSharingLayout__WEBPACK_IMPORTED_MODULE_15__.ZegoScreenSharingLayout, { handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, screenSharingUser: this.getScreenSharingUser[0], soundLevel: this.state.soundLevel, handleFullScreen: this.handleFullScreen.bind(this), roomID: this.props.core._expressConfig.roomID }) }));\n }\n if (this.state.isZegoWhiteboardSharing) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ZegoWhiteboardSharingLayout__WEBPACK_IMPORTED_MODULE_16__.ZegoWhiteboardSharingLayout, { handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, soundLevel: this.state.soundLevel, handleFullScreen: this.handleFullScreen.bind(this), roomID: this.props.core._expressConfig.roomID, onShow: (el) => __awaiter(this, void 0, void 0, function* () {\n var _d;\n // console.error(\n // \"【ZEGOCLOUD】onShow\",\n // this.isCreatingWhiteboardSharing,\n // !this.state.zegoSuperBoardView\n // );\n // 主动渲染\n if (this.isCreatingWhiteboardSharing &&\n !this.state.zegoSuperBoardView) {\n try {\n const zegoSuperBoardView = yield this.props.core.createAndPublishWhiteboard(el, this.props.core._expressConfig.userName);\n this.setState({\n zegoSuperBoardView,\n });\n }\n catch (error) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Operation too frequent, failed to load the whiteboard.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n this.isCreatingWhiteboardSharing = false;\n }\n else if (this.state.zegoSuperBoardView) {\n // 被动渲染\n const uniqueID = (_d = this.state.zegoSuperBoardView\n .getCurrentSuperBoardSubView()) === null || _d === void 0 ? void 0 : _d.getModel().uniqueID;\n uniqueID &&\n this.state.zegoSuperBoardView.switchSuperBoardSubView(uniqueID);\n }\n }), onResize: (el) => {\n var _a, _b;\n // 主动渲染\n if (this.state.isZegoWhiteboardSharing && el) {\n try {\n (_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.reloadView();\n }\n catch (error) {\n console.warn(\"【ZEGOCLOUD】onResize\", error);\n }\n }\n }, onclose: () => {\n this.toggleWhiteboardSharing();\n }, onToolChange: (type, fontSize, color) => {\n this.props.core.setWhiteboardToolType(type, fontSize, color);\n }, onFontChange: (font, fontSize, color) => {\n this.props.core.setWhiteboardFont(font, fontSize, color);\n }, zegoSuperBoardView: this.state.zegoSuperBoardView }));\n }\n if ((this.state.layout === \"Auto\" && this.getShownUser().length < 3) ||\n this.getShownUser().length < 2) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoOne2One__WEBPACK_IMPORTED_MODULE_5__.ZegoOne2One, { onLocalStreamPaused: () => __awaiter(this, void 0, void 0, function* () {\n yield this.props.core.enableVideoCaptureDevice(this.state.localStream, !this.state.cameraOpen);\n this.props.core.enableVideoCaptureDevice(this.state.localStream, this.state.cameraOpen);\n }), selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), soundLevel: this.state.soundLevel }));\n }\n if ((this.state.layout === \"Grid\" && this.getShownUser().length > 1) ||\n (this.state.layout === \"Auto\" && this.getShownUser().length > 2)) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoGridLayout__WEBPACK_IMPORTED_MODULE_11__.ZegoGridLayout, { userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, gridRowNumber: this.state.gridRowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, handleMenuItem: this.handleMenuItem.bind(this), soundLevel: this.state.soundLevel }));\n }\n if (this.state.layout === \"Sidebar\" && this.getShownUser().length > 1) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoSidebarLayout__WEBPACK_IMPORTED_MODULE_12__.ZegoSidebarLayout, { handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, soundLevel: this.state.soundLevel }));\n }\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {});\n }\n handleMenuItem(type, user) {\n this.menuOptions[type](user);\n }\n cohostToBeAudience() {\n this.stopPublish();\n this.closeScreenSharing();\n this.setState({\n showLayoutSettings: false,\n showSettings: false,\n });\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n handleRequestCohost() {\n var _a, _b;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isRequestingCohost) {\n yield ((_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceCancelRequest());\n this.setState({\n isRequestingCohost: false,\n });\n }\n else {\n const res = yield ((_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.requestCohost());\n if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `You've applied for connection, please wait for the host's confirmation.`,\n });\n this.setState({\n isRequestingCohost: true,\n });\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 1) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `The host has left the room.`,\n });\n }\n else {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `Failed to send application, please try again.`,\n });\n }\n }\n });\n }\n updateUserRequestCohostState(userID, state) {\n const userList = this.state.zegoCloudUserList.map((user) => {\n if (user.userID === userID) {\n user.requestCohost = state ? Date.now() : undefined;\n }\n return user;\n });\n this.setState({\n zegoCloudUserList: userList,\n });\n }\n handleFullScreen(fullScreen) {\n this.fullScreen = fullScreen;\n this.computeByResize();\n }\n setLive() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Stop broadcast\",\n contentText: \"Are you sure to stop broadcasting?\",\n okText: \"Stop\",\n cancelText: \"Cancel\",\n onOk: () => __awaiter(this, void 0, void 0, function* () {\n // stop live\n yield this.props.core.setLive(\"stop\");\n this.setState({\n liveCountdown: -1,\n });\n }),\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n else if (this.state.liveCountdown === -1) {\n this.setState({\n liveCountdown: 3,\n }, () => {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n });\n }\n });\n }\n liveCountdownTimer() {\n this.setState((preState) => {\n return {\n liveCountdown: preState.liveCountdown - 1,\n };\n }, () => __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n yield this.props.core.setLive(\"live\");\n }\n else {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n }\n }));\n }\n setAllSinkId(speakerId) {\n const room = document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`);\n room === null || room === void 0 ? void 0 : room.querySelectorAll(\"video\").forEach((video) => {\n var _a;\n (_a = video === null || video === void 0 ? void 0 : video.setSinkId) === null || _a === void 0 ? void 0 : _a.call(video, speakerId || \"\");\n });\n room === null || room === void 0 ? void 0 : room.querySelectorAll(\"audio\").forEach((audio) => {\n var _a;\n (_a = audio === null || audio === void 0 ? void 0 : audio.setSinkId) === null || _a === void 0 ? void 0 : _a.call(audio, speakerId || \"\");\n });\n }\n showTurnOffMicrophoneButton(user) {\n var _a, _b, _c, _d;\n if (!this.props.core._config.showTurnOffRemoteMicrophoneButton)\n return false;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (user.userID === this.props.core._expressConfig.userID &&\n ((_d = (_c = this.props.core._config.scenario) === null || _c === void 0 ? void 0 : _c.config) === null || _d === void 0 ? void 0 : _d.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n showTurnOffCameraButton(user) {\n var _a, _b, _c, _d;\n if (!this.props.core._config.showTurnOffRemoteCameraButton)\n return false;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (user.userID === this.props.core._expressConfig.userID &&\n ((_d = (_c = this.props.core._config.scenario) === null || _c === void 0 ? void 0 : _c.config) === null || _d === void 0 ? void 0 : _d.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n showRemoveButton(user) {\n var _a, _b;\n if (!this.props.core._config.showRemoveUserButton)\n return false;\n if (this.props.core.isHost(user.userID))\n return false;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host &&\n (user.userID !== this.props.core._expressConfig.userID ||\n user.streamList.length === 0));\n }\n isShownPin(user) {\n var _a;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.OneONoneCall) {\n return false;\n }\n let showPinButton = !!this.props.core._config.showPinButton && this.getShownUser().length > 1;\n return (showPinButton &&\n !!(this.props.core._config.showNonVideoUser ||\n (user.streamList &&\n user.streamList[0] &&\n user.streamList[0].cameraStatus === \"OPEN\") ||\n (user.streamList &&\n user.streamList[0] &&\n user.streamList[0].micStatus === \"OPEN\" &&\n !!this.props.core._config.showOnlyAudioUser)));\n }\n showRemoveCohostButton(user) {\n if (!this.props.core._config.showRemoveCohostButton)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n if (this.props.core.isHost(this.props.core._expressConfig.userID)) {\n return user.userID !== this.props.core._expressConfig.userID;\n }\n else {\n return user.userID === this.props.core._expressConfig.userID;\n }\n }\n showMenu(user) {\n return (this.isShownPin(user) ||\n this.showRemoveButton(user) ||\n this.showTurnOffCameraButton(user) ||\n this.showTurnOffMicrophoneButton(user) ||\n this.showRemoveCohostButton(user));\n }\n initLayout() {\n switch (this.props.core._config.rightPanelExpandedType) {\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.None:\n return \"ONE_VIDEO\";\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.RoomDetails:\n return this.props.core._config.showRoomDetailsButton\n ? \"INVITE\"\n : \"ONE_VIDEO\";\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.RoomMembers:\n return this.props.core._config.showUserList ? \"USER_LIST\" : \"ONE_VIDEO\";\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.RoomMessages:\n return this.props.core._config.showTextChat ? \"MESSAGE\" : \"ONE_VIDEO\";\n default:\n return \"ONE_VIDEO\";\n }\n }\n render() {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;\n const startIndex = this.state.notificationList.length < 4\n ? 0\n : this.state.notificationList.length - 2;\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_context_showManage__WEBPACK_IMPORTED_MODULE_17__[\"default\"].Provider, Object.assign({ value: {\n showPinButton: !!this.props.core._config.showPinButton &&\n this.getShownUser().length > 1,\n liveStatus: this.state.liveStatus,\n showTurnOffMicrophoneButton: this.showTurnOffMicrophoneButton.bind(this),\n showTurnOffCameraButton: this.showTurnOffCameraButton.bind(this),\n showRemoveButton: this.showRemoveButton.bind(this),\n isShownPin: this.isShownPin.bind(this),\n showRemoveCohostButton: this.showRemoveCohostButton.bind(this),\n speakerId: this.state.selectSpeaker,\n whiteboard_page: ((_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.getCurrentPage()) || 1,\n whiteboard_toolType: ((_c = this.props.core.zegoSuperBoard) === null || _c === void 0 ? void 0 : _c.getToolType()) || 0,\n whiteboard_fontSize: ((_d = this.props.core.zegoSuperBoard) === null || _d === void 0 ? void 0 : _d.getFontSize()) || 0,\n whiteboard_brushSize: ((_e = this.props.core.zegoSuperBoard) === null || _e === void 0 ? void 0 : _e.getBrushSize()) || 0,\n whiteboard_brushColor: ((_f = this.props.core.zegoSuperBoard) === null || _f === void 0 ? void 0 : _f.getBrushColor()) || \"\",\n whiteboard_isFontBold: (_g = this.props.core.zegoSuperBoard) === null || _g === void 0 ? void 0 : _g.isFontBold(),\n whiteboard_isFontItalic: (_h = this.props.core.zegoSuperBoard) === null || _h === void 0 ? void 0 : _h.isFontItalic(),\n whiteboard_showAddImage: (_j = this.props.core._config.whiteboardConfig) === null || _j === void 0 ? void 0 : _j.showAddImageButton,\n userInfo: { userID: this.props.core._expressConfig.userID },\n whiteboard_showCreateClose: (_k = this.props.core._config.whiteboardConfig) === null || _k === void 0 ? void 0 : _k.showCreateAndCloseButton,\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom} zego_model_parent` }, { children: [this.showHeader && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].header }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].headerLeft }, { children: [((_l = this.props.core._config.branding) === null || _l === void 0 ? void 0 : _l.logoURL) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].logo, src: (_m = this.props.core._config.branding) === null || _m === void 0 ? void 0 : _m.logoURL, alt: \"logo\" })), this.props.core._config.showRoomTimer &&\n ((_p = (_o = this.props.core._config) === null || _o === void 0 ? void 0 : _o.scenario) === null || _p === void 0 ? void 0 : _p.mode) !==\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_4__.ZegoTimer, {}), ((_q = this.props.core._config.scenario) === null || _q === void 0 ? void 0 : _q.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n (this.state.liveCountdown === 0 ||\n this.state.liveStatus === \"1\") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveState }, { children: \"Live\" })))] })), ((_r = this.props.core._config.scenario) === null || _r === void 0 ? void 0 : _r.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_t = (_s = this.props.core._config.scenario) === null || _s === void 0 ? void 0 : _s.config) === null || _t === void 0 ? void 0 : _t.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"button\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLive} ${this.state.liveCountdown === 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLiveEnabled\n : \"\"}`, id: \"ZegoLiveButton\", onClick: () => {\n this.setLive();\n } }, { children: this.state.liveCountdown === 3 ||\n this.state.liveCountdown === -1\n ? \"Go Live\"\n : this.state.liveCountdown === 0\n ? \"Stop broadcast\"\n : \"Start stream...\" })))] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].content, style: { paddingTop: this.showHeader ? 0 : \"16px\" } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].contentLeft }, { children: [this.getLayoutScreen(), this.getHiddenUser(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notify, id: \"zego_left_notify_wrapper\" }, { children: this.state.notificationList\n .slice(startIndex)\n .map((notify, index) => {\n if (notify.type === \"MSG\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h5\", { children: notify.userName }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: notify.content })] }), index));\n }\n else if (notify.type === \"USER\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].nowrap }, { children: notify.content })) }), index));\n }\n else {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].nowrap }, { children: notify.content })) }), index));\n }\n }) })), this.state.isNetworkPoor && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].network }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].contentRight, style: {\n display: this.state.layOutStatus !== \"ONE_VIDEO\" ? \"flex\" : \"none\",\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].listHeader }, { children: [this.state.layOutStatus === \"INVITE\" && \"Room details\", this.state.layOutStatus === \"USER_LIST\" && \"Room members\", this.state.layOutStatus === \"MESSAGE\" && \"Room messages\", (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].listHeaderClose, onClick: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].listContent }, { children: [this.state.layOutStatus === \"INVITE\" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_13__.ZegoRoomInvite, { core: this.props.core })), this.state.layOutStatus === \"USER_LIST\" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoUserList__WEBPACK_IMPORTED_MODULE_14__.ZegoUserList, { core: this.props.core, userList: this.getShownUser(true), selfUserID: this.props.core._expressConfig.userID, handleMenuItem: this.handleMenuItem.bind(this), soundLevel: this.state.soundLevel })), this.state.layOutStatus === \"MESSAGE\" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMessage__WEBPACK_IMPORTED_MODULE_6__.ZegoMessage, { messageList: this.state.messageList, sendMessage: (msg) => {\n this.sendMessage(msg);\n }, selfUserID: this.props.core._expressConfig.userID }))] }))] }))] })), this.showScreenShareBottomTip && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenBottomBar }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenBottomBarLeft }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"p\", { children: this.state.isScreenSharingBySelf\n ? \"You're presenting to everyone\"\n : `${this.state.screenSharingUserList[0].userName} is presenting the screen` })] })), this.state.isScreenSharingBySelf && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenBottomBarRight, onClick: () => {\n this.toggleScreenSharing();\n } }, { children: \"Stop Presenting\" })))] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].footer }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].handlerMiddle }, { children: [this.props.core._config.showMyMicrophoneToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].micButton} ${!this.state.micOpen && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].close}`, onClick: () => {\n this.toggleMic();\n } })), this.props.core._config.showMyCameraToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].cameraButton} ${!this.state.cameraOpen && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].close}`, onClick: () => {\n this.toggleCamera();\n } })), this.props.core._config.showScreenSharingButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenButton} ${this.state.isScreenSharingBySelf && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].sharing} ${this.state.isZegoWhiteboardSharing && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].forbidden}`, onClick: () => {\n this.toggleScreenSharing();\n } })), ((_u = this.props.core._config.plugins) === null || _u === void 0 ? void 0 : _u.ZegoSuperBoardManager) &&\n ((_v = this.props.core._config.whiteboardConfig) === null || _v === void 0 ? void 0 : _v.showCreateAndCloseButton) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].whiteboardButton} ${this.state.isZegoWhiteboardSharing && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].sharing} ${this.getScreenSharingUser.length > 0 &&\n _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].forbidden}`, onClick: () => {\n this.toggleWhiteboardSharing();\n } })), (this.props.core._config.showAudioVideoSettingsButton ||\n this.props.core._config.showLayoutButton) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ ref: this.moreRef, className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].moreButton, onClick: () => {\n this.openSettings();\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].settingsButtonModel, style: {\n display: this.state.showSettings ? \"block\" : \"none\",\n }, ref: this.settingsRef }, { children: [this.props.core._config.showLayoutButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ onClick: () => this.showLayoutSettings(true) }, { children: \"Change layout\" }))), this.props.core._config.showAudioVideoSettingsButton &&\n this.props.core._config.showLayoutButton && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", {}), this.props.core._config.showAudioVideoSettingsButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ onClick: () => this.handleSetting() }, { children: \"Settings\" })))] })) }))), this.showRequestCohost && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].requestCohostButton} ${this.state.isRequestingCohost\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].cancel\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].active}`, onClick: () => {\n this.handleRequestCohost();\n } })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: ((_w = this.props.core._config.scenario) === null || _w === void 0 ? void 0 : _w.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveLeaveButton\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].leaveButton, onClick: () => {\n this.handleLeave();\n } })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].handlerRight }, { children: [this.props.core._config.showRoomDetailsButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].inviteButton, onClick: () => {\n this.toggleLayOut(\"INVITE\");\n } })), this.props.core._config.showUserList && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].memberButton} ${this.state.unreadInviteList.size > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].msgButtonRed\n : \"\"}`, onClick: () => {\n this.toggleLayOut(\"USER_LIST\");\n } }, { children: this.state.unreadInviteList.size === 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].memberNum }, { children: this.state.zegoCloudUserList.length > 99\n ? \"99+\"\n : this.state.zegoCloudUserList.length + 1 }))) }))), this.props.core._config.showTextChat && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].msgButton} ${this.state.haveUnReadMsg ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].msgButtonRed : \"\"}`, onClick: () => {\n this.setState({\n haveUnReadMsg: false,\n });\n this.toggleLayOut(\"MESSAGE\");\n } }))] }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].reconnect, style: {\n display: this.state.connecting ? \"flex\" : \"none\",\n backgroundColor: this.state.firstLoading ? \"#1C1F2E\" : \"\",\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"p\", { children: this.state.firstLoading\n ? \"Joining Room\"\n : \"There's something wrong with your network. Trying to reconnect...\" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].countDown, style: {\n display: this.state.liveCountdown > 0 ? \"flex\" : \"none\",\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: this.state.liveCountdown }) })), this.state.showLayoutSettingsModel && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsMask }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsWrapper }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsHeader }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"p\", { children: \"Change layout\" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsCloseIcon, onClick: () => this.showLayoutSettings(false) })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsContent }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemRow, onClick: () => this.changeLayout(\"Auto\") }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemIcon} ${this.state.layout === \"Auto\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemChecked\n : \"\"} ${this.state.isLayoutChanging &&\n this.state.layout === \"Auto\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemLoading\n : \"\"}` }), \"Auto\"] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { src: __webpack_require__(/*! ../../../sdkAssets/img_layout_auto@2x.png */ \"./src/sdk/sdkAssets/img_layout_auto@2x.png\"), alt: \"grid layout\" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemRow, onClick: () => this.changeLayout(\"Grid\") }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemIcon} ${this.state.layout === \"Grid\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemChecked\n : \"\"} ${this.state.isLayoutChanging &&\n this.state.layout === \"Grid\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemLoading\n : \"\"}` }), \"Grid\"] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { src: __webpack_require__(/*! ../../../sdkAssets/img_layout_grid@2x.png */ \"./src/sdk/sdkAssets/img_layout_grid@2x.png\"), alt: \"grid layout\" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemRow, onClick: () => this.changeLayout(\"Sidebar\") }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemIcon} ${this.state.layout === \"Sidebar\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemChecked\n : \"\"} ${this.state.isLayoutChanging &&\n this.state.layout === \"Sidebar\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemLoading\n : \"\"}` }), \"Sidebar\"] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { src: __webpack_require__(/*! ../../../sdkAssets/img_layout_sidebar@2x.png */ \"./src/sdk/sdkAssets/img_layout_sidebar@2x.png\"), alt: \"Sidebar layout\" })] }))] }))] })) }))), this.state.showZegoSettings && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoSetting__WEBPACK_IMPORTED_MODULE_8__.ZegoSettings, { core: this.props.core, theme: \"black\", initDevices: {\n mic: this.state.selectMic,\n cam: this.state.selectCamera,\n speaker: this.state.selectSpeaker,\n videoResolve: this.state.selectVideoResolution,\n showNonVideoUser: this.state.showNonVideoUser,\n }, closeCallBack: () => {\n this.setState({\n showZegoSettings: false,\n });\n }, onMicChange: (deviceID) => {\n this.setState({\n selectMic: deviceID,\n }, () => {\n if (this.state.localStream) {\n this.props.core.useMicrophoneDevice(this.state.localStream, deviceID);\n }\n });\n }, onCameraChange: (deviceID) => {\n this.setState({\n selectCamera: deviceID,\n }, () => __awaiter(this, void 0, void 0, function* () {\n if (this.state.localStream) {\n yield this.props.core.useCameraDevice(this.state.localStream, deviceID);\n this.setState({\n cameraOpen: true,\n });\n }\n }));\n }, onSpeakerChange: (deviceID) => {\n this.setState({\n selectSpeaker: deviceID,\n }, () => {\n this.setAllSinkId(deviceID);\n });\n }, onVideoResolutionChange: (level) => {\n this.setState({\n selectVideoResolution: level,\n }, () => {\n if (this.state.localStream) {\n const { width, height, bitrate, frameRate } = (0,_util__WEBPACK_IMPORTED_MODULE_7__.getVideoResolution)(level);\n this.props.core.setVideoConfig(this.state.localStream, {\n width,\n height,\n maxBitrate: bitrate,\n frameRate,\n });\n }\n });\n }, onShowNonVideoChange: (selected) => {\n this.props.core._config.showNonVideoUser = selected;\n this.props.core.setShowNonVideo(selected);\n this.setState({\n showNonVideoUser: selected,\n });\n } }))] })) })));\n }\n}\n\n\n//# sourceURL=webpack://zegocloud_client_sdk_web/./src/sdk/view/pages/ZegoRoom/index.tsx?");
|
|
2698
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ZegoRoom\": function() { return /* binding */ ZegoRoom; }\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/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 _model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../model */ \"./src/sdk/model/index.ts\");\n/* harmony import */ var _index_module_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./index.module.scss */ \"./src/sdk/view/pages/ZegoRoom/index.module.scss\");\n/* harmony import */ var _components_zegoTimer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/zegoTimer */ \"./src/sdk/view/pages/ZegoRoom/components/zegoTimer.tsx\");\n/* harmony import */ var _components_zegoOne2One__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/zegoOne2One */ \"./src/sdk/view/pages/ZegoRoom/components/zegoOne2One.tsx\");\n/* harmony import */ var _components_zegoMessage__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./components/zegoMessage */ \"./src/sdk/view/pages/ZegoRoom/components/zegoMessage.tsx\");\n/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../util */ \"./src/sdk/util.ts\");\n/* harmony import */ var _components_zegoSetting__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../components/zegoSetting */ \"./src/sdk/view/components/zegoSetting/index.tsx\");\n/* harmony import */ var _components_zegoModel__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../components/zegoModel */ \"./src/sdk/view/components/zegoModel/index.tsx\");\n/* harmony import */ var _components_zegoToast__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/zegoToast */ \"./src/sdk/view/components/zegoToast/index.tsx\");\n/* harmony import */ var _components_zegoGridLayout__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./components/zegoGridLayout */ \"./src/sdk/view/pages/ZegoRoom/components/zegoGridLayout.tsx\");\n/* harmony import */ var _components_zegoSidebarLayout__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/zegoSidebarLayout */ \"./src/sdk/view/pages/ZegoRoom/components/zegoSidebarLayout.tsx\");\n/* harmony import */ var _components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/zegoRoomInvite */ \"./src/sdk/view/pages/ZegoRoom/components/zegoRoomInvite.tsx\");\n/* harmony import */ var _components_zegoUserList__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/zegoUserList */ \"./src/sdk/view/pages/ZegoRoom/components/zegoUserList.tsx\");\n/* harmony import */ var _components_ZegoScreenSharingLayout__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./components/ZegoScreenSharingLayout */ \"./src/sdk/view/pages/ZegoRoom/components/ZegoScreenSharingLayout.tsx\");\n/* harmony import */ var _components_ZegoWhiteboardSharingLayout__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./components/ZegoWhiteboardSharingLayout */ \"./src/sdk/view/pages/ZegoRoom/components/ZegoWhiteboardSharingLayout.tsx\");\n/* harmony import */ var _context_showManage__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../context/showManage */ \"./src/sdk/view/pages/context/showManage.ts\");\n/* harmony import */ var _components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/zegoMedia/audio */ \"./src/sdk/view/components/zegoMedia/audio.tsx\");\n/* harmony import */ var _components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./components/zegoMixPlayer */ \"./src/sdk/view/pages/ZegoRoom/components/zegoMixPlayer.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nclass ZegoRoom extends (react__WEBPACK_IMPORTED_MODULE_1___default().PureComponent) {\n constructor() {\n super(...arguments);\n this.state = {\n localStream: undefined,\n layOutStatus: this.initLayout(),\n zegoCloudUserList: [],\n messageList: [],\n notificationList: [],\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n showSettings: false,\n isNetworkPoor: false,\n connecting: false,\n firstLoading: true,\n selectMic: this.props.core.status.micDeviceID,\n selectSpeaker: this.props.core.status.speakerDeviceID,\n selectCamera: this.props.core.status.cameraDeviceID,\n selectVideoResolution: this.props.core.status.videoResolution ||\n this.props.core._config.videoResolutionList[0],\n videoShowNumber: 9,\n gridRowNumber: 3,\n layout: this.props.core._config.layout || \"Auto\",\n showLayoutSettingsModel: false,\n isLayoutChanging: false,\n soundLevel: {},\n showNonVideoUser: this.props.core._config.showNonVideoUser,\n liveCountdown: -1,\n liveStatus: \"0\",\n isScreenSharingBySelf: false,\n screenSharingStream: undefined,\n zegoSuperBoardView: null,\n screenSharingUserList: [],\n showZegoSettings: false,\n haveUnReadMsg: false,\n isZegoWhiteboardSharing: false,\n isRequestingCohost: false,\n unreadInviteList: new Set(),\n isMixing: \"0\",\n };\n this.settingsRef = react__WEBPACK_IMPORTED_MODULE_1___default().createRef();\n this.moreRef = react__WEBPACK_IMPORTED_MODULE_1___default().createRef();\n this.micStatus = !!this.props.core._config.turnOnMicrophoneWhenJoining\n ? 1\n : 0;\n this.cameraStatus = !!this.props.core._config.turnOnCameraWhenJoining\n ? 1\n : 0;\n this.msgDelayed = true; // 5s不显示\n this.localUserPin = false;\n this.localStreamID = \"\";\n this.screenSharingStreamID = \"\";\n this.isCreatingScreenSharing = false;\n this.isCreatingWhiteboardSharing = false;\n this.fullScreen = false;\n this.showNotSupported = 0;\n this.notSupportMultipleVideoNotice = 0;\n this.inviteModelRoot = null;\n this.userUpdateCallBack = () => { };\n this.onOpenSettings = (event) => {\n var _a, _b;\n if (this.settingsRef.current === event.target ||\n ((_a = this.settingsRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target)) ||\n this.moreRef.current === event.target ||\n ((_b = this.moreRef.current) === null || _b === void 0 ? void 0 : _b.contains(event.target))) {\n }\n else {\n this.setState({\n showSettings: false,\n });\n }\n };\n this.onWindowResize = (0,_util__WEBPACK_IMPORTED_MODULE_7__.throttle)(this.computeByResize.bind(this), 500);\n this.menuOptions = {\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.ChangePin]: (user) => {\n if (user.userID === this.props.core._expressConfig.userID) {\n this.localUserPin = !this.localUserPin;\n this.props.core.setPin();\n }\n else {\n this.localUserPin = false;\n this.props.core.setPin(user.userID);\n }\n this.props.core.setSidebarLayOut(this.getScreenSharingUser.length > 0\n ? false\n : this.localUserPin === false);\n this.setState({ layout: \"Sidebar\" });\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteMic]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n if (((_b = (_a = user.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.micStatus) === \"MUTE\")\n return;\n let res;\n try {\n if (user.userID === this.props.core._expressConfig.userID) {\n res = yield this.toggleMic();\n }\n else {\n res = yield this.props.core.turnRemoteMicrophoneOff(user.userID);\n }\n if (res) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"Turned off the microphone successfully.\",\n });\n }\n }\n catch (error) { }\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteCamera]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _c, _d;\n if (((_d = (_c = user.streamList) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.cameraStatus) === \"MUTE\")\n return;\n let res;\n try {\n if (user.userID === this.props.core._expressConfig.userID) {\n res = yield this.toggleCamera();\n }\n else {\n res = yield this.props.core.turnRemoteCameraOff(user.userID);\n }\n if (res) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"Turned off the camera successfully.\",\n });\n }\n }\n catch (error) { }\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveUser]: (user) => {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Remove participant\",\n contentText: \"Are you sure to remove \" + user.userName + \" ?\",\n okText: \"Confirm\",\n cancelText: \"Cancel\",\n onOk: () => {\n this.props.core.removeMember(user.userID);\n },\n }, document.querySelector(\".zego_model_parent\"));\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.InviteCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _e;\n const res = yield ((_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.inviteJoinToCohost(user.userID, user.userName || \"\"));\n console.warn(\"InviteCohost\", res);\n let text = \"\";\n if ((res === null || res === void 0 ? void 0 : res.code) === 2) {\n text = \"Invitation has been sent.\";\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n text = \"Sent the invitation successfully.\";\n }\n else {\n text = \"Failed to send the invitation, please try again.\";\n }\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: text,\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n const isSelf = user.userID === this.props.core._expressConfig.userID;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"End the connection\",\n contentText: isSelf\n ? `Are you sure to end the connection with the host?`\n : \"Are you sure to end the connection with \" + user.userName + \" ?\",\n okText: \"Yes\",\n cancelText: \"Cancel\",\n onOk: () => {\n var _a;\n if (isSelf) {\n this.cohostToBeAudience();\n }\n else {\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.removeCohost(user.userID);\n }\n },\n }, document.querySelector(\".zego_model_parent\"));\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.DisagreeRequestCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _f;\n const res = yield ((_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.hostRefuseRequest(user.userID));\n this.updateUserRequestCohostState(user.userID, false);\n this.state.unreadInviteList.delete(user.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"DisagreeRequestCohost\", res);\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.AgreeRequestCohost]: (user) => __awaiter(this, void 0, void 0, function* () {\n var _g;\n const res = yield ((_g = this.props.core._zimManager) === null || _g === void 0 ? void 0 : _g._inRoomInviteMg.hostAcceptRequest(user.userID));\n if ((res === null || res === void 0 ? void 0 : res.code) === 6000276) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The request for connecting has expired.\",\n });\n }\n this.updateUserRequestCohostState(user.userID, false);\n this.state.unreadInviteList.delete(user.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"AgreeRequestCohost\", res);\n }),\n };\n }\n get showHeader() {\n var _a, _b;\n return !!(((_a = this.props.core._config.branding) === null || _a === void 0 ? void 0 : _a.logoURL) ||\n this.props.core._config.showRoomTimer ||\n ((_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming);\n }\n get isCDNLive() {\n var _a, _b;\n return (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_b = this.props.core._config.scenario.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.props.core._config.scenario.config.liveStreamingMode ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveStreamingMode.LiveStreaming);\n }\n get showRequestCohost() {\n var _a, _b, _c;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.state.liveStatus === \"1\" &&\n ((_c = this.props.core._config) === null || _c === void 0 ? void 0 : _c.showRemoveCohostButton));\n }\n componentDidMount() {\n var _a, _b, _c;\n this.setAllSinkId(this.state.selectSpeaker || \"\");\n this.computeByResize();\n setTimeout(() => {\n this.msgDelayed = false;\n }, 5000);\n this.initInRoomInviteMgListener();\n this.initSDK();\n // 点击其他区域时, 隐藏更多弹窗)\n document.addEventListener(\"click\", this.onOpenSettings);\n window.addEventListener(\"resize\", this.onWindowResize.bind(this));\n ((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.toggleLayOut(\"MESSAGE\");\n // if(this.props.core._zimManager && )\n }\n componentDidUpdate(preProps, preState) {\n if ((preState.notificationList.length > 0 &&\n this.state.notificationList.length > 0 &&\n preState.notificationList[preState.notificationList.length - 1]\n .messageID !==\n this.state.notificationList[this.state.notificationList.length - 1]\n .messageID) ||\n (preState.notificationList.length === 0 &&\n this.state.notificationList.length > 0)) {\n this.notifyTimer && clearTimeout(this.notifyTimer);\n this.notifyTimer = setTimeout(() => {\n this.setState({\n notificationList: [],\n });\n }, 3000);\n }\n if (preState.layout !== this.state.layout ||\n preState.isScreenSharingBySelf !== this.state.isScreenSharingBySelf ||\n preState.isZegoWhiteboardSharing !== this.state.isZegoWhiteboardSharing) {\n this.computeByResize();\n }\n if (preState.videoShowNumber !== this.state.videoShowNumber) {\n if (preState.zegoCloudUserList === this.state.zegoCloudUserList) {\n this.userUpdateCallBack();\n }\n }\n }\n componentWillUnmount() {\n document.removeEventListener(\"click\", this.onOpenSettings);\n window.removeEventListener(\"resize\", this.onWindowResize.bind(this));\n this.state.isScreenSharingBySelf && this.closeScreenSharing();\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n }\n initSDK() {\n return __awaiter(this, void 0, void 0, function* () {\n this.props.core.onNetworkStatusQuality((roomID, level) => {\n this.setState({\n isNetworkPoor: level > 2,\n });\n });\n this.props.core.onNetworkStatus((roomID, type, status) => {\n if (status === \"DISCONNECTED\" && type === \"ROOM\") {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n this.leaveRoom();\n }\n else if (status === \"CONNECTING\" && type !== \"STREAM\") {\n this.setState({\n connecting: true,\n });\n }\n else {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n }\n if (type === \"STREAM\" && status === \"CONNECTED\") {\n // 推流成功，开始混流\n }\n });\n this.props.core.onRemoteUserUpdate((roomID, updateType, userList, allUsers) => {\n var _a;\n let notificationList = [];\n if ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showUserJoinAndLeave) {\n userList.forEach((u) => {\n notificationList.push({\n content: u.userName +\n \" \" +\n (updateType === \"ADD\" ? \"enter\" : \"quit\") +\n \" the room\",\n type: \"USER\",\n userName: u.userName,\n messageID: (0,_util__WEBPACK_IMPORTED_MODULE_7__.randomNumber)(5),\n });\n });\n }\n // 当房间只剩自己的时候，自动离开房间\n if (updateType === \"DELETE\") {\n if (this.props.core._config.autoLeaveRoomWhenOnlySelfInRoom &&\n allUsers.length === 0) {\n this.leaveRoom();\n return;\n }\n }\n this.setState((state) => {\n return {\n notificationList: [...state.notificationList, ...notificationList],\n };\n });\n this.computeByResize();\n });\n this.props.core.onRoomMessageUpdate((roomID, messageList) => {\n this.setState((state) => {\n var _a;\n let lowerLeftNotification = [];\n if (this.state.layOutStatus !== \"MESSAGE\" &&\n ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showTextChat)) {\n lowerLeftNotification = [\n ...state.notificationList,\n ...messageList.map((m) => {\n return {\n content: m.message,\n type: \"MSG\",\n userName: m.fromUser.userName,\n messageID: m.messageID,\n };\n }),\n ];\n }\n return {\n messageList: [...state.messageList, ...messageList],\n notificationList: lowerLeftNotification,\n haveUnReadMsg: this.state.layOutStatus !== \"MESSAGE\",\n };\n });\n });\n this.props.core.subscribeUserList((userList) => {\n this.userUpdateCallBack();\n if (this.isCDNLive) {\n // CDN拉流最大限制6条，超过限制就不拉了\n let userListCopy = JSON.parse(JSON.stringify(userList));\n const userNum = userListCopy.filter((user) => user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")).length;\n let limitNum = this.state.screenSharingUserList.length > 0 ? 5 : 6;\n if ((0,_util__WEBPACK_IMPORTED_MODULE_7__.isSafari)()) {\n limitNum = 1;\n }\n if (userNum > limitNum) {\n let i = 0;\n let targetUsers = userListCopy\n .reverse()\n .map((user) => {\n if (user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")) {\n if (i >= limitNum) {\n user.streamList = [];\n }\n else {\n i++;\n }\n }\n return user;\n });\n this.setState({\n zegoCloudUserList: targetUsers.reverse(),\n });\n if ((0,_util__WEBPACK_IMPORTED_MODULE_7__.isSafari)() && this.notSupportMultipleVideoNotice === 0) {\n this.notSupportMultipleVideoNotice = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Your current browser does not support the display of multiple video screens during the live streaming.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n return;\n }\n }\n this.setState({\n zegoCloudUserList: userList,\n });\n });\n this.props.core.onRoomLiveStateUpdate((res) => {\n this.setState((preState) => {\n return {\n liveStatus: res,\n liveCountdown: preState.liveCountdown === -1 || preState.liveCountdown === 0\n ? res === \"1\"\n ? 0\n : -1\n : preState.liveCountdown,\n };\n });\n });\n this.props.core.onRoomMixingStateUpdate((isMixing) => {\n this.setState({\n isMixing,\n });\n });\n this.props.core.subscribeScreenStream((userList) => {\n if (this.isCDNLive &&\n (0,_util__WEBPACK_IMPORTED_MODULE_7__.isSafari)() &&\n this.state.zegoCloudUserList.filter((user) => user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")).length > 0) {\n this.setState({ screenSharingUserList: [] }, () => {\n this.computeByResize();\n });\n }\n else {\n this.setState({ screenSharingUserList: userList }, () => {\n this.computeByResize();\n });\n }\n });\n this.props.core.subscribeWhiteBoard((superBoardView) => {\n // 有变化才设置，否则不管，防止多个白板时被覆盖\n if ((!this.state.zegoSuperBoardView && superBoardView) ||\n (this.state.zegoSuperBoardView && !superBoardView)) {\n this.setState({\n zegoSuperBoardView: superBoardView,\n isZegoWhiteboardSharing: !!superBoardView,\n }, () => {\n this.computeByResize();\n });\n }\n });\n this.props.core.onSoundLevelUpdate((soundLevelList) => {\n let list = {};\n soundLevelList.forEach((s) => {\n let userId = s.streamID.split(\"_\")[1];\n if (list[userId]) {\n list[userId][s.streamID] = Math.floor(s.soundLevel);\n }\n else {\n list[userId] = {\n [s.streamID]: Math.floor(s.soundLevel),\n };\n }\n });\n this.setState({\n soundLevel: list,\n });\n });\n this.props.core.onScreenSharingEnded((stream) => {\n if (stream === this.state.screenSharingStream) {\n this.closeScreenSharing();\n }\n });\n this.props.core.onCoreError((code, msg) => {\n if (code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportStandardLive ||\n code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportCDNLive) {\n if (this.showNotSupported)\n return;\n this.showNotSupported = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"The service is not available, please contact the live streaming service provider to resolve.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n });\n // 监听呼叫邀请离开房间的通知\n this.props.core._zimManager &&\n this.props.core._zimManager.notifyLeaveRoom(() => {\n this.leaveRoom();\n });\n // 监听远端控制摄像头麦克风\n this.props.core.onChangeYourDeviceStatus((type, status, fromUser) => __awaiter(this, void 0, void 0, function* () {\n if (type === \"Camera\" && status === \"CLOSE\" && this.state.cameraOpen) {\n yield this.toggleCamera();\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n if (type === \"Microphone\" && status === \"CLOSE\" && this.state.micOpen) {\n yield this.toggleMic();\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n }));\n this.props.core.onKickedOutRoom(() => {\n this.leaveRoom(true);\n });\n const logInRsp = yield this.props.core.enterRoom();\n let massage = \"\";\n if (logInRsp === 0) {\n this.createStream();\n return;\n }\n else if (logInRsp === 1002034) {\n // 登录房间的用户数超过该房间配置的最大用户数量限制（测试环境下默认房间最大用户数为 50，正式环境无限制）。\n massage =\n \"Failed to join the room, the number of people in the room has reached the maximum.(2 people)\";\n }\n else if ([1002031, 1002053].includes(logInRsp)) {\n //登录房间超时，可能是由于网络原因导致。\n massage =\n \"There's something wrong with your network. Please check it and try again.\";\n }\n else if ([1102018, 1102016, 1102020].includes(logInRsp)) {\n // 登录 token 错误，\n massage = \"Failed to join the room, token authentication error.\";\n }\n else if (1002056 === logInRsp) {\n // 用户重复进行登录。\n massage =\n \"You are on a call in another room, please leave that room first.\";\n }\n else {\n massage =\n \"Failed to join the room, please try again.(error code:\" +\n logInRsp +\n \")\";\n }\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Login room Failed\",\n contentText: massage,\n okText: \"OK\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n });\n }\n initInRoomInviteMgListener() {\n var _a, _b, _c, _d, _e, _f;\n // 收到邀请上麦的通知\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.notifyInviteToCoHost((inviterName) => {\n this.inviteModelRoot = (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Invitation\",\n contentText: \"The host invites you to have a connection.\",\n okText: \"Confirm\",\n cancelText: \"Disagree\",\n onOk: () => __awaiter(this, void 0, void 0, function* () {\n var _a;\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceAcceptInvitation();\n // TODO 角色变更，更新config，开始推流,\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }),\n onCancel: () => {\n var _a;\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceRefuseInvitation();\n },\n countdown: 60,\n }, document.querySelector(\".zego_model_parent\"));\n });\n (_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.notifyInviteToCoHostRefused((reason, user) => {\n if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Disagree) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${user.inviteeName} disagreed with the invitation.`,\n });\n }\n else if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Busy) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"Invitation has been sent.\",\n });\n }\n });\n (_c = this.props.core._zimManager) === null || _c === void 0 ? void 0 : _c._inRoomInviteMg.notifyRemoveCoHost(() => {\n // Cohost 变成 Audience，停止推流\n this.cohostToBeAudience();\n });\n (_d = this.props.core._zimManager) === null || _d === void 0 ? void 0 : _d._inRoomInviteMg.notifyRequestCoHost((inviter, state) => {\n //收到观众连麦通知，0 取消|超时， 1 申请\n // 左侧通知\n if (state === 1) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${inviter.userName} is requesting a connection with you.`,\n });\n }\n // 设置红点\n if (state === 1) {\n this.state.unreadInviteList.add(inviter.userID);\n }\n else {\n this.state.unreadInviteList.delete(inviter.userID);\n }\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n // 设置观众状态\n this.updateUserRequestCohostState(inviter.userID, !!state);\n });\n (_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.notifyHostRespondRequestCohost((respond) => __awaiter(this, void 0, void 0, function* () {\n var _g;\n if (respond === 0) {\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }\n else if (respond === 1) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The host has rejected your request.\",\n });\n }\n else if (respond === 2) {\n (_g = this.inviteModelRoot) === null || _g === void 0 ? void 0 : _g.unmount();\n }\n this.setState({\n isRequestingCohost: false,\n });\n }));\n // 观众的连麦申请超时（观众端）\n (_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.notifyRequestCohostTimeout(() => {\n this.setState({\n isRequestingCohost: false,\n });\n });\n }\n createStream() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.props.core._config.turnOnCameraWhenJoining &&\n !this.props.core._config.turnOnMicrophoneWhenJoining &&\n !this.props.core._config.showMyCameraToggleButton &&\n !this.props.core._config.showMyMicrophoneToggleButton) {\n return false;\n }\n if (!this.props.core.status.videoRefuse ||\n !this.props.core.status.audioRefuse) {\n try {\n const solution = (0,_util__WEBPACK_IMPORTED_MODULE_7__.getVideoResolution)(this.state.selectVideoResolution);\n const localStream = yield this.props.core.createStream({\n camera: Object.assign({ video: !this.props.core.status.videoRefuse, audio: !this.props.core.status.audioRefuse, videoInput: this.state.selectCamera, audioInput: this.state.selectMic, videoQuality: 4 }, solution),\n });\n this.props.core.enableVideoCaptureDevice(localStream, !!this.props.core._config.turnOnCameraWhenJoining);\n this.props.core.muteMicrophone(!this.props.core._config.turnOnMicrophoneWhenJoining);\n this.setState({\n localStream,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n });\n const extraInfo = JSON.stringify({\n isCameraOn: !!this.props.core._config.turnOnCameraWhenJoining,\n isMicrophoneOn: this.props.core._config.turnOnMicrophoneWhenJoining,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n });\n try {\n const res = this.props.core.publishLocalStream(localStream, \"main\", extraInfo);\n if (res !== false) {\n this.localStreamID = res;\n }\n }\n catch (error) {\n // 推流失败就销毁创建的流\n console.error(\"【ZEGOCLOUD】publishStream failed:\", error);\n this.props.core.destroyStream(localStream);\n this.setState({\n localStream: null,\n });\n return false;\n }\n return true;\n }\n catch (error) {\n console.error(\"【ZEGOCLOUD】createStream or publishLocalStream failed,Reason: \", JSON.stringify(error));\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103065 || (error === null || error === void 0 ? void 0 : error.code) === 1103061) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The audio and video equipment is being occupied by another application.\",\n });\n }\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103064) {\n this.props.core.status.videoRefuse = true;\n this.props.core.status.audioRefuse = true;\n this.setState({\n cameraOpen: false,\n micOpen: false,\n });\n }\n return false;\n }\n }\n else {\n return false;\n }\n });\n }\n stopPublish() {\n try {\n this.localStreamID &&\n this.props.core.stopPublishingStream(this.localStreamID);\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.setState({\n localStream: null,\n });\n this.localStreamID = \"\";\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleMic() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.audioRefuse) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Equipment authorization\",\n contentText: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n return;\n }\n if (this.micStatus === -1)\n return;\n this.micStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getAudioTracks().length > 0) {\n result = yield this.props.core.muteMicrophone(this.state.micOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: this.state.cameraOpen,\n isMicrophoneOn: !this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.micStatus = !this.state.micOpen ? 1 : 0;\n if (result) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The microphone is \" + (this.micStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n micOpen: !!this.micStatus,\n }, () => {\n this.computeByResize(this.state.cameraOpen || this.state.micOpen);\n });\n }\n return !!result;\n });\n }\n toggleCamera() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.videoRefuse) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Equipment authorization\",\n contentText: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n return Promise.resolve(false);\n }\n if (this.cameraStatus === -1)\n return Promise.resolve(false);\n this.cameraStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getVideoTracks().length > 0) {\n result = yield this.props.core.enableVideoCaptureDevice(this.state.localStream, !this.state.cameraOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: !this.state.cameraOpen,\n isMicrophoneOn: this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.cameraStatus = !this.state.cameraOpen ? 1 : 0;\n if (result) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: \"The camera is \" + (this.cameraStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n cameraOpen: !!this.cameraStatus,\n }, () => {\n this.computeByResize(this.state.cameraOpen || this.state.micOpen);\n });\n }\n return !!result;\n });\n }\n toggleScreenSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isScreenSharingBySelf) {\n this.closeScreenSharing();\n }\n else {\n this.createScreenSharing();\n }\n });\n }\n createScreenSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isZegoWhiteboardSharing)\n return;\n if (this.state.screenSharingUserList.length > 0) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${this.state.screenSharingUserList[0].userName} is presenting now. You cannot share your screen.`,\n });\n return;\n }\n if (this.isCreatingScreenSharing)\n return;\n this.isCreatingScreenSharing = true;\n try {\n const screenSharingStream = yield this.props.core.createStream({\n screen: {\n videoQuality: 2,\n bitRate: 1500,\n frameRate: 15,\n audio: !(0,_util__WEBPACK_IMPORTED_MODULE_7__.isFireFox)(),\n },\n });\n const streamID = this.props.core.publishLocalStream(screenSharingStream, \"screensharing\", JSON.stringify({\n isCameraOn: true,\n isMicrophoneOn: true,\n hasVideo: screenSharingStream.getVideoTracks().length > 0,\n hasAudio: screenSharingStream.getAudioTracks()[0].enabled,\n }));\n streamID && (this.screenSharingStreamID = streamID);\n this.setState({\n isScreenSharingBySelf: true,\n screenSharingStream: screenSharingStream,\n });\n }\n catch (error) {\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103043) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Your browser does not support screen sharing.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n else if ((error === null || error === void 0 ? void 0 : error.code) === 1103010 && (error === null || error === void 0 ? void 0 : error.msg.includes(\"Permission\"))) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Grant access to share your screen\",\n contentText: \"Your system does not have access to share a screen from the browser. Please grant access to share your screen on your system settings.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n else if ((error === null || error === void 0 ? void 0 : error.code) !== 1103042) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `Failed to present your screen. error code: ${(error === null || error === void 0 ? void 0 : error.code) || -1}`,\n });\n }\n }\n this.isCreatingScreenSharing = false;\n });\n }\n closeScreenSharing() {\n try {\n this.screenSharingStreamID &&\n this.props.core.stopPublishingStream(this.screenSharingStreamID);\n this.state.screenSharingStream &&\n this.props.core.destroyStream(this.state.screenSharingStream);\n this.setState({\n isScreenSharingBySelf: false,\n });\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleWhiteboardSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.getScreenSharingUser.length > 0)\n return;\n if (this.state.zegoSuperBoardView) {\n this.closeWhiteboardSharing();\n }\n else if (!this.state.isZegoWhiteboardSharing) {\n this.createWhiteboardSharing();\n }\n });\n }\n createWhiteboardSharing() {\n var _a;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length > 0) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${this.state.screenSharingUserList[0].userName} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n else if (this.state.zegoSuperBoardView) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `${(_a = this.state.zegoSuperBoardView.getCurrentSuperBoardSubView()) === null || _a === void 0 ? void 0 : _a.getModel.name} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n if (this.isCreatingWhiteboardSharing)\n return;\n this.isCreatingWhiteboardSharing = true;\n this.setState({ isZegoWhiteboardSharing: true });\n });\n }\n closeWhiteboardSharing() {\n try {\n this.state.zegoSuperBoardView &&\n this.props.core.destroyAndStopPublishWhiteboard();\n this.setState({\n isZegoWhiteboardSharing: false,\n zegoSuperBoardView: null,\n });\n this.isCreatingWhiteboardSharing = false;\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleLayOut(layOutStatus) {\n this.setState((state) => {\n return {\n layOutStatus: state.layOutStatus === layOutStatus ? \"ONE_VIDEO\" : layOutStatus,\n };\n }, () => {\n this.computeByResize();\n });\n }\n sendMessage(msg) {\n return __awaiter(this, void 0, void 0, function* () {\n let messageID = (0,_util__WEBPACK_IMPORTED_MODULE_7__.randomNumber)(5);\n this.setState((state) => {\n return {\n messageList: [\n ...state.messageList,\n {\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n message: msg,\n sendTime: Date.now(),\n messageID,\n status: \"SENDING\",\n },\n ],\n };\n });\n let resp = {};\n try {\n resp = yield this.props.core.sendRoomMessage(msg);\n }\n catch (err) {\n console.error(\"【ZEGOCLOUD】sendMessage failed!\", JSON.stringify(err));\n }\n this.setState((state) => {\n const _messageList = state.messageList.map((msg) => {\n if (msg.messageID === messageID) {\n msg.status = (resp === null || resp === void 0 ? void 0 : resp.errorCode) === 0 ? \"SENDED\" : \"FAILED\";\n }\n return msg;\n });\n console.log(_messageList);\n return {\n messageList: _messageList,\n };\n });\n });\n }\n openSettings() {\n this.setState({\n showSettings: !this.state.showSettings,\n });\n }\n handleSetting() {\n this.setState({\n showZegoSettings: true,\n });\n }\n handleLeave() {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Leave the room\",\n contentText: \"Are you sure to leave the room?\",\n okText: \"Confirm\",\n cancelText: \"Cancel\",\n onOk: () => {\n var _a, _b;\n if (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) !== _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n this.props.core._config.turnOnCameraWhenJoining =\n this.state.cameraOpen;\n this.props.core._config.turnOnMicrophoneWhenJoining =\n this.state.micOpen;\n }\n this.props.core.status.micDeviceID = this.state.selectMic;\n this.props.core.status.cameraDeviceID = this.state.selectCamera;\n this.props.core.status.speakerDeviceID = this.state.selectSpeaker;\n this.props.core.status.videoResolution =\n this.state.selectVideoResolution;\n this.leaveRoom();\n },\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n leaveRoom(isKickedOut = false) {\n var _a, _b;\n (_b = (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg) === null || _b === void 0 ? void 0 : _b.audienceCancelRequest();\n this.state.isScreenSharingBySelf && this.closeScreenSharing();\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom(isKickedOut);\n }\n get showSelf() {\n if (this.props.core._config.showNonVideoUser) {\n return true;\n }\n else {\n if (this.props.core._config.showOnlyAudioUser) {\n return (this.localStreamID && (this.state.micOpen || this.state.cameraOpen));\n }\n else {\n return this.localStreamID && this.state.cameraOpen;\n }\n }\n }\n computeByResize(justSetNum = false) {\n return __awaiter(this, void 0, void 0, function* () {\n const width = Math.max(this.props.core._config.container.clientWidth, 640);\n const height = Math.max(this.props.core._config.container.clientHeight, 328);\n let videoShowNumber = 0, gridRowNumber = 0;\n if (this.getScreenSharingUser.length > 0 ||\n this.state.isZegoWhiteboardSharing) {\n //Screen Sidebar\n const videWrapHight = height -\n (this.showHeader ? 64 : 16) -\n 84 -\n (this.state.isZegoWhiteboardSharing ? 0 : 38);\n const n = parseInt(String(videWrapHight / 124)) || 1;\n videoShowNumber = Math.min(n * 124 + (n - 1) * 10 <= videWrapHight ? n : n - 1 || 1, 5);\n !justSetNum && (yield this.props.core.setSidebarLayOut(false));\n if (this.fullScreen) {\n this.setState({\n videoShowNumber: 0,\n });\n yield this.props.core.setMaxScreenNum(0);\n }\n else {\n this.setState({\n videoShowNumber: videoShowNumber,\n });\n yield this.props.core.setMaxScreenNum(this.showSelf ? videoShowNumber - 1 : videoShowNumber);\n }\n return;\n }\n if (this.state.layout === \"Sidebar\") {\n // Sidebar\n const videWrapHight = height - (this.showHeader ? 64 : 16) - 84;\n const n = parseInt(String(videWrapHight / 124)) || 1;\n videoShowNumber = Math.min(n * 124 + (n - 1) * 10 <= videWrapHight ? n : n - 1 || 1, 5);\n const sidebarEnabled = this.state.cameraOpen || this.state.micOpen ? !this.localUserPin : true;\n !justSetNum && (yield this.props.core.setSidebarLayOut(sidebarEnabled));\n this.setState({\n videoShowNumber: videoShowNumber,\n });\n yield this.props.core.setMaxScreenNum(this.showSelf ? videoShowNumber : videoShowNumber + 1);\n return;\n }\n if (this.state.layout === \"Grid\" || this.state.layout === \"Auto\") {\n if (height < 406 - (this.showHeader ? 16 : 64)) {\n const videoWrapWidth = width - 32 - (this.state.layOutStatus === \"ONE_VIDEO\" ? 0 : 350);\n const n = parseInt(String(videoWrapWidth / 160));\n videoShowNumber = Math.min(n * 160 + (n - 1) * 10 <= videoWrapWidth ? n : n - 1, 10);\n gridRowNumber = 1;\n }\n else if (height < 540 - (this.showHeader ? 16 : 64)) {\n const videoWrapWidth = width - 32 - (this.state.layOutStatus === \"ONE_VIDEO\" ? 0 : 350);\n const n = parseInt(String(videoWrapWidth / 124));\n videoShowNumber = Math.min(n * 124 + (n - 1) * 10 <= videoWrapWidth ? 2 * n : 2 * (n - 1), 10);\n gridRowNumber = 2;\n }\n else {\n videoShowNumber = 9;\n gridRowNumber = 3;\n }\n !justSetNum && (yield this.props.core.setSidebarLayOut(false));\n this.setState({\n videoShowNumber: videoShowNumber,\n gridRowNumber: gridRowNumber,\n });\n yield this.props.core.setMaxScreenNum(this.showSelf ? videoShowNumber - 1 : videoShowNumber);\n return;\n }\n });\n }\n showLayoutSettings(show) {\n this.setState({\n showLayoutSettingsModel: show,\n });\n }\n changeLayout(type) {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isLayoutChanging)\n return;\n return new Promise((resolve, reject) => {\n this.userUpdateCallBack = () => {\n this.setState({\n isLayoutChanging: false,\n });\n resolve(true);\n };\n if (type === \"Grid\" || type === \"Auto\") {\n this.props.core.setPin();\n this.localUserPin = false;\n }\n this.setState({\n isLayoutChanging: true,\n layout: type,\n });\n this.props.core.setSidebarLayOut(type === \"Sidebar\");\n setTimeout(() => {\n this.setState({\n isLayoutChanging: false,\n });\n resolve(false);\n }, 5000);\n });\n });\n }\n getAllUser() {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n pin: this.localUserPin,\n avatar: this.props.core._expressConfig.avatar,\n streamList: [\n {\n media: this.state.localStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: this.state.micOpen ? \"OPEN\" : \"MUTE\",\n cameraStatus: this.state.cameraOpen ? \"OPEN\" : \"MUTE\",\n state: \"PLAYING\",\n streamID: this.localStreamID,\n },\n ],\n },\n ...this.state.zegoCloudUserList,\n ];\n }\n getShownUser(forceShowNonVideoUser = false) {\n const shownUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser && !forceShowNonVideoUser) {\n if (item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS)) {\n if (item.streamList[0].cameraStatus === \"OPEN\") {\n return true;\n }\n else if (this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n }\n else {\n return false;\n }\n }\n else {\n return true;\n }\n });\n return shownUser;\n }\n get getScreenSharingUser() {\n if (this.state.isScreenSharingBySelf) {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n avatar: this.props.core._expressConfig.avatar,\n pin: false,\n streamList: [\n {\n media: this.state.screenSharingStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: \"OPEN\",\n cameraStatus: \"OPEN\",\n state: \"PLAYING\",\n streamID: this.screenSharingStreamID,\n },\n ],\n },\n ];\n }\n else {\n return this.state.screenSharingUserList;\n }\n }\n getHiddenUser() {\n const hiddenUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser &&\n item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS) &&\n item.streamList[0].cameraStatus !== \"OPEN\" &&\n !this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n });\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: hiddenUser.map((user) => {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_18__[\"default\"], { muted: user.userID === this.props.core._expressConfig.userID, userInfo: user }, user.userID + \"_hiddenAudio\"));\n }) }));\n }\n get showScreenShareBottomTip() {\n var _a, _b, _c;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.state.liveStatus !== \"1\") {\n return false;\n }\n else {\n return this.getScreenSharingUser.length > 0;\n }\n }\n getLayoutScreen() {\n var _a, _b, _c;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming) {\n const hasVideo = [\n ...this.getAllUser(),\n ...this.getScreenSharingUser,\n ].some((u) => {\n if (u.streamList) {\n return u.streamList.some((s) => {\n return s.cameraStatus === \"OPEN\" || s.micStatus === \"OPEN\";\n });\n }\n return false;\n });\n if (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n if (this.state.liveStatus !== \"1\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveNotStart }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"The Live has not started yet\" })] })));\n }\n else if (hasVideo &&\n this.props.core._config.scenario.config.enableVideoMixing &&\n this.props.core._config.scenario.config.role === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_19__.ZegoMixPlayer, { userInfo: this.props.core.mixUser, isPureAudio: this.props.core.zum.isPureAudio, isPureVideo: this.props.core.zum.isPureVideo }));\n }\n }\n if (!hasVideo) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].noOneStreaming }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"No one has turned on the camera or microphone yet.\" })] })));\n }\n }\n if (this.getScreenSharingUser.length > 0) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ZegoScreenSharingLayout__WEBPACK_IMPORTED_MODULE_15__.ZegoScreenSharingLayout, { handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, screenSharingUser: this.getScreenSharingUser[0], soundLevel: this.state.soundLevel, handleFullScreen: this.handleFullScreen.bind(this), roomID: this.props.core._expressConfig.roomID }) }));\n }\n if (this.state.isZegoWhiteboardSharing) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ZegoWhiteboardSharingLayout__WEBPACK_IMPORTED_MODULE_16__.ZegoWhiteboardSharingLayout, { handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, soundLevel: this.state.soundLevel, handleFullScreen: this.handleFullScreen.bind(this), roomID: this.props.core._expressConfig.roomID, onShow: (el) => __awaiter(this, void 0, void 0, function* () {\n var _d;\n // console.error(\n // \"【ZEGOCLOUD】onShow\",\n // this.isCreatingWhiteboardSharing,\n // !this.state.zegoSuperBoardView\n // );\n // 主动渲染\n if (this.isCreatingWhiteboardSharing &&\n !this.state.zegoSuperBoardView) {\n try {\n const zegoSuperBoardView = yield this.props.core.createAndPublishWhiteboard(el, this.props.core._expressConfig.userName);\n this.setState({\n zegoSuperBoardView,\n });\n }\n catch (error) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Operation too frequent, failed to load the whiteboard.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n this.isCreatingWhiteboardSharing = false;\n }\n else if (this.state.zegoSuperBoardView) {\n // 被动渲染\n const uniqueID = (_d = this.state.zegoSuperBoardView\n .getCurrentSuperBoardSubView()) === null || _d === void 0 ? void 0 : _d.getModel().uniqueID;\n uniqueID &&\n this.state.zegoSuperBoardView.switchSuperBoardSubView(uniqueID);\n }\n }), onResize: (el) => {\n var _a, _b;\n // 主动渲染\n if (this.state.isZegoWhiteboardSharing && el) {\n try {\n (_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.reloadView();\n }\n catch (error) {\n console.warn(\"【ZEGOCLOUD】onResize\", error);\n }\n }\n }, onclose: () => {\n this.toggleWhiteboardSharing();\n }, onToolChange: (type, fontSize, color) => {\n this.props.core.setWhiteboardToolType(type, fontSize, color);\n }, onFontChange: (font, fontSize, color) => {\n this.props.core.setWhiteboardFont(font, fontSize, color);\n }, zegoSuperBoardView: this.state.zegoSuperBoardView }));\n }\n if ((this.state.layout === \"Auto\" && this.getShownUser().length < 3) ||\n this.getShownUser().length < 2) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoOne2One__WEBPACK_IMPORTED_MODULE_5__.ZegoOne2One, { onLocalStreamPaused: () => __awaiter(this, void 0, void 0, function* () {\n yield this.props.core.enableVideoCaptureDevice(this.state.localStream, !this.state.cameraOpen);\n this.props.core.enableVideoCaptureDevice(this.state.localStream, this.state.cameraOpen);\n }), selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), soundLevel: this.state.soundLevel }));\n }\n if ((this.state.layout === \"Grid\" && this.getShownUser().length > 1) ||\n (this.state.layout === \"Auto\" && this.getShownUser().length > 2)) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoGridLayout__WEBPACK_IMPORTED_MODULE_11__.ZegoGridLayout, { userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, gridRowNumber: this.state.gridRowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, handleMenuItem: this.handleMenuItem.bind(this), soundLevel: this.state.soundLevel }));\n }\n if (this.state.layout === \"Sidebar\" && this.getShownUser().length > 1) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoSidebarLayout__WEBPACK_IMPORTED_MODULE_12__.ZegoSidebarLayout, { handleMenuItem: this.handleMenuItem.bind(this), userList: this.getShownUser(), videoShowNumber: this.state.videoShowNumber, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, soundLevel: this.state.soundLevel }));\n }\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {});\n }\n handleMenuItem(type, user) {\n this.menuOptions[type](user);\n }\n cohostToBeAudience() {\n this.stopPublish();\n this.closeScreenSharing();\n this.setState({\n showLayoutSettings: false,\n showSettings: false,\n });\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n handleRequestCohost() {\n var _a, _b;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isRequestingCohost) {\n yield ((_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceCancelRequest());\n this.setState({\n isRequestingCohost: false,\n });\n }\n else {\n const res = yield ((_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.requestCohost());\n if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `You've applied for connection, please wait for the host's confirmation.`,\n });\n this.setState({\n isRequestingCohost: true,\n });\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 1) {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `The host has left the room.`,\n });\n }\n else {\n (0,_components_zegoToast__WEBPACK_IMPORTED_MODULE_10__.ZegoToast)({\n content: `Failed to send application, please try again.`,\n });\n }\n }\n });\n }\n updateUserRequestCohostState(userID, state) {\n const userList = this.state.zegoCloudUserList.map((user) => {\n if (user.userID === userID) {\n user.requestCohost = state ? Date.now() : undefined;\n }\n return user;\n });\n this.setState({\n zegoCloudUserList: userList,\n });\n }\n handleFullScreen(fullScreen) {\n this.fullScreen = fullScreen;\n this.computeByResize();\n }\n setLive() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_9__.ZegoModelShow)({\n header: \"Stop broadcast\",\n contentText: \"Are you sure to stop broadcasting?\",\n okText: \"Stop\",\n cancelText: \"Cancel\",\n onOk: () => __awaiter(this, void 0, void 0, function* () {\n // stop live\n yield this.props.core.setLive(\"stop\");\n this.setState({\n liveCountdown: -1,\n });\n }),\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n else if (this.state.liveCountdown === -1) {\n this.setState({\n liveCountdown: 3,\n }, () => {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n });\n }\n });\n }\n liveCountdownTimer() {\n this.setState((preState) => {\n return {\n liveCountdown: preState.liveCountdown - 1,\n };\n }, () => __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n yield this.props.core.setLive(\"live\");\n }\n else {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n }\n }));\n }\n setAllSinkId(speakerId) {\n const room = document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`);\n room === null || room === void 0 ? void 0 : room.querySelectorAll(\"video\").forEach((video) => {\n var _a;\n (_a = video === null || video === void 0 ? void 0 : video.setSinkId) === null || _a === void 0 ? void 0 : _a.call(video, speakerId || \"\");\n });\n room === null || room === void 0 ? void 0 : room.querySelectorAll(\"audio\").forEach((audio) => {\n var _a;\n (_a = audio === null || audio === void 0 ? void 0 : audio.setSinkId) === null || _a === void 0 ? void 0 : _a.call(audio, speakerId || \"\");\n });\n }\n showTurnOffMicrophoneButton(user) {\n var _a, _b, _c, _d;\n if (!this.props.core._config.showTurnOffRemoteMicrophoneButton)\n return false;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (user.userID === this.props.core._expressConfig.userID &&\n ((_d = (_c = this.props.core._config.scenario) === null || _c === void 0 ? void 0 : _c.config) === null || _d === void 0 ? void 0 : _d.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n showTurnOffCameraButton(user) {\n var _a, _b, _c, _d;\n if (!this.props.core._config.showTurnOffRemoteCameraButton)\n return false;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (user.userID === this.props.core._expressConfig.userID &&\n ((_d = (_c = this.props.core._config.scenario) === null || _c === void 0 ? void 0 : _c.config) === null || _d === void 0 ? void 0 : _d.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n showRemoveButton(user) {\n var _a, _b;\n if (!this.props.core._config.showRemoveUserButton)\n return false;\n if (this.props.core.isHost(user.userID))\n return false;\n return (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host &&\n (user.userID !== this.props.core._expressConfig.userID ||\n user.streamList.length === 0));\n }\n isShownPin(user) {\n var _a;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.OneONoneCall) {\n return false;\n }\n let showPinButton = !!this.props.core._config.showPinButton && this.getShownUser().length > 1;\n return (showPinButton &&\n !!(this.props.core._config.showNonVideoUser ||\n (user.streamList &&\n user.streamList[0] &&\n user.streamList[0].cameraStatus === \"OPEN\") ||\n (user.streamList &&\n user.streamList[0] &&\n user.streamList[0].micStatus === \"OPEN\" &&\n !!this.props.core._config.showOnlyAudioUser)));\n }\n showRemoveCohostButton(user) {\n if (!this.props.core._config.showRemoveCohostButton)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n if (this.props.core.isHost(this.props.core._expressConfig.userID)) {\n return user.userID !== this.props.core._expressConfig.userID;\n }\n else {\n return user.userID === this.props.core._expressConfig.userID;\n }\n }\n showMenu(user) {\n return (this.isShownPin(user) ||\n this.showRemoveButton(user) ||\n this.showTurnOffCameraButton(user) ||\n this.showTurnOffMicrophoneButton(user) ||\n this.showRemoveCohostButton(user));\n }\n initLayout() {\n switch (this.props.core._config.rightPanelExpandedType) {\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.None:\n return \"ONE_VIDEO\";\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.RoomDetails:\n return this.props.core._config.showRoomDetailsButton\n ? \"INVITE\"\n : \"ONE_VIDEO\";\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.RoomMembers:\n return this.props.core._config.showUserList ? \"USER_LIST\" : \"ONE_VIDEO\";\n case _model__WEBPACK_IMPORTED_MODULE_2__.RightPanelExpandedType.RoomMessages:\n return this.props.core._config.showTextChat ? \"MESSAGE\" : \"ONE_VIDEO\";\n default:\n return \"ONE_VIDEO\";\n }\n }\n render() {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;\n const startIndex = this.state.notificationList.length < 4\n ? 0\n : this.state.notificationList.length - 2;\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_context_showManage__WEBPACK_IMPORTED_MODULE_17__[\"default\"].Provider, Object.assign({ value: {\n showPinButton: !!this.props.core._config.showPinButton &&\n this.getShownUser().length > 1,\n liveStatus: this.state.liveStatus,\n showTurnOffMicrophoneButton: this.showTurnOffMicrophoneButton.bind(this),\n showTurnOffCameraButton: this.showTurnOffCameraButton.bind(this),\n showRemoveButton: this.showRemoveButton.bind(this),\n isShownPin: this.isShownPin.bind(this),\n showRemoveCohostButton: this.showRemoveCohostButton.bind(this),\n speakerId: this.state.selectSpeaker,\n whiteboard_page: ((_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.getCurrentPage()) || 1,\n whiteboard_toolType: ((_c = this.props.core.zegoSuperBoard) === null || _c === void 0 ? void 0 : _c.getToolType()) || 0,\n whiteboard_fontSize: ((_d = this.props.core.zegoSuperBoard) === null || _d === void 0 ? void 0 : _d.getFontSize()) || 0,\n whiteboard_brushSize: ((_e = this.props.core.zegoSuperBoard) === null || _e === void 0 ? void 0 : _e.getBrushSize()) || 0,\n whiteboard_brushColor: ((_f = this.props.core.zegoSuperBoard) === null || _f === void 0 ? void 0 : _f.getBrushColor()) || \"\",\n whiteboard_isFontBold: (_g = this.props.core.zegoSuperBoard) === null || _g === void 0 ? void 0 : _g.isFontBold(),\n whiteboard_isFontItalic: (_h = this.props.core.zegoSuperBoard) === null || _h === void 0 ? void 0 : _h.isFontItalic(),\n whiteboard_showAddImage: (_j = this.props.core._config.whiteboardConfig) === null || _j === void 0 ? void 0 : _j.showAddImageButton,\n userInfo: { userID: this.props.core._expressConfig.userID },\n whiteboard_showCreateClose: (_k = this.props.core._config.whiteboardConfig) === null || _k === void 0 ? void 0 : _k.showCreateAndCloseButton,\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom} zego_model_parent` }, { children: [this.showHeader && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].header }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].headerLeft }, { children: [((_l = this.props.core._config.branding) === null || _l === void 0 ? void 0 : _l.logoURL) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].logo, src: (_m = this.props.core._config.branding) === null || _m === void 0 ? void 0 : _m.logoURL, alt: \"logo\" })), this.props.core._config.showRoomTimer &&\n ((_p = (_o = this.props.core._config) === null || _o === void 0 ? void 0 : _o.scenario) === null || _p === void 0 ? void 0 : _p.mode) !==\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_4__.ZegoTimer, {}), ((_q = this.props.core._config.scenario) === null || _q === void 0 ? void 0 : _q.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n (this.state.liveCountdown === 0 ||\n this.state.liveStatus === \"1\") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveState }, { children: \"Live\" })))] })), ((_r = this.props.core._config.scenario) === null || _r === void 0 ? void 0 : _r.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_t = (_s = this.props.core._config.scenario) === null || _s === void 0 ? void 0 : _s.config) === null || _t === void 0 ? void 0 : _t.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"button\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLive} ${this.state.liveCountdown === 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLiveEnabled\n : \"\"}`, id: \"ZegoLiveButton\", onClick: () => {\n this.setLive();\n } }, { children: this.state.liveCountdown === 3 ||\n this.state.liveCountdown === -1\n ? \"Go Live\"\n : this.state.liveCountdown === 0\n ? \"Stop broadcast\"\n : \"Start stream...\" })))] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].content, style: { paddingTop: this.showHeader ? 0 : \"16px\" } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].contentLeft }, { children: [this.getLayoutScreen(), this.getHiddenUser(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notify, id: \"zego_left_notify_wrapper\" }, { children: this.state.notificationList\n .slice(startIndex)\n .map((notify, index) => {\n if (notify.type === \"MSG\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h5\", { children: notify.userName }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: notify.content })] }), index));\n }\n else if (notify.type === \"USER\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].nowrap }, { children: notify.content })) }), index));\n }\n else {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].nowrap }, { children: notify.content })) }), index));\n }\n }) })), this.state.isNetworkPoor && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].network }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].contentRight, style: {\n display: this.state.layOutStatus !== \"ONE_VIDEO\" ? \"flex\" : \"none\",\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].listHeader }, { children: [this.state.layOutStatus === \"INVITE\" && \"Room details\", this.state.layOutStatus === \"USER_LIST\" && \"Room members\", this.state.layOutStatus === \"MESSAGE\" && \"Room messages\", (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].listHeaderClose, onClick: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].listContent }, { children: [this.state.layOutStatus === \"INVITE\" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_13__.ZegoRoomInvite, { core: this.props.core })), this.state.layOutStatus === \"USER_LIST\" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoUserList__WEBPACK_IMPORTED_MODULE_14__.ZegoUserList, { core: this.props.core, userList: this.getShownUser(true), selfUserID: this.props.core._expressConfig.userID, handleMenuItem: this.handleMenuItem.bind(this), soundLevel: this.state.soundLevel })), this.state.layOutStatus === \"MESSAGE\" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMessage__WEBPACK_IMPORTED_MODULE_6__.ZegoMessage, { messageList: this.state.messageList, sendMessage: (msg) => {\n this.sendMessage(msg);\n }, selfUserID: this.props.core._expressConfig.userID }))] }))] }))] })), this.showScreenShareBottomTip && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenBottomBar }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenBottomBarLeft }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"p\", { children: this.state.isScreenSharingBySelf\n ? \"You're presenting to everyone\"\n : `${this.state.screenSharingUserList[0].userName} is presenting the screen` })] })), this.state.isScreenSharingBySelf && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenBottomBarRight, onClick: () => {\n this.toggleScreenSharing();\n } }, { children: \"Stop Presenting\" })))] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].footer }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].handlerMiddle }, { children: [this.props.core._config.showMyMicrophoneToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].micButton} ${!this.state.micOpen && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].close}`, onClick: () => {\n this.toggleMic();\n } })), this.props.core._config.showMyCameraToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].cameraButton} ${!this.state.cameraOpen && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].close}`, onClick: () => {\n this.toggleCamera();\n } })), this.props.core._config.showScreenSharingButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenButton} ${this.state.isScreenSharingBySelf && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].sharing} ${this.state.isZegoWhiteboardSharing && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].forbidden}`, onClick: () => {\n this.toggleScreenSharing();\n } })), ((_u = this.props.core._config.plugins) === null || _u === void 0 ? void 0 : _u.ZegoSuperBoardManager) &&\n ((_v = this.props.core._config.whiteboardConfig) === null || _v === void 0 ? void 0 : _v.showCreateAndCloseButton) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].whiteboardButton} ${this.state.isZegoWhiteboardSharing && _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].sharing} ${this.getScreenSharingUser.length > 0 &&\n _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].forbidden}`, onClick: () => {\n this.toggleWhiteboardSharing();\n } })), (this.props.core._config.showAudioVideoSettingsButton ||\n this.props.core._config.showLayoutButton) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ ref: this.moreRef, className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].moreButton, onClick: () => {\n this.openSettings();\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].settingsButtonModel, style: {\n display: this.state.showSettings ? \"block\" : \"none\",\n }, ref: this.settingsRef }, { children: [this.props.core._config.showLayoutButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ onClick: () => this.showLayoutSettings(true) }, { children: \"Change layout\" }))), this.props.core._config.showAudioVideoSettingsButton &&\n this.props.core._config.showLayoutButton && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", {}), this.props.core._config.showAudioVideoSettingsButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ onClick: () => this.handleSetting() }, { children: \"Settings\" })))] })) }))), this.showRequestCohost && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].requestCohostButton} ${this.state.isRequestingCohost\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].cancel\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].active}`, onClick: () => {\n this.handleRequestCohost();\n } })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: ((_w = this.props.core._config.scenario) === null || _w === void 0 ? void 0 : _w.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveLeaveButton\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].leaveButton, onClick: () => {\n this.handleLeave();\n } })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].handlerRight }, { children: [this.props.core._config.showRoomDetailsButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].inviteButton, onClick: () => {\n this.toggleLayOut(\"INVITE\");\n } })), this.props.core._config.showUserList && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].memberButton} ${this.state.unreadInviteList.size > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].msgButtonRed\n : \"\"}`, onClick: () => {\n this.toggleLayOut(\"USER_LIST\");\n } }, { children: this.state.unreadInviteList.size === 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].memberNum }, { children: this.state.zegoCloudUserList.length > 99\n ? \"99+\"\n : this.state.zegoCloudUserList.length + 1 }))) }))), this.props.core._config.showTextChat && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].msgButton} ${this.state.haveUnReadMsg ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].msgButtonRed : \"\"}`, onClick: () => {\n this.setState({\n haveUnReadMsg: false,\n });\n this.toggleLayOut(\"MESSAGE\");\n } }))] }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].reconnect, style: {\n display: this.state.connecting ? \"flex\" : \"none\",\n backgroundColor: this.state.firstLoading ? \"#1C1F2E\" : \"\",\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"p\", { children: this.state.firstLoading\n ? \"Joining Room\"\n : \"There's something wrong with your network. Trying to reconnect...\" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].countDown, style: {\n display: this.state.liveCountdown > 0 ? \"flex\" : \"none\",\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: this.state.liveCountdown }) })), this.state.showLayoutSettingsModel && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsMask }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsWrapper }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsHeader }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"p\", { children: \"Change layout\" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsCloseIcon, onClick: () => this.showLayoutSettings(false) })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsContent }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemRow, onClick: () => this.changeLayout(\"Auto\") }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemIcon} ${this.state.layout === \"Auto\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemChecked\n : \"\"} ${this.state.isLayoutChanging &&\n this.state.layout === \"Auto\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemLoading\n : \"\"}` }), \"Auto\"] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { src: __webpack_require__(/*! ../../../sdkAssets/img_layout_auto@2x.png */ \"./src/sdk/sdkAssets/img_layout_auto@2x.png\"), alt: \"grid layout\" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemRow, onClick: () => this.changeLayout(\"Grid\") }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemIcon} ${this.state.layout === \"Grid\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemChecked\n : \"\"} ${this.state.isLayoutChanging &&\n this.state.layout === \"Grid\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemLoading\n : \"\"}` }), \"Grid\"] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { src: __webpack_require__(/*! ../../../sdkAssets/img_layout_grid@2x.png */ \"./src/sdk/sdkAssets/img_layout_grid@2x.png\"), alt: \"grid layout\" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemRow, onClick: () => this.changeLayout(\"Sidebar\") }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemIcon} ${this.state.layout === \"Sidebar\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemChecked\n : \"\"} ${this.state.isLayoutChanging &&\n this.state.layout === \"Sidebar\"\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layoutSettingsItemLoading\n : \"\"}` }), \"Sidebar\"] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"img\", { src: __webpack_require__(/*! ../../../sdkAssets/img_layout_sidebar@2x.png */ \"./src/sdk/sdkAssets/img_layout_sidebar@2x.png\"), alt: \"Sidebar layout\" })] }))] }))] })) }))), this.state.showZegoSettings && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoSetting__WEBPACK_IMPORTED_MODULE_8__.ZegoSettings, { core: this.props.core, theme: \"black\", initDevices: {\n mic: this.state.selectMic,\n cam: this.state.selectCamera,\n speaker: this.state.selectSpeaker,\n videoResolve: this.state.selectVideoResolution,\n showNonVideoUser: this.state.showNonVideoUser,\n }, closeCallBack: () => {\n this.setState({\n showZegoSettings: false,\n });\n }, onMicChange: (deviceID) => {\n this.setState({\n selectMic: deviceID,\n }, () => {\n if (this.state.localStream) {\n this.props.core.useMicrophoneDevice(this.state.localStream, deviceID);\n }\n });\n }, onCameraChange: (deviceID) => {\n this.setState({\n selectCamera: deviceID,\n }, () => __awaiter(this, void 0, void 0, function* () {\n if (this.state.localStream) {\n yield this.props.core.useCameraDevice(this.state.localStream, deviceID);\n this.setState({\n cameraOpen: true,\n });\n }\n }));\n }, onSpeakerChange: (deviceID) => {\n this.setState({\n selectSpeaker: deviceID,\n }, () => {\n this.setAllSinkId(deviceID);\n });\n }, onVideoResolutionChange: (level) => {\n this.setState({\n selectVideoResolution: level,\n }, () => {\n if (this.state.localStream) {\n const { width, height, bitrate, frameRate } = (0,_util__WEBPACK_IMPORTED_MODULE_7__.getVideoResolution)(level);\n this.props.core.setVideoConfig(this.state.localStream, {\n width,\n height,\n maxBitrate: bitrate,\n frameRate,\n });\n }\n });\n }, onShowNonVideoChange: (selected) => {\n this.props.core._config.showNonVideoUser = selected;\n this.props.core.setShowNonVideo(selected);\n this.setState({\n showNonVideoUser: selected,\n });\n } }))] })) })));\n }\n}\n\n\n//# sourceURL=webpack://zegocloud_client_sdk_web/./src/sdk/view/pages/ZegoRoom/index.tsx?");
|
|
2699
2699
|
|
|
2700
2700
|
/***/ }),
|
|
2701
2701
|
|
|
@@ -2915,7 +2915,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
2915
2915
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
2916
2916
|
|
|
2917
2917
|
"use strict";
|
|
2918
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ZegoRoomMobile\": function() { return /* binding */ ZegoRoomMobile; }\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/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 _model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../model */ \"./src/sdk/model/index.ts\");\n/* harmony import */ var _index_module_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./index.module.scss */ \"./src/sdk/view/pages/ZegoRoomMobile/index.module.scss\");\n/* harmony import */ var _components_zegoOne2One__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/zegoOne2One */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoOne2One.tsx\");\n/* harmony import */ var _components_zegoMessage__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/zegoMessage */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoMessage.tsx\");\n/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../util */ \"./src/sdk/util.ts\");\n/* harmony import */ var _components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/mobile/zegoConfirm */ \"./src/sdk/view/components/mobile/zegoConfirm/index.tsx\");\n/* harmony import */ var _components_zegoUserList__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./components/zegoUserList */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoUserList.tsx\");\n/* harmony import */ var _components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./components/zegoRoomInvite */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoRoomInvite.tsx\");\n/* harmony import */ var _components_ZegoReconnect__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./components/ZegoReconnect */ \"./src/sdk/view/pages/ZegoRoomMobile/components/ZegoReconnect.tsx\");\n/* harmony import */ var _components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/mobile/zegoToast */ \"./src/sdk/view/components/mobile/zegoToast/index.tsx\");\n/* harmony import */ var _components_zegoLayout__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/zegoLayout */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoLayout.tsx\");\n/* harmony import */ var _components_zegoManage__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/zegoManage */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoManage.tsx\");\n/* harmony import */ var _components_zegoGrid__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/zegoGrid */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoGrid.tsx\");\n/* harmony import */ var _components_zegoSidebar__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./components/zegoSidebar */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoSidebar.tsx\");\n/* harmony import */ var _context_showManage__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../context/showManage */ \"./src/sdk/view/pages/context/showManage.ts\");\n/* harmony import */ var _components_zegoModel__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/zegoModel */ \"./src/sdk/view/components/zegoModel/index.tsx\");\n/* harmony import */ var _components_zegoScreen__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./components/zegoScreen */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoScreen.tsx\");\n/* harmony import */ var _components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/zegoMedia/audio */ \"./src/sdk/view/components/zegoMedia/audio.tsx\");\n/* harmony import */ var _components_zegoWhiteboard__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./components/zegoWhiteboard */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoWhiteboard.tsx\");\n/* harmony import */ var _modules_tools_util__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../../modules/tools/util */ \"./src/sdk/modules/tools/util.ts\");\n/* harmony import */ var _components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./components/zegoTimer */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoTimer.tsx\");\n/* harmony import */ var _components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./components/zegoMixPlayer */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoMixPlayer.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\n\n/* eslint-disable jsx-a11y/anchor-has-content */\n/* eslint-disable jsx-a11y/anchor-is-valid */\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nclass ZegoRoomMobile extends (react__WEBPACK_IMPORTED_MODULE_1___default().PureComponent) {\n constructor() {\n super(...arguments);\n this.state = {\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n localStream: undefined,\n layOutStatus: \"ONE_VIDEO\",\n userLayoutStatus: this.props.core._config.layout || \"Auto\",\n zegoCloudUserList: [],\n memberList: [],\n messageList: [],\n notificationList: [],\n showMore: false,\n connecting: false,\n firstLoading: true,\n cameraFront: true,\n showFooter: true,\n isNetworkPoor: false,\n soundLevel: {},\n liveCountdown: -1,\n liveStatus: \"0\",\n screenSharingUserList: [],\n zegoSuperBoardView: null,\n isZegoWhiteboardSharing: false,\n roomTime: \"00:00:00\",\n isScreenPortrait: true,\n isRequestingCohost: false,\n unreadInviteList: new Set(),\n isMixing: \"0\",\n };\n this.micStatus = !!this.props.core._config.turnOnMicrophoneWhenJoining\n ? 1\n : 0;\n this.cameraStatus = !!this.props.core._config.turnOnCameraWhenJoining\n ? 1\n : 0;\n this.localUserPin = false;\n this.faceModel = this.props.core._config.facingMode === \"user\" ? 1 : 0;\n this.notifyTimer = null;\n this.cameraDevices = [];\n this.localStreamID = \"\";\n this.safariLimitationNoticed = -1;\n this.iosLimitationNoticed = 0;\n this.showNotSupported = 0;\n this.roomTimer = null;\n this.roomTimeNum = 0;\n this.setViewportMetaTimer = null;\n this.viewportHeight = 0;\n this.inviteModelRoot = null;\n this.onblur = (e) => {\n if (e.path &&\n !e.path.includes(document.querySelector(\"#ZegoRoomCssMobileMore\")) &&\n !e.path.includes(document.querySelector(\"#ZegoRoomCssMobilePopMore\"))) {\n this.setState({ showMore: false });\n // @ts-ignore\n document.removeEventListener(\"click\", this.onblur);\n }\n };\n this.menuOptions = {\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.ChangePin]: (value) => {\n if (this._selectedUser.userID !== this.props.core._expressConfig.userID) {\n this.props.core.setPin(this._selectedUser.userID, value);\n this.localUserPin = false;\n }\n else {\n this.localUserPin = value;\n this._selectedUser.pin = value;\n this.props.core.setPin();\n }\n this.setState({\n userLayoutStatus: \"Sidebar\",\n }, () => {\n this.handleLayoutChange(\"Sidebar\");\n });\n this.props.core.setSidebarLayOut(this.state.screenSharingUserList.length > 0 ? false : !this.localUserPin);\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteMic]: () => __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n let res;\n if (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n this.state.micOpen) {\n res = yield this.toggleMic();\n res && (this._selectedUser.streamList[0].micStatus = \"MUTE\");\n }\n else if (((_b = (_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.micStatus) === \"OPEN\") {\n res = yield this.props.core.turnRemoteMicrophoneOff(this._selectedUser.userID);\n }\n res &&\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"Turned off the microphone successfully.\",\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteCamera]: () => __awaiter(this, void 0, void 0, function* () {\n var _c, _d;\n let res;\n if (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n this.state.cameraOpen) {\n res = yield this.toggleCamera();\n res && (this._selectedUser.streamList[0].cameraStatus = \"MUTE\");\n console.warn(this._selectedUser);\n }\n else if (((_d = (_c = this._selectedUser.streamList) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.cameraStatus) === \"OPEN\") {\n res = yield this.props.core.turnRemoteCameraOff(this._selectedUser.userID);\n }\n res &&\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"Turned off the camera successfully.\",\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveUser]: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Remove participant\",\n content: \"Are you sure to remove \" + this._selectedUser.userName + \" ?\",\n cancel: \"Cancel\",\n confirm: \"Confirm\",\n closeCallBack: (confirm) => {\n if (confirm) {\n this.props.core.removeMember(this._selectedUser.userID);\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }\n },\n });\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.InviteCohost]: () => __awaiter(this, void 0, void 0, function* () {\n var _e;\n const res = yield ((_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.inviteJoinToCohost(this._selectedUser.userID, this._selectedUser.userName || \"\"));\n this.updateUserAttr(this._selectedUser.userID, \"invited\", true);\n let text = \"\";\n if ((res === null || res === void 0 ? void 0 : res.code) === 2) {\n text = \"Invitation has been sent.\";\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n text = \"Sent the invitation successfully.\";\n }\n else {\n text = \"Failed to send the invitation, please try again.\";\n }\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: text,\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveCohost]: () => __awaiter(this, void 0, void 0, function* () {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n const isSelf = this._selectedUser.userID === this.props.core._expressConfig.userID;\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"End the connection\",\n content: isSelf\n ? `Are you sure to end the connection with the host?`\n : \"Are you sure to end the connection with \" +\n this._selectedUser.userName +\n \" ?\",\n cancel: \"Cancel\",\n confirm: \"Yes\",\n closeCallBack: (confirm) => {\n var _a;\n if (confirm) {\n if (isSelf) {\n this.cohostToBeAudience();\n }\n else {\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.removeCohost(this._selectedUser.userID);\n }\n }\n },\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.DisagreeRequestCohost]: () => __awaiter(this, void 0, void 0, function* () {\n var _f;\n const res = yield ((_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.hostRefuseRequest(this._selectedUser.userID));\n this.updateUserAttr(this._selectedUser.userID, \"requestCohost\", \"\");\n this.state.unreadInviteList.delete(this._selectedUser.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"DisagreeRequestCohost\", res);\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.AgreeRequestCohost]: () => __awaiter(this, void 0, void 0, function* () {\n var _g;\n const res = yield ((_g = this.props.core._zimManager) === null || _g === void 0 ? void 0 : _g._inRoomInviteMg.hostAcceptRequest(this._selectedUser.userID));\n if ((res === null || res === void 0 ? void 0 : res.code) === 6000276) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The request for connecting has expired.\",\n });\n }\n this.updateUserAttr(this._selectedUser.userID, \"requestCohost\", \"\");\n this.state.unreadInviteList.delete(this._selectedUser.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"AgreeRequestCohost\", res);\n }),\n };\n this.isCreatingWhiteboardSharing = false;\n }\n get isCDNLive() {\n var _a, _b;\n return (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_b = this.props.core._config.scenario.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.props.core._config.scenario.config.liveStreamingMode ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveStreamingMode.LiveStreaming);\n }\n get showRoomTimerUI() {\n var _a, _b;\n return (this.props.core._config.showRoomTimer &&\n ((_b = (_a = this.props.core._config) === null || _a === void 0 ? void 0 : _a.scenario) === null || _b === void 0 ? void 0 : _b.mode) !== _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming);\n }\n get showRequestToCohostButton() {\n var _a, _b;\n if (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) !== _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n return !!this.props.core._config.showRequestToCohostButton;\n }\n get showInviteToCohostButton() {\n var _a, _b;\n if (!this.props.core._config.showInviteToCohostButton)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n if ((_b = (_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.media)\n return false;\n return this.props.core.isHost(this.props.core._expressConfig.userID);\n }\n componentDidMount() {\n window.addEventListener(\"orientationchange\", this.onOrientationChange.bind(this), false);\n this.onOrientationChange();\n this.initInRoomInviteMgListener();\n this.initSDK();\n this.props.core._config.showRoomTimer && this.startRoomTimer();\n this.footerTimer = setTimeout(() => {\n this.setState({\n showFooter: false,\n });\n }, 5000);\n }\n componentWillUnmount() {\n window.removeEventListener(\"orientationchange\", this.onOrientationChange.bind(this), false);\n if (this.roomTimer) {\n clearInterval(this.roomTimer);\n this.roomTimer = null;\n }\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n }\n componentDidUpdate(preProps, preState) {\n if ((preState.notificationList.length > 0 &&\n this.state.notificationList.length > 0 &&\n preState.notificationList[preState.notificationList.length - 1]\n .messageID !==\n this.state.notificationList[this.state.notificationList.length - 1]\n .messageID) ||\n (preState.notificationList.length === 0 &&\n this.state.notificationList.length > 0)) {\n if (this.notifyTimer) {\n clearTimeout(this.notifyTimer);\n this.notifyTimer = null;\n }\n this.notifyTimer = setTimeout(() => {\n this.setState({\n notificationList: [],\n });\n }, 3000);\n }\n // if (preState.userLayoutStatus !== this.state.userLayoutStatus) {\n // this.handleLayoutChange(this.state.userLayoutStatus);\n // }\n }\n initSDK() {\n return __awaiter(this, void 0, void 0, function* () {\n this.props.core.onNetworkStatusQuality((roomID, level) => {\n this.setState({\n isNetworkPoor: level > 2,\n });\n });\n this.props.core.onNetworkStatus((roomID, type, status) => {\n if (status === \"DISCONNECTED\" && type === \"ROOM\") {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom();\n }\n else if (status === \"CONNECTING\") {\n this.setState({\n connecting: true,\n });\n }\n else if (status === \"CONNECTED\") {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n }\n });\n this.props.core.onRemoteUserUpdate((roomID, updateType, userList, allUsers) => {\n var _a;\n let notificationList = [];\n if ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showUserJoinAndLeave) {\n userList.forEach((u) => {\n notificationList.push({\n content: u.userName +\n \" \" +\n (updateType === \"ADD\" ? \"enter\" : \"quite\") +\n \" the room\",\n type: \"USER\",\n userName: u.userName,\n messageID: (0,_util__WEBPACK_IMPORTED_MODULE_6__.randomNumber)(5),\n });\n });\n }\n // 当房间只剩自己的时候，自动离开房间\n if (updateType === \"DELETE\") {\n if (this.props.core._config.autoLeaveRoomWhenOnlySelfInRoom &&\n allUsers.length === 0) {\n this.confirmLeaveRoom();\n return;\n }\n }\n this.setState((state) => {\n return {\n notificationList: [...state.notificationList, ...notificationList],\n };\n });\n });\n this.props.core.onRoomMessageUpdate((roomID, messageList) => {\n this.setState((state) => {\n var _a;\n let lowerLeftNotification = [];\n if (this.state.layOutStatus !== \"MESSAGE\" &&\n ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showTextChat)) {\n lowerLeftNotification = [\n ...state.notificationList,\n ...messageList.map((m) => {\n return {\n content: m.message,\n type: \"MSG\",\n userName: m.fromUser.userName,\n messageID: m.messageID,\n };\n }),\n ];\n }\n return {\n messageList: [...state.messageList, ...messageList],\n notificationList: lowerLeftNotification,\n };\n });\n });\n this.props.core.subscribeUserList((userList) => {\n // ios手机 && 低于 14版本的Safari不支持多条流同时播放\n const notSupportPhone = !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isPc)() &&\n (0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)() &&\n (0,_util__WEBPACK_IMPORTED_MODULE_6__.IsLowVersionSafari)() &&\n userList.filter((u) => {\n return (u.streamList.length > 0 && u.streamList[0].micStatus === \"OPEN\");\n }).length > (this.state.screenSharingUserList.length > 0 ? 0 : 1);\n if (this.isCDNLive) {\n // 拷贝一下userList\n let userListCopy = JSON.parse(JSON.stringify(userList));\n // 有流且有一个设备是打开状态的用户数\n const userNum = userListCopy.filter((user) => user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")).length;\n // 最大可以同时播放的video\n let limitNum = 1;\n if (this.isCDNLive && !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)()) {\n // 非ios 最多同时拉6条流， http连接数限制\n limitNum = this.state.screenSharingUserList.length > 0 ? 5 : 6;\n }\n // 如果当前推流人数大于最大拉流数限制\n // 取最早进房间的user进行拉流展示\n if (userNum > limitNum) {\n let i = 0;\n let targetUsers = userListCopy\n .reverse()\n .map((user) => {\n if (user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")) {\n if (i >= limitNum) {\n user.streamList = [];\n }\n else {\n i++;\n }\n }\n return user;\n });\n const users = targetUsers.reverse();\n // 更新用户列表\n this.setState({\n zegoCloudUserList: targetUsers,\n memberList: users, // 成员列表\n }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus, true);\n });\n if ((0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)() && this.isCDNLive && this.iosLimitationNoticed === 0) {\n this.iosLimitationNoticed = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Your current mobile system does not support the display of multiple video screens during the live streaming.\",\n okText: \"Okay\",\n });\n }\n return;\n }\n }\n else if (notSupportPhone) {\n // 只支持播放一个video的情况\n let targetUsers = userList.reverse();\n let targetUser = targetUsers.find((u) => u.streamList.length > 0 && u.streamList[0].micStatus === \"OPEN\");\n this.setState({\n zegoCloudUserList: [targetUser],\n memberList: userList,\n screenSharingUserList: [],\n });\n if (this.safariLimitationNoticed === -1) {\n this.safariLimitationNoticed = 0;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"The current browser does not support the display of multiple video screens, we suggest you change your browser.\",\n okText: \"Okay\",\n onOk: () => {\n this.safariLimitationNoticed = 1;\n this.handleLayoutChange(this.state.userLayoutStatus, true);\n },\n });\n }\n return;\n }\n this.setState({\n zegoCloudUserList: userList,\n memberList: userList,\n });\n });\n this.props.core.subscribeWhiteBoard((superBoardView) => {\n this.setState({\n zegoSuperBoardView: superBoardView,\n isZegoWhiteboardSharing: !!superBoardView,\n });\n });\n this.props.core.subscribeScreenStream((userList) => {\n const notSupportPhone = !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isPc)() &&\n (0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)() &&\n ((0,_util__WEBPACK_IMPORTED_MODULE_6__.IsLowVersionSafari)() || this.isCDNLive) &&\n this.state.zegoCloudUserList.filter((u) => {\n return (u.streamList.length > 0 &&\n (u.streamList[0].micStatus === \"OPEN\" ||\n u.streamList[0].cameraStatus === \"OPEN\"));\n }).length > 0;\n this.setState({ screenSharingUserList: notSupportPhone ? [] : userList }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus, true);\n });\n });\n this.props.core.onSoundLevelUpdate((soundLevelList) => {\n let list = {};\n soundLevelList.forEach((s) => {\n let userId = s.streamID.split(\"_\")[1];\n if (list[userId]) {\n list[userId][s.streamID] = Math.floor(s.soundLevel);\n }\n else {\n list[userId] = {\n [s.streamID]: Math.floor(s.soundLevel),\n };\n }\n });\n this.setState({\n soundLevel: list,\n });\n });\n this.props.core.onRoomLiveStateUpdate((res) => {\n this.setState((preState) => {\n return {\n liveStatus: res,\n liveCountdown: preState.liveCountdown === -1 || preState.liveCountdown === 0\n ? res === \"1\"\n ? 0\n : -1\n : preState.liveCountdown,\n };\n }, () => {\n // console.error(\"【ZEGOCLOUD】 liveStatus\", this.state.liveStatus);\n });\n });\n this.props.core.onRoomMixingStateUpdate((isMixing) => {\n this.setState({\n isMixing,\n });\n });\n this.props.core.onCoreError((code, msg) => {\n if (code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportStandardLive ||\n code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportCDNLive) {\n if (this.showNotSupported)\n return;\n this.showNotSupported = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"The service is not available, please contact the live streaming service provider to resolve.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n });\n // 监听呼叫邀请离开房间的通知\n this.props.core._zimManager &&\n this.props.core._zimManager.notifyLeaveRoom(() => {\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom();\n });\n // 监听远端控制摄像头麦克风\n this.props.core.onChangeYourDeviceStatus((type, status, fromUser) => __awaiter(this, void 0, void 0, function* () {\n if (type === \"Camera\" && status === \"CLOSE\" && this.state.cameraOpen) {\n yield this.toggleCamera();\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n if (type === \"Microphone\" && status === \"CLOSE\" && this.state.micOpen) {\n yield this.toggleMic();\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n }));\n this.props.core.onKickedOutRoom(() => {\n this.confirmLeaveRoom(true);\n });\n const logInRsp = yield this.props.core.enterRoom();\n let massage = \"\";\n if (logInRsp === 0) {\n this.createStream();\n setTimeout(() => __awaiter(this, void 0, void 0, function* () {\n this.props.core._config.showMyCameraToggleButton &&\n (this.cameraDevices = yield this.props.core.getCameras());\n }), 4000);\n return;\n }\n else if (logInRsp === 1002034) {\n // 登录房间的用户数超过该房间配置的最大用户数量限制（测试环境下默认房间最大用户数为 50，正式环境无限制）。\n massage =\n \"Failed to join the room, the number of people in the room has reached the maximum.(2 people)\";\n }\n else if ([1002031, 1002053].includes(logInRsp)) {\n //登录房间超时，可能是由于网络原因导致。\n massage =\n \"There's something wrong with your network. Please check it and try again.\";\n }\n else if ([1102018, 1102016, 1102020].includes(logInRsp)) {\n // 登录 token 错误，\n massage = \"Failed to join the room, token authentication error.\";\n }\n else if (1002056 === logInRsp) {\n // 用户重复进行登录。\n massage =\n \"You are on a call in another room, please leave that room first.\";\n }\n else {\n massage =\n \"Failed to join the room, please try again.(error code:\" +\n logInRsp +\n \")\";\n }\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Login room Failed\",\n contentText: massage,\n okText: \"OK\",\n });\n });\n }\n initInRoomInviteMgListener() {\n var _a, _b, _c, _d, _e, _f;\n // 收到邀请上麦的通知\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.notifyInviteToCoHost((inviterName) => {\n this.inviteModelRoot = (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Invitation\",\n content: \"The host invites you to have a connection.\",\n confirm: \"Confirm\",\n cancel: \"Disagree\",\n countdown: 60,\n closeCallBack: (confirm) => __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n if (confirm) {\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceAcceptInvitation();\n // TODO 角色变更，更新config，开始推流,\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }\n else {\n (_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.audienceRefuseInvitation();\n }\n }),\n });\n });\n (_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.notifyInviteToCoHostRefused((reason, user) => {\n const { inviteeName, inviteeID } = user;\n if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Disagree) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${inviteeName} disagreed with the invitation.`,\n });\n }\n else if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Busy) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `Invitation has been sent.`,\n });\n }\n else if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Timeout) {\n }\n this.updateUserAttr(inviteeID, \"invited\", false);\n });\n (_c = this.props.core._zimManager) === null || _c === void 0 ? void 0 : _c._inRoomInviteMg.notifyRemoveCoHost(() => {\n // Cohost 变成 Audience，停止推流\n this.cohostToBeAudience();\n });\n (_d = this.props.core._zimManager) === null || _d === void 0 ? void 0 : _d._inRoomInviteMg.notifyRequestCoHost((inviter, state) => {\n //收到观众连麦通知，0 取消|超时， 1 申请\n // 左侧通知\n if (state === 1) {\n const notify = {\n content: `${inviter.userName} is requesting a connection with you.`,\n type: \"INVITE\",\n userName: inviter.userName,\n messageID: (0,_util__WEBPACK_IMPORTED_MODULE_6__.randomNumber)(5),\n };\n this.setState({\n notificationList: [...this.state.notificationList, notify],\n });\n }\n // 设置红点\n if (state === 1) {\n this.state.unreadInviteList.add(inviter.userID);\n }\n else {\n this.state.unreadInviteList.delete(inviter.userID);\n }\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n // 设置观众状态\n this.updateUserAttr(inviter.userID, \"requestCohost\", state ? Date.now() : \"\");\n });\n (_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.notifyHostRespondRequestCohost((respond) => __awaiter(this, void 0, void 0, function* () {\n var _g;\n if (respond === 0) {\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }\n else if (respond === 1) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The host has rejected your request.\",\n });\n }\n else if (respond === 2) {\n (_g = this.inviteModelRoot) === null || _g === void 0 ? void 0 : _g.unmount();\n }\n this.setState({\n isRequestingCohost: false,\n });\n }));\n // 观众的连麦申请超时（观众端）\n (_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.notifyRequestCohostTimeout(() => {\n this.setState({\n isRequestingCohost: false,\n });\n });\n }\n createStream() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.props.core._config.turnOnCameraWhenJoining &&\n !this.props.core._config.turnOnMicrophoneWhenJoining &&\n !this.props.core._config.showMyCameraToggleButton &&\n !this.props.core._config.showMyMicrophoneToggleButton) {\n return false;\n }\n if (!this.props.core.status.videoRefuse ||\n !this.props.core.status.audioRefuse) {\n try {\n let localStream = null;\n try {\n const solution = (0,_util__WEBPACK_IMPORTED_MODULE_6__.getVideoResolution)(this.props.core._config.videoResolutionList[0]);\n localStream = yield this.props.core.createStream({\n camera: Object.assign({ video: !this.props.core.status.videoRefuse, audio: !this.props.core.status.audioRefuse, videoQuality: 4, facingMode: this.faceModel ? \"user\" : \"environment\" }, solution),\n });\n }\n catch (error) {\n if (JSON.stringify(error).includes(\"constrain\")) {\n localStream = yield this.props.core.createStream({\n camera: {\n video: !this.props.core.status.videoRefuse,\n audio: !this.props.core.status.audioRefuse,\n facingMode: this.faceModel ? \"user\" : \"environment\",\n },\n });\n }\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103064) {\n this.props.core.status.videoRefuse = true;\n this.props.core.status.audioRefuse = true;\n this.setState({\n cameraOpen: false,\n micOpen: false,\n });\n }\n }\n if (!localStream)\n return false;\n this.props.core.mutePublishStreamVideo(localStream, !this.props.core._config.turnOnCameraWhenJoining);\n this.props.core.muteMicrophone(!this.props.core._config.turnOnMicrophoneWhenJoining);\n this.setState({\n localStream,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n });\n const extraInfo = JSON.stringify({\n isCameraOn: !!this.props.core._config.turnOnCameraWhenJoining,\n isMicrophoneOn: this.props.core._config.turnOnMicrophoneWhenJoining,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n });\n try {\n const res = this.props.core.publishLocalStream(localStream, \"main\", extraInfo);\n if (res !== false) {\n this.localStreamID = res;\n }\n }\n catch (error) {\n // 推流失败就销毁创建的流\n console.error(\"【ZEGOCLOUD】publishStream failed:\", error);\n this.props.core.destroyStream(localStream);\n this.setState({\n localStream: null,\n });\n return false;\n }\n return true;\n }\n catch (error) {\n console.error(\"【ZEGOCLOUD】createStream or publishLocalStream failed,Reason: \", JSON.stringify(error));\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103065 || (error === null || error === void 0 ? void 0 : error.code) === 1103061) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The audio and video equipment is being occupied by another application.\",\n });\n }\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103064) {\n this.props.core.status.videoRefuse = true;\n this.props.core.status.audioRefuse = true;\n this.setState({\n cameraOpen: false,\n micOpen: false,\n });\n }\n return false;\n }\n }\n else {\n return false;\n }\n });\n }\n stopPublish() {\n try {\n this.localStreamID &&\n this.props.core.stopPublishingStream(this.localStreamID);\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.setState({\n localStream: null,\n });\n this.localStreamID = \"\";\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleMic() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.audioRefuse) {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Equipment authorization\",\n content: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n confirm: \"Okay\",\n });\n return;\n }\n if (this.micStatus === -1)\n return;\n this.micStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getAudioTracks().length > 0) {\n result = yield this.props.core.muteMicrophone(this.state.micOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: this.state.cameraOpen,\n isMicrophoneOn: !this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.micStatus = !this.state.micOpen ? 1 : 0;\n if (result) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The microphone is \" + (this.micStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n micOpen: !!this.micStatus,\n }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus);\n });\n }\n return !!result;\n });\n }\n toggleCamera() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.videoRefuse) {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Equipment authorization\",\n content: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n confirm: \"Okay\",\n });\n return;\n }\n if (this.cameraStatus === -1)\n return;\n this.cameraStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getVideoTracks().length > 0) {\n result = yield this.props.core.mutePublishStreamVideo(this.state.localStream, this.state.cameraOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: !this.state.cameraOpen,\n isMicrophoneOn: this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.cameraStatus = !this.state.cameraOpen ? 1 : 0;\n if (result) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The camera is \" + (this.cameraStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n cameraOpen: !!this.cameraStatus,\n }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus);\n });\n }\n return !!result;\n });\n }\n switchCamera() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.videoRefuse) {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Equipment authorization\",\n content: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n confirm: \"Okay\",\n });\n return;\n }\n if (this.cameraDevices.length === 0) {\n this.cameraDevices = yield this.props.core.getCameras();\n }\n if (!this.state.localStream || this.cameraDevices.length < 2) {\n return;\n }\n let targetModel = false;\n if (this.faceModel === -1) {\n return;\n }\n else if (this.faceModel === 0) {\n targetModel = true;\n }\n this.faceModel = -1;\n this.state.localStream.getVideoTracks()[0].stop();\n this.state.localStream.getAudioTracks()[0].stop();\n try {\n const solution = (0,_util__WEBPACK_IMPORTED_MODULE_6__.getVideoResolution)(this.props.core._config.videoResolutionList[0]);\n const stream = yield this.props.core.createStream({\n camera: Object.assign({ video: !this.props.core.status.videoRefuse, audio: !this.props.core.status.audioRefuse, videoQuality: 4, facingMode: !this.state.cameraFront ? \"user\" : \"environment\" }, solution),\n });\n let videoTrack = stream.getVideoTracks()[0];\n !this.state.cameraOpen && (videoTrack.enabled = false);\n let audioTrack = stream.getAudioTracks()[0];\n yield this.props.core.replaceTrack(this.state.localStream, videoTrack);\n yield this.props.core.replaceTrack(this.state.localStream, audioTrack);\n }\n catch (error) {\n console.error(\"【ZEGOCLOUD】switch camera failed!\", error);\n }\n this.faceModel = targetModel ? 1 : 0;\n this.setState({\n cameraFront: targetModel,\n });\n });\n }\n toggleLayOut(layOutStatus) {\n this.setState((state) => {\n return {\n layOutStatus: state.layOutStatus === layOutStatus ? \"ONE_VIDEO\" : layOutStatus,\n showMore: false,\n };\n });\n }\n sendMessage(msg) {\n return __awaiter(this, void 0, void 0, function* () {\n let messageID = (0,_util__WEBPACK_IMPORTED_MODULE_6__.randomNumber)(3);\n this.setState((state) => {\n return {\n messageList: [\n ...state.messageList,\n {\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n message: msg,\n sendTime: Date.now(),\n messageID,\n status: \"SENDING\",\n },\n ],\n };\n });\n let resp = {};\n try {\n resp = yield this.props.core.sendRoomMessage(msg);\n }\n catch (err) {\n console.error(\"【ZEGOCLOUD】sendMessage failed!\", JSON.stringify(err));\n }\n this.setState((state) => {\n const _messageList = state.messageList.map((msg) => {\n if (msg.messageID === messageID) {\n msg.status = resp.errorCode === 0 ? \"SENDED\" : \"FAILED\";\n }\n return msg;\n });\n console.log(_messageList);\n return {\n messageList: _messageList,\n };\n });\n });\n }\n openMore() {\n this.setState((state) => {\n return { showMore: !state.showMore };\n }, () => {\n if (this.state.showMore) {\n // @ts-ignore\n document.addEventListener(\"click\", this.onblur);\n }\n else {\n // @ts-ignore\n document.removeEventListener(\"click\", this.onblur);\n }\n });\n }\n leaveRoom() {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Leave the room\",\n content: \"Are you sure to leave the room?\",\n cancel: \"Cancel\",\n confirm: \"Confirm\",\n closeCallBack: (confirm) => {\n if (confirm) {\n this.confirmLeaveRoom();\n }\n },\n });\n }\n cohostToBeAudience() {\n this.stopPublish();\n // this.setState({\n // showLayoutSettings: false,\n // showSettings: false,\n // });\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n handleRequestCohost() {\n var _a, _b;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isRequestingCohost) {\n yield ((_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceCancelRequest());\n this.setState({\n isRequestingCohost: false,\n });\n }\n else {\n const res = yield ((_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.requestCohost());\n if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `You've applied for connection, please wait for the host's confirmation.`,\n });\n this.setState({\n isRequestingCohost: true,\n });\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 1) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `The host has left the room.`,\n });\n }\n else {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `Failed to send application, please try again.`,\n });\n }\n }\n });\n }\n updateUserAttr(userID, attr, value) {\n const userList = this.state.zegoCloudUserList.map((user) => {\n if (user.userID === userID) {\n user[attr] = value;\n }\n return user;\n });\n this.setState({\n zegoCloudUserList: userList,\n });\n }\n confirmLeaveRoom(isKickedOut = false) {\n var _a, _b, _c, _d;\n if (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) !== _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n this.props.core._config.turnOnCameraWhenJoining = this.state.cameraOpen;\n this.props.core._config.turnOnMicrophoneWhenJoining = this.state.micOpen;\n }\n (_d = (_c = this.props.core._zimManager) === null || _c === void 0 ? void 0 : _c._inRoomInviteMg) === null || _d === void 0 ? void 0 : _d.audienceCancelRequest();\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom(isKickedOut);\n }\n getAllUser() {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n pin: this.localUserPin,\n avatar: this.props.core._expressConfig.avatar,\n streamList: [\n {\n media: this.state.localStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: this.state.micOpen ? \"OPEN\" : \"MUTE\",\n cameraStatus: this.state.cameraOpen ? \"OPEN\" : \"MUTE\",\n state: \"PLAYING\",\n streamID: this.localStreamID,\n },\n ],\n },\n ...this.state.zegoCloudUserList,\n ];\n }\n getAllMemberList() {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n pin: this.localUserPin,\n avatar: this.props.core._expressConfig.avatar,\n streamList: [\n {\n media: this.state.localStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: this.state.micOpen ? \"OPEN\" : \"MUTE\",\n cameraStatus: this.state.cameraOpen ? \"OPEN\" : \"MUTE\",\n state: \"PLAYING\",\n streamID: this.localStreamID,\n },\n ],\n },\n ...this.state.memberList,\n ];\n }\n getShownUser() {\n const shownUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser) {\n if (item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS)) {\n if (item.streamList[0].cameraStatus === \"OPEN\") {\n return true;\n }\n else if (this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n }\n else {\n return false;\n }\n }\n else {\n return true;\n }\n });\n // if (\n // this._selectedUser &&\n // !shownUser.some((su) => su.userID === this._selectedUser.userID) &&\n // this.state.layOutStatus === \"MANAGE\"\n // ) {\n // this.setState({\n // layOutStatus: \"ONE_VIDEO\",\n // });\n // }\n return shownUser;\n }\n getHiddenUser() {\n const hiddenUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser &&\n item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS) &&\n item.streamList[0].cameraStatus !== \"OPEN\" &&\n !this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n });\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: hiddenUser.map((user) => {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_19__[\"default\"], { muted: user.userID === this.props.core._expressConfig.userID, userInfo: user }, user.userID + \"_hiddenAudio\"));\n }) }));\n }\n manageSelectCallback(type, value) {\n return __awaiter(this, void 0, void 0, function* () {\n this.menuOptions[type](value);\n });\n }\n get showSelf() {\n if (this.props.core._config.showNonVideoUser) {\n return true;\n }\n else {\n if (this.props.core._config.showOnlyAudioUser) {\n return (this.localStreamID && (this.state.micOpen || this.state.cameraOpen));\n }\n else {\n return this.localStreamID && this.state.cameraOpen;\n }\n }\n }\n handleLayoutChange(selectLayout, stopUpdateUser) {\n return __awaiter(this, void 0, void 0, function* () {\n if (selectLayout !== \"Sidebar\") {\n this._selectedUser && (this._selectedUser.pin = false);\n this.localUserPin = false;\n this.props.core.setPin(undefined, undefined, true);\n }\n this.setState({\n userLayoutStatus: selectLayout,\n });\n return new Promise((resolve, reject) => __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length) {\n if (!this.state.isScreenPortrait) {\n // 横屏下隐藏顶部视频\n yield this.props.core.setMaxScreenNum(0, true);\n }\n else {\n yield this.props.core.setMaxScreenNum(this.showSelf ? 3 : 4, true);\n }\n }\n else if (selectLayout !== \"Sidebar\") {\n yield this.props.core.setMaxScreenNum(this.showSelf ? 5 : 6, true);\n }\n else {\n yield this.props.core.setMaxScreenNum(this.showSelf ? 4 : 5, true);\n }\n let sidebarEnabled = false;\n if (selectLayout === \"Sidebar\") {\n if (this.state.cameraOpen || this.state.micOpen) {\n sidebarEnabled = !this.localUserPin;\n }\n else {\n sidebarEnabled = true;\n }\n }\n yield this.props.core.setSidebarLayOut(this.state.screenSharingUserList.length > 0 ? false : sidebarEnabled, stopUpdateUser);\n }));\n });\n }\n get showTurnOffMicrophoneButton() {\n var _a, _b, _c, _d, _e;\n if (!this.props.core._config.showTurnOffRemoteMicrophoneButton)\n return false;\n if (((_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a.length) === 0)\n return false;\n return (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n ((_e = (_d = this.props.core._config.scenario) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n get showTurnOffCameraButton() {\n var _a, _b, _c, _d, _e;\n if (!this.props.core._config.showTurnOffRemoteCameraButton)\n return false;\n if (((_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a.length) === 0)\n return false;\n return (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n ((_e = (_d = this.props.core._config.scenario) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n get showRemoveButton() {\n var _a, _b, _c, _d, _e;\n if (!this.props.core._config.showRemoveUserButton)\n return false;\n if (this.props.core.isHost(this._selectedUser.userID))\n return false;\n return (((_c = (_b = (_a = this.props.core._config) === null || _a === void 0 ? void 0 : _a.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host &&\n (this._selectedUser.userID !== this.props.core._expressConfig.userID ||\n ((_e = (_d = this._selectedUser) === null || _d === void 0 ? void 0 : _d.streamList) === null || _e === void 0 ? void 0 : _e.length) === 0));\n }\n get isShownPin() {\n var _a, _b, _c, _d, _e, _f, _g;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.OneONoneCall) {\n return false;\n }\n let showPinButton = !!this.props.core._config.showPinButton;\n return (showPinButton &&\n (this.props.core._config.showNonVideoUser ||\n ((_d = (_c = (_b = this._selectedUser) === null || _b === void 0 ? void 0 : _b.streamList) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.cameraStatus) === \"OPEN\" ||\n (((_g = (_f = (_e = this._selectedUser) === null || _e === void 0 ? void 0 : _e.streamList) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.micStatus) === \"OPEN\" &&\n !!this.props.core._config.showOnlyAudioUser)) &&\n this.getShownUser().length > 1);\n }\n get showRemoveCohostButton() {\n var _a, _b;\n if (!this.props.core._config.showRemoveCohostButton)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n if (!((_b = (_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.media))\n return false;\n if (this.props.core.isHost(this.props.core._expressConfig.userID)) {\n return (this._selectedUser.userID !== this.props.core._expressConfig.userID);\n }\n else {\n return (this._selectedUser.userID === this.props.core._expressConfig.userID);\n }\n }\n showManager(user) {\n if (!user)\n return false;\n return (this.showTurnOffMicrophoneButton ||\n this.showTurnOffCameraButton ||\n this.showRemoveButton ||\n this.isShownPin);\n }\n getListScreen() {\n let pages;\n if (this.state.layOutStatus === \"INVITE\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_9__.ZegoRoomInvite, { core: this.props.core, closeCallBack: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } }));\n }\n else if (this.state.layOutStatus === \"USER_LIST\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoUserList__WEBPACK_IMPORTED_MODULE_8__.ZegoUserList, { core: this.props.core, userList: this.getAllMemberList(), closeCallBack: (_user) => {\n _user && (this._selectedUser = _user);\n if (_user === null || _user === void 0 ? void 0 : _user.requestCohost)\n return;\n this.setState({\n layOutStatus: this.showManager(_user) ? \"MANAGE\" : \"ONE_VIDEO\",\n });\n }, handleMenuItem: (type, user) => {\n user && (this._selectedUser = user);\n this.menuOptions[type]();\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } }));\n }\n else if (this.state.layOutStatus === \"MESSAGE\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMessage__WEBPACK_IMPORTED_MODULE_5__.ZegoMessage, { userID: this.props.core._expressConfig.userID, messageList: this.state.messageList, sendMessage: (msg) => {\n this.sendMessage(msg);\n }, getAvatar: (userID) => {\n const user = this.getAllMemberList().find((u) => u.userID === userID);\n return (user === null || user === void 0 ? void 0 : user.avatar) || \"\";\n }, closeCallBac: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } }));\n }\n else if (this.state.layOutStatus === \"LAYOUT\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoLayout__WEBPACK_IMPORTED_MODULE_12__.ZegoLayout, { selectLayout: this.state.userLayoutStatus, closeCallBac: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }, selectCallBack: this.handleLayoutChange.bind(this) }));\n }\n else if (this.state.layOutStatus === \"MANAGE\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoManage__WEBPACK_IMPORTED_MODULE_13__.ZegoManage, { closeCallback: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }, selectCallback: this.manageSelectCallback.bind(this), selectedUser: this._selectedUser, showPinButton: this.isShownPin, showMicButton: this.showTurnOffMicrophoneButton, showCameraButton: this.showTurnOffCameraButton, showRemoveButton: this.showRemoveButton, showRemoveCohostButton: this.showRemoveCohostButton, showInviteToCohostButton: this.showInviteToCohostButton }));\n }\n if (pages) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].mask} zegocloud_layout_Mask`, onClick: (ev) => {\n // @ts-ignore\n const className = ev.target.className;\n if (className.includes(\"zegocloud_layout_Mask\")) {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }\n } }, { children: pages })));\n }\n }\n getLayoutScreen() {\n var _a, _b, _c, _d, _e;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming) {\n const hasVideo = [\n ...this.getAllUser(),\n ...this.state.screenSharingUserList,\n ].some((u) => {\n if (u.streamList) {\n return u.streamList.some((s) => {\n return s.cameraStatus === \"OPEN\" || s.micStatus === \"OPEN\";\n });\n }\n return false;\n });\n if (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n if (this.state.liveStatus !== \"1\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveNotStart} zegoUserVideo_click` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"The Live has not started yet\" })] })));\n }\n else if (hasVideo &&\n this.props.core._config.scenario.config.enableVideoMixing &&\n this.props.core._config.scenario.config.role === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].mixVideoWrapper }, { children: [this.state.isScreenPortrait &&\n this.state.screenSharingUserList.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: this.state.screenSharingUserList[0].userName }), \" \", \"is presenting.\"] }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_23__.ZegoMixPlayer, { userInfo: this.props.core.mixUser, showFullScreen: this.state.liveStatus === \"1\" &&\n ((_e = (_d = this.props.core._config.scenario) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.enableVideoMixing), isPureAudio: this.props.core.zum.isPureAudio })] })));\n }\n }\n if (!hasVideo) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].noOneStreaming} zegoUserVideo_click` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"No one has turned on the camera or microphone yet.\" })] })));\n }\n }\n if (this.state.screenSharingUserList.length > 0) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.state.isScreenPortrait && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: this.state.screenSharingUserList[0].userName }), \" is presenting.\"] }), this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }))] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoScreen__WEBPACK_IMPORTED_MODULE_18__.ZegoScreen, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), screenSharingUser: this.state.screenSharingUserList[0], videoShowNumber: 5, soundLevel: this.state.soundLevel })] }));\n }\n if (this.state.isZegoWhiteboardSharing) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.state.isScreenPortrait && this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoWhiteboard__WEBPACK_IMPORTED_MODULE_20__.ZegoWhiteboard, { userList: this.getShownUser(), videoShowNumber: 5, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, \n // isSelfScreen={this.state.isWhiteboardSharingBySelf}\n soundLevel: this.state.soundLevel, roomID: this.props.core._expressConfig.roomID, onShow: (el) => __awaiter(this, void 0, void 0, function* () {\n var _f;\n // 主动渲染\n if (this.isCreatingWhiteboardSharing &&\n !this.state.zegoSuperBoardView) {\n try {\n const zegoSuperBoardView = yield this.props.core.createAndPublishWhiteboard(el, this.props.core._expressConfig.userName);\n this.setState({\n isWhiteboardSharingBySelf: true,\n zegoSuperBoardView,\n });\n }\n catch (error) {\n console.error(\"createAndPublishWhiteboard\", error);\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Operation too frequent, failed to load the whiteboard.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n this.isCreatingWhiteboardSharing = false;\n }\n else if (this.state.zegoSuperBoardView) {\n // 被动渲染\n const uniqueID = (_f = this.state.zegoSuperBoardView\n .getCurrentSuperBoardSubView()) === null || _f === void 0 ? void 0 : _f.getModel().uniqueID;\n uniqueID &&\n this.state.zegoSuperBoardView.switchSuperBoardSubView(uniqueID);\n }\n }), onResize: (el) => {\n // 主动渲染\n }, onclose: () => {\n this.toggleWhiteboardSharing();\n }, onToolChange: (type, fontSize, color) => {\n this.props.core.setWhiteboardToolType(type, fontSize, color);\n }, onFontChange: (font, fontSize, color) => {\n this.props.core.setWhiteboardFont(font, fontSize, color);\n }, onImageAdd: () => __awaiter(this, void 0, void 0, function* () { }), zegoSuperBoardView: this.state.zegoSuperBoardView })] }));\n }\n if ((this.state.userLayoutStatus === \"Auto\" &&\n this.getShownUser().length < 3) ||\n this.getShownUser().length < 2) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoOne2One__WEBPACK_IMPORTED_MODULE_4__.ZegoOne2One, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), soundLevel: this.state.soundLevel, onLocalStreamPaused: () => __awaiter(this, void 0, void 0, function* () {\n yield this.props.core.enableVideoCaptureDevice(this.state.localStream, !this.state.cameraOpen);\n this.props.core.enableVideoCaptureDevice(this.state.localStream, this.state.cameraOpen);\n }), showTimerUI: this.showRoomTimerUI })] }));\n }\n else if ((this.state.userLayoutStatus === \"Grid\" &&\n this.getShownUser().length > 1) ||\n (this.state.userLayoutStatus === \"Auto\" && this.getShownUser().length > 2)) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoGrid__WEBPACK_IMPORTED_MODULE_14__.ZegoGrid, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), videoShowNumber: 6, soundLevel: this.state.soundLevel })] }));\n }\n else if (this.state.userLayoutStatus === \"Sidebar\" &&\n this.getShownUser().length > 1) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoSidebar__WEBPACK_IMPORTED_MODULE_15__.ZegoSidebar, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), videoShowNumber: 5, soundLevel: this.state.soundLevel })] }));\n }\n }\n clickVideo(e) {\n var _a, _b;\n // @ts-ignore\n let className = e.target.className;\n let whiteboardClick = false;\n if (\n // @ts-ignore\n ((_a = e.target) === null || _a === void 0 ? void 0 : _a.id).startsWith(\"zego-whiteboard-\") &&\n // @ts-ignore\n e.target.parentElement) {\n // @ts-ignore\n className = (_b = e.target.parentElement) === null || _b === void 0 ? void 0 : _b.className;\n whiteboardClick = true;\n }\n if (className.includes(\"zegoUserVideo_videoCommon\") ||\n className.includes(\"zegoMore_more\") ||\n className.includes(\"ZegoRoomMobile_ZegoRoom\") ||\n className.includes(\"zegoUserVideo_click\")) {\n if (!this.state.showFooter) {\n // 横屏白板不展示底部工具栏\n if (!this.state.isZegoWhiteboardSharing ||\n this.state.isScreenPortrait) {\n this.setState({ showFooter: true });\n }\n }\n else {\n if (this.state.layOutStatus !== \"ONE_VIDEO\") {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n clearTimeout(this.footerTimer);\n this.footerTimer = setTimeout(() => {\n this.setState({ showFooter: false, showMore: false });\n }, 5000);\n }\n else {\n this.setState({ showFooter: false, showMore: false });\n }\n }\n !whiteboardClick && e.stopPropagation();\n }\n else {\n clearTimeout(this.footerTimer);\n this.footerTimer = setTimeout(() => {\n !this.state.showMore &&\n this.setState({ showFooter: false, showMore: false });\n }, 5000);\n }\n }\n setLive() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Stop broadcast\",\n contentText: \"Are you sure to stop broadcasting?\",\n okText: \"Stop\",\n cancelText: \"Cancel\",\n onOk: () => __awaiter(this, void 0, void 0, function* () {\n // stop live\n yield this.props.core.setLive(\"stop\");\n this.setState({\n liveCountdown: -1,\n });\n }),\n });\n }\n else if (this.state.liveCountdown === -1) {\n this.setState({\n liveCountdown: 3,\n }, () => {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n });\n }\n });\n }\n liveCountdownTimer() {\n this.setState((preState) => {\n return {\n liveCountdown: preState.liveCountdown - 1,\n };\n }, () => __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n yield this.props.core.setLive(\"live\");\n }\n else {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n }\n }));\n }\n toggleWhiteboardSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length > 0)\n return;\n if (this.state.isZegoWhiteboardSharing) {\n this.closeWhiteboardSharing();\n }\n else if (!this.state.isZegoWhiteboardSharing) {\n this.createWhiteboardSharing();\n }\n });\n }\n createWhiteboardSharing() {\n var _a;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length > 0) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${this.state.screenSharingUserList[0].userName} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n else if (this.state.zegoSuperBoardView) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${(_a = this.state.zegoSuperBoardView.getCurrentSuperBoardSubView()) === null || _a === void 0 ? void 0 : _a.getModel.name} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n if (this.isCreatingWhiteboardSharing)\n return;\n this.isCreatingWhiteboardSharing = true;\n this.setState({\n isZegoWhiteboardSharing: true,\n showFooter: this.state.isScreenPortrait ? this.state.showFooter : false,\n });\n });\n }\n closeWhiteboardSharing() {\n try {\n this.state.zegoSuperBoardView &&\n this.props.core.destroyAndStopPublishWhiteboard();\n this.setState({\n isWhiteboardSharingBySelf: false,\n isZegoWhiteboardSharing: false,\n zegoSuperBoardView: null,\n });\n this.isCreatingWhiteboardSharing = false;\n }\n catch (error) {\n console.error(error);\n }\n }\n startRoomTimer() {\n if (this.roomTimer)\n return;\n this.roomTimer = setInterval(() => {\n this.setState({ roomTime: (0,_modules_tools_util__WEBPACK_IMPORTED_MODULE_21__.formatTime)(++this.roomTimeNum) });\n }, 1000);\n }\n onOrientationChange() {\n var _a;\n let isScreenPortrait = this.state.isScreenPortrait;\n (_a = this.props.core._config.container) === null || _a === void 0 ? void 0 : _a.querySelectorAll(\"input\").forEach((el) => el.blur());\n if (window.orientation === 180 || window.orientation === 0) {\n // 竖屏\n isScreenPortrait = true;\n }\n if (window.orientation === 90 || window.orientation === -90) {\n // 横屏\n isScreenPortrait = false;\n }\n if (!isScreenPortrait) {\n this.setState({ showFooter: false });\n }\n this.setState({\n isScreenPortrait: isScreenPortrait,\n }, () => {\n if (!isScreenPortrait && !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)()) {\n this.setViewportMeta();\n }\n else {\n if (this.setViewportMetaTimer) {\n clearTimeout(this.setViewportMetaTimer);\n this.setViewportMetaTimer = null;\n }\n }\n setTimeout(() => {\n var _a, _b;\n (_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.reloadView();\n }, 300);\n });\n }\n // 解决横屏时键盘弹起导致视窗高度变小，页面缩小的问题\n setViewportMeta() {\n var _a;\n if (this.viewportHeight)\n return;\n let metaEl = document.querySelector(\"meta[name=viewport]\");\n let content = \"\";\n if (window.outerHeight > window.outerWidth) {\n this.setViewportMetaTimer = setTimeout(() => {\n this.setViewportMeta();\n this.setViewportMetaTimer = null;\n }, 100);\n return;\n }\n else {\n this.viewportHeight = window.outerHeight;\n }\n const height = \"height=\" + this.viewportHeight;\n if (metaEl) {\n let contentArr = metaEl.content\n .split(\",\")\n .filter((attr) => !attr.includes(\"height=\"));\n contentArr.push(height);\n content = contentArr.join(\",\");\n }\n else {\n metaEl = document.createElement(\"meta\");\n metaEl.name = \"viewport\";\n (_a = document.querySelector(\"header\")) === null || _a === void 0 ? void 0 : _a.appendChild(metaEl);\n }\n metaEl.content = content;\n }\n render() {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;\n const startIndex = this.state.notificationList.length < 4\n ? 0\n : this.state.notificationList.length - 2;\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_context_showManage__WEBPACK_IMPORTED_MODULE_16__[\"default\"].Provider, Object.assign({ value: {\n show: (_user) => {\n _user && (this._selectedUser = _user);\n this.setState({\n layOutStatus: this.showManager(_user) ? \"MANAGE\" : \"ONE_VIDEO\",\n });\n },\n liveStatus: this.state.liveStatus,\n showPinButton: (!!this.props.core._config.showPinButton ||\n !!this.props.core._config.showTurnOffRemoteCameraButton ||\n !!this.props.core._config.showTurnOffRemoteMicrophoneButton ||\n !!this.props.core._config.showRemoveUserButton) &&\n this.getShownUser().length > 1,\n whiteboard_page: ((_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.getCurrentPage()) || 1,\n whiteboard_toolType: ((_c = this.props.core.zegoSuperBoard) === null || _c === void 0 ? void 0 : _c.getToolType()) || 0,\n whiteboard_fontSize: ((_d = this.props.core.zegoSuperBoard) === null || _d === void 0 ? void 0 : _d.getFontSize()) || 0,\n whiteboard_brushSize: ((_e = this.props.core.zegoSuperBoard) === null || _e === void 0 ? void 0 : _e.getBrushSize()) || 0,\n whiteboard_brushColor: ((_f = this.props.core.zegoSuperBoard) === null || _f === void 0 ? void 0 : _f.getBrushColor()) || \"\",\n whiteboard_isFontBold: (_g = this.props.core.zegoSuperBoard) === null || _g === void 0 ? void 0 : _g.isFontBold(),\n whiteboard_isFontItalic: (_h = this.props.core.zegoSuperBoard) === null || _h === void 0 ? void 0 : _h.isFontItalic(),\n whiteboard_showAddImage: (_j = this.props.core._config.whiteboardConfig) === null || _j === void 0 ? void 0 : _j.showAddImageButton,\n whiteboard_showCreateClose: (_k = this.props.core._config.whiteboardConfig) === null || _k === void 0 ? void 0 : _k.showCreateAndCloseButton,\n userInfo: { userID: this.props.core._expressConfig.userID },\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom} ZegoRoomMobile_ZegoRoom ${((_l = this.props.core._config.scenario) === null || _l === void 0 ? void 0 : _l.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming\n ? ((_o = (_m = this.props.core._config.scenario) === null || _m === void 0 ? void 0 : _m.config) === null || _o === void 0 ? void 0 : _o.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].host\n : ((_q = (_p = this.props.core._config.scenario) === null || _p === void 0 ? void 0 : _p.config) === null || _q === void 0 ? void 0 : _q.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].audience\n : \"\"\n : \"\"}`, onClick: (e) => {\n // @ts-ignore\n this.clickVideo(e);\n } }, { children: [this.getLayoutScreen(), this.state.isNetworkPoor && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].network })), (this.state.showFooter || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].footer }, { children: [this.props.core._config.showMyCameraToggleButton &&\n (((_r = this.props.core._config.scenario) === null || _r === void 0 ? void 0 : _r.mode) !==\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming ||\n ((_t = (_s = this.props.core._config.scenario) === null || _s === void 0 ? void 0 : _s.config) === null || _t === void 0 ? void 0 : _t.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].switchCamera}`, onClick: () => {\n this.switchCamera();\n } })), this.props.core._config.showMyCameraToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: this.state.cameraOpen\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].toggleCamera\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].cameraClose, onClick: () => {\n this.toggleCamera();\n } })), this.props.core._config.showMyMicrophoneToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: this.state.micOpen\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].toggleMic\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].micClose, onClick: () => {\n this.toggleMic();\n } })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: ((_u = this.props.core._config.scenario) === null || _u === void 0 ? void 0 : _u.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveLeaveButton\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].leaveRoom, onClick: () => {\n this.leaveRoom();\n } }), (this.props.core._config.showTextChat ||\n this.props.core._config.showUserList ||\n this.props.core._config.sharedLinks) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"a\", Object.assign({ id: \"ZegoRoomCssMobileMore\", className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].more} ${!this.state.showMore && this.state.unreadInviteList.size > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].moreRedPoint\n : \"\"}`, onClick: () => {\n this.openMore();\n } }, { children: [(this.state.showMore || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ id: \"ZegoRoomCssMobilePopMore\", className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popMore} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popLiveMore}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popMoreContent }, { children: [this.props.core._config.showMyCameraToggleButton &&\n ((_v = this.props.core._config.scenario) === null || _v === void 0 ? void 0 : _v.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_w = this.props.core._config.scenario.config) === null || _w === void 0 ? void 0 : _w.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].switchCamera} zegoUserVideo_click`, onClick: () => {\n this.switchCamera();\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].switchCamera} zegoUserVideo_click` }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Flip\" })] }))), this.props.core._config.showRoomDetailsButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].roomDetail, onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"INVITE\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].details }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Room details\" })] }))), this.props.core._config.showUserList && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${this.state.unreadInviteList.size > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].unread\n : \"\"}`, onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"USER_LIST\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].member }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Member\" })] }))), this.props.core._config.showTextChat && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"MESSAGE\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].chat }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Chat\" })] }))), this.props.core._config.showLayoutButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"LAYOUT\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layout }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Layout\" })] }))), this.showRequestToCohostButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.handleRequestCohost();\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: `${this.state.isRequestingCohost\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].connected\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].connect} ` }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Connect\" })] }))), ((_x = this.props.core._config.plugins) === null || _x === void 0 ? void 0 : _x.ZegoSuperBoardManager) &&\n ((_y = this.props.core._config.whiteboardConfig) === null || _y === void 0 ? void 0 : _y.showCreateAndCloseButton) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"WHITEBOARD\");\n this.toggleWhiteboardSharing();\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].whiteboard} ${this.state.isZegoWhiteboardSharing\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].sharing\n : \"\"} ${this.state.screenSharingUserList.length > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].forbiddenSharing\n : \"\"}` }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Whiteboard\" })] })))] })) }))), (this.state.showMore || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popMoreArray }))] }))), ((_z = this.props.core._config.scenario) === null || _z === void 0 ? void 0 : _z.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_0 = this.props.core._config.scenario.config) === null || _0 === void 0 ? void 0 : _0.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLive} ${this.state.liveCountdown === 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLiveEnabled\n : \"\"}`, id: \"ZegoLiveButton\", onClick: () => {\n this.setLive();\n } }, { children: this.state.liveCountdown === 3 ||\n this.state.liveCountdown === -1\n ? \"Go Live\"\n : this.state.liveCountdown === 0\n ? \"Stop\"\n : \"Go Live\" })))] }))), this.getListScreen(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: this.getHiddenUser() }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notify, id: \"zego_left_notify_wrapper\" }, { children: this.state.notificationList.slice(startIndex).map((notify) => {\n if (notify.type === \"MSG\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h5\", { children: notify.userName }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: notify.content })] }), notify.content));\n }\n else {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: notify.content }) }), notify.content));\n }\n }) })), this.state.liveCountdown > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].countDown }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: this.state.liveCountdown }) }))), (this.state.connecting || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ZegoReconnect__WEBPACK_IMPORTED_MODULE_10__.ZegoReconnect, { content: this.state.firstLoading || false\n ? \"Joining Room\"\n : \"Trying to reconnect...\" })), ((_1 = this.props.core._config.scenario) === null || _1 === void 0 ? void 0 : _1.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n (this.state.liveCountdown === 0 ||\n this.state.liveStatus === \"1\") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"button\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].LiveStateButton} ${this.state.showFooter\n ? \"\"\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].LiveStateButtonNoFooter}` }, { children: \"Live\" })))] })) })));\n }\n}\nZegoRoomMobile.contextType = _context_showManage__WEBPACK_IMPORTED_MODULE_16__[\"default\"];\n\n\n//# sourceURL=webpack://zegocloud_client_sdk_web/./src/sdk/view/pages/ZegoRoomMobile/index.tsx?");
|
|
2918
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ZegoRoomMobile\": function() { return /* binding */ ZegoRoomMobile; }\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/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 _model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../model */ \"./src/sdk/model/index.ts\");\n/* harmony import */ var _index_module_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./index.module.scss */ \"./src/sdk/view/pages/ZegoRoomMobile/index.module.scss\");\n/* harmony import */ var _components_zegoOne2One__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/zegoOne2One */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoOne2One.tsx\");\n/* harmony import */ var _components_zegoMessage__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/zegoMessage */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoMessage.tsx\");\n/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../util */ \"./src/sdk/util.ts\");\n/* harmony import */ var _components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/mobile/zegoConfirm */ \"./src/sdk/view/components/mobile/zegoConfirm/index.tsx\");\n/* harmony import */ var _components_zegoUserList__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./components/zegoUserList */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoUserList.tsx\");\n/* harmony import */ var _components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./components/zegoRoomInvite */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoRoomInvite.tsx\");\n/* harmony import */ var _components_ZegoReconnect__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./components/ZegoReconnect */ \"./src/sdk/view/pages/ZegoRoomMobile/components/ZegoReconnect.tsx\");\n/* harmony import */ var _components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/mobile/zegoToast */ \"./src/sdk/view/components/mobile/zegoToast/index.tsx\");\n/* harmony import */ var _components_zegoLayout__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/zegoLayout */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoLayout.tsx\");\n/* harmony import */ var _components_zegoManage__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/zegoManage */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoManage.tsx\");\n/* harmony import */ var _components_zegoGrid__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/zegoGrid */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoGrid.tsx\");\n/* harmony import */ var _components_zegoSidebar__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./components/zegoSidebar */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoSidebar.tsx\");\n/* harmony import */ var _context_showManage__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../context/showManage */ \"./src/sdk/view/pages/context/showManage.ts\");\n/* harmony import */ var _components_zegoModel__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/zegoModel */ \"./src/sdk/view/components/zegoModel/index.tsx\");\n/* harmony import */ var _components_zegoScreen__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./components/zegoScreen */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoScreen.tsx\");\n/* harmony import */ var _components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/zegoMedia/audio */ \"./src/sdk/view/components/zegoMedia/audio.tsx\");\n/* harmony import */ var _components_zegoWhiteboard__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./components/zegoWhiteboard */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoWhiteboard.tsx\");\n/* harmony import */ var _modules_tools_util__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../../modules/tools/util */ \"./src/sdk/modules/tools/util.ts\");\n/* harmony import */ var _components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./components/zegoTimer */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoTimer.tsx\");\n/* harmony import */ var _components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./components/zegoMixPlayer */ \"./src/sdk/view/pages/ZegoRoomMobile/components/zegoMixPlayer.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\n\n/* eslint-disable jsx-a11y/anchor-has-content */\n/* eslint-disable jsx-a11y/anchor-is-valid */\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nclass ZegoRoomMobile extends (react__WEBPACK_IMPORTED_MODULE_1___default().PureComponent) {\n constructor() {\n super(...arguments);\n this.state = {\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n localStream: undefined,\n layOutStatus: \"ONE_VIDEO\",\n userLayoutStatus: this.props.core._config.layout || \"Auto\",\n zegoCloudUserList: [],\n memberList: [],\n messageList: [],\n notificationList: [],\n showMore: false,\n connecting: false,\n firstLoading: true,\n cameraFront: true,\n showFooter: true,\n isNetworkPoor: false,\n soundLevel: {},\n liveCountdown: -1,\n liveStatus: \"0\",\n screenSharingUserList: [],\n zegoSuperBoardView: null,\n isZegoWhiteboardSharing: false,\n roomTime: \"00:00:00\",\n isScreenPortrait: true,\n isRequestingCohost: false,\n unreadInviteList: new Set(),\n isMixing: \"0\",\n };\n this.micStatus = !!this.props.core._config.turnOnMicrophoneWhenJoining\n ? 1\n : 0;\n this.cameraStatus = !!this.props.core._config.turnOnCameraWhenJoining\n ? 1\n : 0;\n this.localUserPin = false;\n this.faceModel = this.props.core._config.facingMode === \"user\" ? 1 : 0;\n this.notifyTimer = null;\n this.cameraDevices = [];\n this.localStreamID = \"\";\n this.safariLimitationNoticed = -1;\n this.iosLimitationNoticed = 0;\n this.showNotSupported = 0;\n this.roomTimer = null;\n this.roomTimeNum = 0;\n this.setViewportMetaTimer = null;\n this.viewportHeight = 0;\n this.inviteModelRoot = null;\n this.onblur = (e) => {\n if (e.path &&\n !e.path.includes(document.querySelector(\"#ZegoRoomCssMobileMore\")) &&\n !e.path.includes(document.querySelector(\"#ZegoRoomCssMobilePopMore\"))) {\n this.setState({ showMore: false });\n // @ts-ignore\n document.removeEventListener(\"click\", this.onblur);\n }\n };\n this.menuOptions = {\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.ChangePin]: (value) => {\n if (this._selectedUser.userID !== this.props.core._expressConfig.userID) {\n this.props.core.setPin(this._selectedUser.userID, value);\n this.localUserPin = false;\n }\n else {\n this.localUserPin = value;\n this._selectedUser.pin = value;\n this.props.core.setPin();\n }\n this.setState({\n userLayoutStatus: \"Sidebar\",\n }, () => {\n this.handleLayoutChange(\"Sidebar\");\n });\n this.props.core.setSidebarLayOut(this.state.screenSharingUserList.length > 0 ? false : !this.localUserPin);\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteMic]: () => __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n let res;\n if (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n this.state.micOpen) {\n res = yield this.toggleMic();\n res && (this._selectedUser.streamList[0].micStatus = \"MUTE\");\n }\n else if (((_b = (_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.micStatus) === \"OPEN\") {\n res = yield this.props.core.turnRemoteMicrophoneOff(this._selectedUser.userID);\n }\n res &&\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"Turned off the microphone successfully.\",\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.MuteCamera]: () => __awaiter(this, void 0, void 0, function* () {\n var _c, _d;\n let res;\n if (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n this.state.cameraOpen) {\n res = yield this.toggleCamera();\n res && (this._selectedUser.streamList[0].cameraStatus = \"MUTE\");\n console.warn(this._selectedUser);\n }\n else if (((_d = (_c = this._selectedUser.streamList) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.cameraStatus) === \"OPEN\") {\n res = yield this.props.core.turnRemoteCameraOff(this._selectedUser.userID);\n }\n res &&\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"Turned off the camera successfully.\",\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveUser]: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Remove participant\",\n content: \"Are you sure to remove \" + this._selectedUser.userName + \" ?\",\n cancel: \"Cancel\",\n confirm: \"Confirm\",\n closeCallBack: (confirm) => {\n if (confirm) {\n this.props.core.removeMember(this._selectedUser.userID);\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }\n },\n });\n },\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.InviteCohost]: () => __awaiter(this, void 0, void 0, function* () {\n var _e;\n const res = yield ((_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.inviteJoinToCohost(this._selectedUser.userID, this._selectedUser.userName || \"\"));\n this.updateUserAttr(this._selectedUser.userID, \"invited\", true);\n let text = \"\";\n if ((res === null || res === void 0 ? void 0 : res.code) === 2) {\n text = \"Invitation has been sent.\";\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n text = \"Sent the invitation successfully.\";\n }\n else {\n text = \"Failed to send the invitation, please try again.\";\n }\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: text,\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.RemoveCohost]: () => __awaiter(this, void 0, void 0, function* () {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n const isSelf = this._selectedUser.userID === this.props.core._expressConfig.userID;\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"End the connection\",\n content: isSelf\n ? `Are you sure to end the connection with the host?`\n : \"Are you sure to end the connection with \" +\n this._selectedUser.userName +\n \" ?\",\n cancel: \"Cancel\",\n confirm: \"Yes\",\n closeCallBack: (confirm) => {\n var _a;\n if (confirm) {\n if (isSelf) {\n this.cohostToBeAudience();\n }\n else {\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.removeCohost(this._selectedUser.userID);\n }\n }\n },\n });\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.DisagreeRequestCohost]: () => __awaiter(this, void 0, void 0, function* () {\n var _f;\n const res = yield ((_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.hostRefuseRequest(this._selectedUser.userID));\n this.updateUserAttr(this._selectedUser.userID, \"requestCohost\", \"\");\n this.state.unreadInviteList.delete(this._selectedUser.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"DisagreeRequestCohost\", res);\n }),\n [_model__WEBPACK_IMPORTED_MODULE_2__.UserListMenuItemType.AgreeRequestCohost]: () => __awaiter(this, void 0, void 0, function* () {\n var _g;\n const res = yield ((_g = this.props.core._zimManager) === null || _g === void 0 ? void 0 : _g._inRoomInviteMg.hostAcceptRequest(this._selectedUser.userID));\n if ((res === null || res === void 0 ? void 0 : res.code) === 6000276) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The request for connecting has expired.\",\n });\n }\n this.updateUserAttr(this._selectedUser.userID, \"requestCohost\", \"\");\n this.state.unreadInviteList.delete(this._selectedUser.userID);\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n console.warn(\"AgreeRequestCohost\", res);\n }),\n };\n this.isCreatingWhiteboardSharing = false;\n }\n get isCDNLive() {\n var _a, _b;\n return (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_b = this.props.core._config.scenario.config) === null || _b === void 0 ? void 0 : _b.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience &&\n this.props.core._config.scenario.config.liveStreamingMode ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveStreamingMode.LiveStreaming);\n }\n get showRoomTimerUI() {\n var _a, _b;\n return (this.props.core._config.showRoomTimer &&\n ((_b = (_a = this.props.core._config) === null || _a === void 0 ? void 0 : _a.scenario) === null || _b === void 0 ? void 0 : _b.mode) !== _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming);\n }\n get showRequestToCohostButton() {\n var _a, _b;\n if (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) !== _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n return !!this.props.core._config.showRequestToCohostButton;\n }\n get showInviteToCohostButton() {\n var _a, _b;\n if (!this.props.core._config.showInviteToCohostButton)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n if ((_b = (_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.media)\n return false;\n return this.props.core.isHost(this.props.core._expressConfig.userID);\n }\n componentDidMount() {\n window.addEventListener(\"orientationchange\", this.onOrientationChange.bind(this), false);\n this.onOrientationChange();\n this.initInRoomInviteMgListener();\n this.initSDK();\n this.props.core._config.showRoomTimer && this.startRoomTimer();\n this.footerTimer = setTimeout(() => {\n this.setState({\n showFooter: false,\n });\n }, 5000);\n }\n componentWillUnmount() {\n window.removeEventListener(\"orientationchange\", this.onOrientationChange.bind(this), false);\n if (this.roomTimer) {\n clearInterval(this.roomTimer);\n this.roomTimer = null;\n }\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n }\n componentDidUpdate(preProps, preState) {\n if ((preState.notificationList.length > 0 &&\n this.state.notificationList.length > 0 &&\n preState.notificationList[preState.notificationList.length - 1]\n .messageID !==\n this.state.notificationList[this.state.notificationList.length - 1]\n .messageID) ||\n (preState.notificationList.length === 0 &&\n this.state.notificationList.length > 0)) {\n if (this.notifyTimer) {\n clearTimeout(this.notifyTimer);\n this.notifyTimer = null;\n }\n this.notifyTimer = setTimeout(() => {\n this.setState({\n notificationList: [],\n });\n }, 3000);\n }\n // if (preState.userLayoutStatus !== this.state.userLayoutStatus) {\n // this.handleLayoutChange(this.state.userLayoutStatus);\n // }\n }\n initSDK() {\n return __awaiter(this, void 0, void 0, function* () {\n this.props.core.onNetworkStatusQuality((roomID, level) => {\n this.setState({\n isNetworkPoor: level > 2,\n });\n });\n this.props.core.onNetworkStatus((roomID, type, status) => {\n if (status === \"DISCONNECTED\" && type === \"ROOM\") {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom();\n }\n else if (status === \"CONNECTING\") {\n this.setState({\n connecting: true,\n });\n }\n else if (status === \"CONNECTED\") {\n this.setState({\n connecting: false,\n firstLoading: false,\n });\n }\n });\n this.props.core.onRemoteUserUpdate((roomID, updateType, userList, allUsers) => {\n var _a;\n let notificationList = [];\n if ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showUserJoinAndLeave) {\n userList.forEach((u) => {\n notificationList.push({\n content: u.userName +\n \" \" +\n (updateType === \"ADD\" ? \"enter\" : \"quit\") +\n \" the room\",\n type: \"USER\",\n userName: u.userName,\n messageID: (0,_util__WEBPACK_IMPORTED_MODULE_6__.randomNumber)(5),\n });\n });\n }\n // 当房间只剩自己的时候，自动离开房间\n if (updateType === \"DELETE\") {\n if (this.props.core._config.autoLeaveRoomWhenOnlySelfInRoom &&\n allUsers.length === 0) {\n this.confirmLeaveRoom();\n return;\n }\n }\n this.setState((state) => {\n return {\n notificationList: [...state.notificationList, ...notificationList],\n };\n });\n });\n this.props.core.onRoomMessageUpdate((roomID, messageList) => {\n this.setState((state) => {\n var _a;\n let lowerLeftNotification = [];\n if (this.state.layOutStatus !== \"MESSAGE\" &&\n ((_a = this.props.core._config.lowerLeftNotification) === null || _a === void 0 ? void 0 : _a.showTextChat)) {\n lowerLeftNotification = [\n ...state.notificationList,\n ...messageList.map((m) => {\n return {\n content: m.message,\n type: \"MSG\",\n userName: m.fromUser.userName,\n messageID: m.messageID,\n };\n }),\n ];\n }\n return {\n messageList: [...state.messageList, ...messageList],\n notificationList: lowerLeftNotification,\n };\n });\n });\n this.props.core.subscribeUserList((userList) => {\n // ios手机 && 低于 14版本的Safari不支持多条流同时播放\n const notSupportPhone = !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isPc)() &&\n (0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)() &&\n (0,_util__WEBPACK_IMPORTED_MODULE_6__.IsLowVersionSafari)() &&\n userList.filter((u) => {\n return (u.streamList.length > 0 && u.streamList[0].micStatus === \"OPEN\");\n }).length > (this.state.screenSharingUserList.length > 0 ? 0 : 1);\n if (this.isCDNLive) {\n // 拷贝一下userList\n let userListCopy = JSON.parse(JSON.stringify(userList));\n // 有流且有一个设备是打开状态的用户数\n const userNum = userListCopy.filter((user) => user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")).length;\n // 最大可以同时播放的video\n let limitNum = 1;\n if (this.isCDNLive && !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)()) {\n // 非ios 最多同时拉6条流， http连接数限制\n limitNum = this.state.screenSharingUserList.length > 0 ? 5 : 6;\n }\n // 如果当前推流人数大于最大拉流数限制\n // 取最早进房间的user进行拉流展示\n if (userNum > limitNum) {\n let i = 0;\n let targetUsers = userListCopy\n .reverse()\n .map((user) => {\n if (user.streamList.length > 0 &&\n (user.streamList[0].cameraStatus === \"OPEN\" ||\n user.streamList[0].micStatus === \"OPEN\")) {\n if (i >= limitNum) {\n user.streamList = [];\n }\n else {\n i++;\n }\n }\n return user;\n });\n const users = targetUsers.reverse();\n // 更新用户列表\n this.setState({\n zegoCloudUserList: targetUsers,\n memberList: users, // 成员列表\n }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus, true);\n });\n if ((0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)() && this.isCDNLive && this.iosLimitationNoticed === 0) {\n this.iosLimitationNoticed = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Your current mobile system does not support the display of multiple video screens during the live streaming.\",\n okText: \"Okay\",\n });\n }\n return;\n }\n }\n else if (notSupportPhone) {\n // 只支持播放一个video的情况\n let targetUsers = userList.reverse();\n let targetUser = targetUsers.find((u) => u.streamList.length > 0 && u.streamList[0].micStatus === \"OPEN\");\n this.setState({\n zegoCloudUserList: [targetUser],\n memberList: userList,\n screenSharingUserList: [],\n });\n if (this.safariLimitationNoticed === -1) {\n this.safariLimitationNoticed = 0;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"The current browser does not support the display of multiple video screens, we suggest you change your browser.\",\n okText: \"Okay\",\n onOk: () => {\n this.safariLimitationNoticed = 1;\n this.handleLayoutChange(this.state.userLayoutStatus, true);\n },\n });\n }\n return;\n }\n this.setState({\n zegoCloudUserList: userList,\n memberList: userList,\n });\n });\n this.props.core.subscribeWhiteBoard((superBoardView) => {\n this.setState({\n zegoSuperBoardView: superBoardView,\n isZegoWhiteboardSharing: !!superBoardView,\n });\n });\n this.props.core.subscribeScreenStream((userList) => {\n const notSupportPhone = !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isPc)() &&\n (0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)() &&\n ((0,_util__WEBPACK_IMPORTED_MODULE_6__.IsLowVersionSafari)() || this.isCDNLive) &&\n this.state.zegoCloudUserList.filter((u) => {\n return (u.streamList.length > 0 &&\n (u.streamList[0].micStatus === \"OPEN\" ||\n u.streamList[0].cameraStatus === \"OPEN\"));\n }).length > 0;\n this.setState({ screenSharingUserList: notSupportPhone ? [] : userList }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus, true);\n });\n });\n this.props.core.onSoundLevelUpdate((soundLevelList) => {\n let list = {};\n soundLevelList.forEach((s) => {\n let userId = s.streamID.split(\"_\")[1];\n if (list[userId]) {\n list[userId][s.streamID] = Math.floor(s.soundLevel);\n }\n else {\n list[userId] = {\n [s.streamID]: Math.floor(s.soundLevel),\n };\n }\n });\n this.setState({\n soundLevel: list,\n });\n });\n this.props.core.onRoomLiveStateUpdate((res) => {\n this.setState((preState) => {\n return {\n liveStatus: res,\n liveCountdown: preState.liveCountdown === -1 || preState.liveCountdown === 0\n ? res === \"1\"\n ? 0\n : -1\n : preState.liveCountdown,\n };\n }, () => {\n // console.error(\"【ZEGOCLOUD】 liveStatus\", this.state.liveStatus);\n });\n });\n this.props.core.onRoomMixingStateUpdate((isMixing) => {\n this.setState({\n isMixing,\n });\n });\n this.props.core.onCoreError((code, msg) => {\n if (code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportStandardLive ||\n code === _model__WEBPACK_IMPORTED_MODULE_2__.CoreError.notSupportCDNLive) {\n if (this.showNotSupported)\n return;\n this.showNotSupported = 1;\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"The service is not available, please contact the live streaming service provider to resolve.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n });\n // 监听呼叫邀请离开房间的通知\n this.props.core._zimManager &&\n this.props.core._zimManager.notifyLeaveRoom(() => {\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom();\n });\n // 监听远端控制摄像头麦克风\n this.props.core.onChangeYourDeviceStatus((type, status, fromUser) => __awaiter(this, void 0, void 0, function* () {\n if (type === \"Camera\" && status === \"CLOSE\" && this.state.cameraOpen) {\n yield this.toggleCamera();\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n if (type === \"Microphone\" && status === \"CLOSE\" && this.state.micOpen) {\n yield this.toggleMic();\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${fromUser.userName} has turned your camera off`,\n });\n }\n }));\n this.props.core.onKickedOutRoom(() => {\n this.confirmLeaveRoom(true);\n });\n const logInRsp = yield this.props.core.enterRoom();\n let massage = \"\";\n if (logInRsp === 0) {\n this.createStream();\n setTimeout(() => __awaiter(this, void 0, void 0, function* () {\n this.props.core._config.showMyCameraToggleButton &&\n (this.cameraDevices = yield this.props.core.getCameras());\n }), 4000);\n return;\n }\n else if (logInRsp === 1002034) {\n // 登录房间的用户数超过该房间配置的最大用户数量限制（测试环境下默认房间最大用户数为 50，正式环境无限制）。\n massage =\n \"Failed to join the room, the number of people in the room has reached the maximum.(2 people)\";\n }\n else if ([1002031, 1002053].includes(logInRsp)) {\n //登录房间超时，可能是由于网络原因导致。\n massage =\n \"There's something wrong with your network. Please check it and try again.\";\n }\n else if ([1102018, 1102016, 1102020].includes(logInRsp)) {\n // 登录 token 错误，\n massage = \"Failed to join the room, token authentication error.\";\n }\n else if (1002056 === logInRsp) {\n // 用户重复进行登录。\n massage =\n \"You are on a call in another room, please leave that room first.\";\n }\n else {\n massage =\n \"Failed to join the room, please try again.(error code:\" +\n logInRsp +\n \")\";\n }\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Login room Failed\",\n contentText: massage,\n okText: \"OK\",\n });\n });\n }\n initInRoomInviteMgListener() {\n var _a, _b, _c, _d, _e, _f;\n // 收到邀请上麦的通知\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.notifyInviteToCoHost((inviterName) => {\n this.inviteModelRoot = (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Invitation\",\n content: \"The host invites you to have a connection.\",\n confirm: \"Confirm\",\n cancel: \"Disagree\",\n countdown: 60,\n closeCallBack: (confirm) => __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n if (confirm) {\n (_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceAcceptInvitation();\n // TODO 角色变更，更新config，开始推流,\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }\n else {\n (_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.audienceRefuseInvitation();\n }\n }),\n });\n });\n (_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.notifyInviteToCoHostRefused((reason, user) => {\n const { inviteeName, inviteeID } = user;\n if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Disagree) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${inviteeName} disagreed with the invitation.`,\n });\n }\n else if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Busy) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `Invitation has been sent.`,\n });\n }\n else if (reason === _model__WEBPACK_IMPORTED_MODULE_2__.ReasonForRefusedInviteToCoHost.Timeout) {\n }\n this.updateUserAttr(inviteeID, \"invited\", false);\n });\n (_c = this.props.core._zimManager) === null || _c === void 0 ? void 0 : _c._inRoomInviteMg.notifyRemoveCoHost(() => {\n // Cohost 变成 Audience，停止推流\n this.cohostToBeAudience();\n });\n (_d = this.props.core._zimManager) === null || _d === void 0 ? void 0 : _d._inRoomInviteMg.notifyRequestCoHost((inviter, state) => {\n //收到观众连麦通知，0 取消|超时， 1 申请\n // 左侧通知\n if (state === 1) {\n const notify = {\n content: `${inviter.userName} is requesting a connection with you.`,\n type: \"INVITE\",\n userName: inviter.userName,\n messageID: (0,_util__WEBPACK_IMPORTED_MODULE_6__.randomNumber)(5),\n };\n this.setState({\n notificationList: [...this.state.notificationList, notify],\n });\n }\n // 设置红点\n if (state === 1) {\n this.state.unreadInviteList.add(inviter.userID);\n }\n else {\n this.state.unreadInviteList.delete(inviter.userID);\n }\n this.setState({\n unreadInviteList: this.state.unreadInviteList,\n });\n // 设置观众状态\n this.updateUserAttr(inviter.userID, \"requestCohost\", state ? Date.now() : \"\");\n });\n (_e = this.props.core._zimManager) === null || _e === void 0 ? void 0 : _e._inRoomInviteMg.notifyHostRespondRequestCohost((respond) => __awaiter(this, void 0, void 0, function* () {\n var _g;\n if (respond === 0) {\n yield this.props.core.changeAudienceToCohostInLiveStream();\n const res = yield this.createStream();\n if (!res) {\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n }\n else if (respond === 1) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The host has rejected your request.\",\n });\n }\n else if (respond === 2) {\n (_g = this.inviteModelRoot) === null || _g === void 0 ? void 0 : _g.unmount();\n }\n this.setState({\n isRequestingCohost: false,\n });\n }));\n // 观众的连麦申请超时（观众端）\n (_f = this.props.core._zimManager) === null || _f === void 0 ? void 0 : _f._inRoomInviteMg.notifyRequestCohostTimeout(() => {\n this.setState({\n isRequestingCohost: false,\n });\n });\n }\n createStream() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.props.core._config.turnOnCameraWhenJoining &&\n !this.props.core._config.turnOnMicrophoneWhenJoining &&\n !this.props.core._config.showMyCameraToggleButton &&\n !this.props.core._config.showMyMicrophoneToggleButton) {\n return false;\n }\n if (!this.props.core.status.videoRefuse ||\n !this.props.core.status.audioRefuse) {\n try {\n let localStream = null;\n try {\n const solution = (0,_util__WEBPACK_IMPORTED_MODULE_6__.getVideoResolution)(this.props.core._config.videoResolutionList[0]);\n localStream = yield this.props.core.createStream({\n camera: Object.assign({ video: !this.props.core.status.videoRefuse, audio: !this.props.core.status.audioRefuse, videoQuality: 4, facingMode: this.faceModel ? \"user\" : \"environment\" }, solution),\n });\n }\n catch (error) {\n if (JSON.stringify(error).includes(\"constrain\")) {\n localStream = yield this.props.core.createStream({\n camera: {\n video: !this.props.core.status.videoRefuse,\n audio: !this.props.core.status.audioRefuse,\n facingMode: this.faceModel ? \"user\" : \"environment\",\n },\n });\n }\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103064) {\n this.props.core.status.videoRefuse = true;\n this.props.core.status.audioRefuse = true;\n this.setState({\n cameraOpen: false,\n micOpen: false,\n });\n }\n }\n if (!localStream)\n return false;\n this.props.core.mutePublishStreamVideo(localStream, !this.props.core._config.turnOnCameraWhenJoining);\n this.props.core.muteMicrophone(!this.props.core._config.turnOnMicrophoneWhenJoining);\n this.setState({\n localStream,\n cameraOpen: !!this.props.core._config.turnOnCameraWhenJoining,\n micOpen: !!this.props.core._config.turnOnMicrophoneWhenJoining,\n });\n const extraInfo = JSON.stringify({\n isCameraOn: !!this.props.core._config.turnOnCameraWhenJoining,\n isMicrophoneOn: this.props.core._config.turnOnMicrophoneWhenJoining,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n });\n try {\n const res = this.props.core.publishLocalStream(localStream, \"main\", extraInfo);\n if (res !== false) {\n this.localStreamID = res;\n }\n }\n catch (error) {\n // 推流失败就销毁创建的流\n console.error(\"【ZEGOCLOUD】publishStream failed:\", error);\n this.props.core.destroyStream(localStream);\n this.setState({\n localStream: null,\n });\n return false;\n }\n return true;\n }\n catch (error) {\n console.error(\"【ZEGOCLOUD】createStream or publishLocalStream failed,Reason: \", JSON.stringify(error));\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103065 || (error === null || error === void 0 ? void 0 : error.code) === 1103061) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The audio and video equipment is being occupied by another application.\",\n });\n }\n if ((error === null || error === void 0 ? void 0 : error.code) === 1103064) {\n this.props.core.status.videoRefuse = true;\n this.props.core.status.audioRefuse = true;\n this.setState({\n cameraOpen: false,\n micOpen: false,\n });\n }\n return false;\n }\n }\n else {\n return false;\n }\n });\n }\n stopPublish() {\n try {\n this.localStreamID &&\n this.props.core.stopPublishingStream(this.localStreamID);\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.setState({\n localStream: null,\n });\n this.localStreamID = \"\";\n }\n catch (error) {\n console.error(error);\n }\n }\n toggleMic() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.audioRefuse) {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Equipment authorization\",\n content: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n confirm: \"Okay\",\n });\n return;\n }\n if (this.micStatus === -1)\n return;\n this.micStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getAudioTracks().length > 0) {\n result = yield this.props.core.muteMicrophone(this.state.micOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: this.state.cameraOpen,\n isMicrophoneOn: !this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.micStatus = !this.state.micOpen ? 1 : 0;\n if (result) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The microphone is \" + (this.micStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n micOpen: !!this.micStatus,\n }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus);\n });\n }\n return !!result;\n });\n }\n toggleCamera() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.videoRefuse) {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Equipment authorization\",\n content: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n confirm: \"Okay\",\n });\n return;\n }\n if (this.cameraStatus === -1)\n return;\n this.cameraStatus = -1;\n let result;\n if (this.state.localStream &&\n this.state.localStream.getVideoTracks().length > 0) {\n result = yield this.props.core.mutePublishStreamVideo(this.state.localStream, this.state.cameraOpen);\n yield this.props.core.setStreamExtraInfo(this.localStreamID, JSON.stringify({\n isCameraOn: !this.state.cameraOpen,\n isMicrophoneOn: this.state.micOpen,\n hasVideo: !this.props.core.status.videoRefuse,\n hasAudio: !this.props.core.status.audioRefuse,\n }));\n }\n this.cameraStatus = !this.state.cameraOpen ? 1 : 0;\n if (result) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: \"The camera is \" + (this.cameraStatus ? \"on\" : \"off\"),\n });\n result &&\n this.setState({\n cameraOpen: !!this.cameraStatus,\n }, () => {\n this.handleLayoutChange(this.state.userLayoutStatus);\n });\n }\n return !!result;\n });\n }\n switchCamera() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.props.core.status.videoRefuse) {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Equipment authorization\",\n content: \"We can't detect your devices. Please check your devices and allow us access your devices in your browser's address bar. Then reload this page and try again.\",\n confirm: \"Okay\",\n });\n return;\n }\n if (this.cameraDevices.length === 0) {\n this.cameraDevices = yield this.props.core.getCameras();\n }\n if (!this.state.localStream || this.cameraDevices.length < 2) {\n return;\n }\n let targetModel = false;\n if (this.faceModel === -1) {\n return;\n }\n else if (this.faceModel === 0) {\n targetModel = true;\n }\n this.faceModel = -1;\n this.state.localStream.getVideoTracks()[0].stop();\n this.state.localStream.getAudioTracks()[0].stop();\n try {\n const solution = (0,_util__WEBPACK_IMPORTED_MODULE_6__.getVideoResolution)(this.props.core._config.videoResolutionList[0]);\n const stream = yield this.props.core.createStream({\n camera: Object.assign({ video: !this.props.core.status.videoRefuse, audio: !this.props.core.status.audioRefuse, videoQuality: 4, facingMode: !this.state.cameraFront ? \"user\" : \"environment\" }, solution),\n });\n let videoTrack = stream.getVideoTracks()[0];\n !this.state.cameraOpen && (videoTrack.enabled = false);\n let audioTrack = stream.getAudioTracks()[0];\n yield this.props.core.replaceTrack(this.state.localStream, videoTrack);\n yield this.props.core.replaceTrack(this.state.localStream, audioTrack);\n }\n catch (error) {\n console.error(\"【ZEGOCLOUD】switch camera failed!\", error);\n }\n this.faceModel = targetModel ? 1 : 0;\n this.setState({\n cameraFront: targetModel,\n });\n });\n }\n toggleLayOut(layOutStatus) {\n this.setState((state) => {\n return {\n layOutStatus: state.layOutStatus === layOutStatus ? \"ONE_VIDEO\" : layOutStatus,\n showMore: false,\n };\n });\n }\n sendMessage(msg) {\n return __awaiter(this, void 0, void 0, function* () {\n let messageID = (0,_util__WEBPACK_IMPORTED_MODULE_6__.randomNumber)(3);\n this.setState((state) => {\n return {\n messageList: [\n ...state.messageList,\n {\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n message: msg,\n sendTime: Date.now(),\n messageID,\n status: \"SENDING\",\n },\n ],\n };\n });\n let resp = {};\n try {\n resp = yield this.props.core.sendRoomMessage(msg);\n }\n catch (err) {\n console.error(\"【ZEGOCLOUD】sendMessage failed!\", JSON.stringify(err));\n }\n this.setState((state) => {\n const _messageList = state.messageList.map((msg) => {\n if (msg.messageID === messageID) {\n msg.status = resp.errorCode === 0 ? \"SENDED\" : \"FAILED\";\n }\n return msg;\n });\n console.log(_messageList);\n return {\n messageList: _messageList,\n };\n });\n });\n }\n openMore() {\n this.setState((state) => {\n return { showMore: !state.showMore };\n }, () => {\n if (this.state.showMore) {\n // @ts-ignore\n document.addEventListener(\"click\", this.onblur);\n }\n else {\n // @ts-ignore\n document.removeEventListener(\"click\", this.onblur);\n }\n });\n }\n leaveRoom() {\n (0,_components_mobile_zegoConfirm__WEBPACK_IMPORTED_MODULE_7__.ZegoConfirm)({\n title: \"Leave the room\",\n content: \"Are you sure to leave the room?\",\n cancel: \"Cancel\",\n confirm: \"Confirm\",\n closeCallBack: (confirm) => {\n if (confirm) {\n this.confirmLeaveRoom();\n }\n },\n });\n }\n cohostToBeAudience() {\n this.stopPublish();\n // this.setState({\n // showLayoutSettings: false,\n // showSettings: false,\n // });\n this.props.core.changeCohostToAudienceInLiveStream();\n }\n handleRequestCohost() {\n var _a, _b;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.isRequestingCohost) {\n yield ((_a = this.props.core._zimManager) === null || _a === void 0 ? void 0 : _a._inRoomInviteMg.audienceCancelRequest());\n this.setState({\n isRequestingCohost: false,\n });\n }\n else {\n const res = yield ((_b = this.props.core._zimManager) === null || _b === void 0 ? void 0 : _b._inRoomInviteMg.requestCohost());\n if ((res === null || res === void 0 ? void 0 : res.code) === 0) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `You've applied for connection, please wait for the host's confirmation.`,\n });\n this.setState({\n isRequestingCohost: true,\n });\n }\n else if ((res === null || res === void 0 ? void 0 : res.code) === 1) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `The host has left the room.`,\n });\n }\n else {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `Failed to send application, please try again.`,\n });\n }\n }\n });\n }\n updateUserAttr(userID, attr, value) {\n const userList = this.state.zegoCloudUserList.map((user) => {\n if (user.userID === userID) {\n user[attr] = value;\n }\n return user;\n });\n this.setState({\n zegoCloudUserList: userList,\n });\n }\n confirmLeaveRoom(isKickedOut = false) {\n var _a, _b, _c, _d;\n if (((_b = (_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.role) !== _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n this.props.core._config.turnOnCameraWhenJoining = this.state.cameraOpen;\n this.props.core._config.turnOnMicrophoneWhenJoining = this.state.micOpen;\n }\n (_d = (_c = this.props.core._zimManager) === null || _c === void 0 ? void 0 : _c._inRoomInviteMg) === null || _d === void 0 ? void 0 : _d.audienceCancelRequest();\n this.state.localStream &&\n this.props.core.destroyStream(this.state.localStream);\n this.props.core.leaveRoom();\n this.props.leaveRoom && this.props.leaveRoom(isKickedOut);\n }\n getAllUser() {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n pin: this.localUserPin,\n avatar: this.props.core._expressConfig.avatar,\n streamList: [\n {\n media: this.state.localStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: this.state.micOpen ? \"OPEN\" : \"MUTE\",\n cameraStatus: this.state.cameraOpen ? \"OPEN\" : \"MUTE\",\n state: \"PLAYING\",\n streamID: this.localStreamID,\n },\n ],\n },\n ...this.state.zegoCloudUserList,\n ];\n }\n getAllMemberList() {\n return [\n {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n pin: this.localUserPin,\n avatar: this.props.core._expressConfig.avatar,\n streamList: [\n {\n media: this.state.localStream,\n fromUser: {\n userID: this.props.core._expressConfig.userID,\n userName: this.props.core._expressConfig.userName,\n },\n micStatus: this.state.micOpen ? \"OPEN\" : \"MUTE\",\n cameraStatus: this.state.cameraOpen ? \"OPEN\" : \"MUTE\",\n state: \"PLAYING\",\n streamID: this.localStreamID,\n },\n ],\n },\n ...this.state.memberList,\n ];\n }\n getShownUser() {\n const shownUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser) {\n if (item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS)) {\n if (item.streamList[0].cameraStatus === \"OPEN\") {\n return true;\n }\n else if (this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n }\n else {\n return false;\n }\n }\n else {\n return true;\n }\n });\n // if (\n // this._selectedUser &&\n // !shownUser.some((su) => su.userID === this._selectedUser.userID) &&\n // this.state.layOutStatus === \"MANAGE\"\n // ) {\n // this.setState({\n // layOutStatus: \"ONE_VIDEO\",\n // });\n // }\n return shownUser;\n }\n getHiddenUser() {\n const hiddenUser = this.getAllUser().filter((item) => {\n if (!this.props.core._config.showNonVideoUser &&\n item.streamList &&\n item.streamList[0] &&\n (item.streamList[0].media ||\n item.streamList[0].urlsHttpsFLV ||\n item.streamList[0].urlsHttpsHLS) &&\n item.streamList[0].cameraStatus !== \"OPEN\" &&\n !this.props.core._config.showOnlyAudioUser &&\n item.streamList[0].micStatus === \"OPEN\") {\n return true;\n }\n else {\n return false;\n }\n });\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: hiddenUser.map((user) => {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMedia_audio__WEBPACK_IMPORTED_MODULE_19__[\"default\"], { muted: user.userID === this.props.core._expressConfig.userID, userInfo: user }, user.userID + \"_hiddenAudio\"));\n }) }));\n }\n manageSelectCallback(type, value) {\n return __awaiter(this, void 0, void 0, function* () {\n this.menuOptions[type](value);\n });\n }\n get showSelf() {\n if (this.props.core._config.showNonVideoUser) {\n return true;\n }\n else {\n if (this.props.core._config.showOnlyAudioUser) {\n return (this.localStreamID && (this.state.micOpen || this.state.cameraOpen));\n }\n else {\n return this.localStreamID && this.state.cameraOpen;\n }\n }\n }\n handleLayoutChange(selectLayout, stopUpdateUser) {\n return __awaiter(this, void 0, void 0, function* () {\n if (selectLayout !== \"Sidebar\") {\n this._selectedUser && (this._selectedUser.pin = false);\n this.localUserPin = false;\n this.props.core.setPin(undefined, undefined, true);\n }\n this.setState({\n userLayoutStatus: selectLayout,\n });\n return new Promise((resolve, reject) => __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length) {\n if (!this.state.isScreenPortrait) {\n // 横屏下隐藏顶部视频\n yield this.props.core.setMaxScreenNum(0, true);\n }\n else {\n yield this.props.core.setMaxScreenNum(this.showSelf ? 3 : 4, true);\n }\n }\n else if (selectLayout !== \"Sidebar\") {\n yield this.props.core.setMaxScreenNum(this.showSelf ? 5 : 6, true);\n }\n else {\n yield this.props.core.setMaxScreenNum(this.showSelf ? 4 : 5, true);\n }\n let sidebarEnabled = false;\n if (selectLayout === \"Sidebar\") {\n if (this.state.cameraOpen || this.state.micOpen) {\n sidebarEnabled = !this.localUserPin;\n }\n else {\n sidebarEnabled = true;\n }\n }\n yield this.props.core.setSidebarLayOut(this.state.screenSharingUserList.length > 0 ? false : sidebarEnabled, stopUpdateUser);\n }));\n });\n }\n get showTurnOffMicrophoneButton() {\n var _a, _b, _c, _d, _e;\n if (!this.props.core._config.showTurnOffRemoteMicrophoneButton)\n return false;\n if (((_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a.length) === 0)\n return false;\n return (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n ((_e = (_d = this.props.core._config.scenario) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n get showTurnOffCameraButton() {\n var _a, _b, _c, _d, _e;\n if (!this.props.core._config.showTurnOffRemoteCameraButton)\n return false;\n if (((_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a.length) === 0)\n return false;\n return (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host ||\n (this._selectedUser.userID === this.props.core._expressConfig.userID &&\n ((_e = (_d = this.props.core._config.scenario) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost));\n }\n get showRemoveButton() {\n var _a, _b, _c, _d, _e;\n if (!this.props.core._config.showRemoveUserButton)\n return false;\n if (this.props.core.isHost(this._selectedUser.userID))\n return false;\n return (((_c = (_b = (_a = this.props.core._config) === null || _a === void 0 ? void 0 : _a.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host &&\n (this._selectedUser.userID !== this.props.core._expressConfig.userID ||\n ((_e = (_d = this._selectedUser) === null || _d === void 0 ? void 0 : _d.streamList) === null || _e === void 0 ? void 0 : _e.length) === 0));\n }\n get isShownPin() {\n var _a, _b, _c, _d, _e, _f, _g;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.OneONoneCall) {\n return false;\n }\n let showPinButton = !!this.props.core._config.showPinButton;\n return (showPinButton &&\n (this.props.core._config.showNonVideoUser ||\n ((_d = (_c = (_b = this._selectedUser) === null || _b === void 0 ? void 0 : _b.streamList) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.cameraStatus) === \"OPEN\" ||\n (((_g = (_f = (_e = this._selectedUser) === null || _e === void 0 ? void 0 : _e.streamList) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.micStatus) === \"OPEN\" &&\n !!this.props.core._config.showOnlyAudioUser)) &&\n this.getShownUser().length > 1);\n }\n get showRemoveCohostButton() {\n var _a, _b;\n if (!this.props.core._config.showRemoveCohostButton)\n return false;\n if (this.state.liveStatus === \"0\")\n return false;\n if (!((_b = (_a = this._selectedUser.streamList) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.media))\n return false;\n if (this.props.core.isHost(this.props.core._expressConfig.userID)) {\n return (this._selectedUser.userID !== this.props.core._expressConfig.userID);\n }\n else {\n return (this._selectedUser.userID === this.props.core._expressConfig.userID);\n }\n }\n showManager(user) {\n if (!user)\n return false;\n return (this.showTurnOffMicrophoneButton ||\n this.showTurnOffCameraButton ||\n this.showRemoveButton ||\n this.isShownPin);\n }\n getListScreen() {\n let pages;\n if (this.state.layOutStatus === \"INVITE\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoRoomInvite__WEBPACK_IMPORTED_MODULE_9__.ZegoRoomInvite, { core: this.props.core, closeCallBack: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } }));\n }\n else if (this.state.layOutStatus === \"USER_LIST\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoUserList__WEBPACK_IMPORTED_MODULE_8__.ZegoUserList, { core: this.props.core, userList: this.getAllMemberList(), closeCallBack: (_user) => {\n _user && (this._selectedUser = _user);\n if (_user === null || _user === void 0 ? void 0 : _user.requestCohost)\n return;\n this.setState({\n layOutStatus: this.showManager(_user) ? \"MANAGE\" : \"ONE_VIDEO\",\n });\n }, handleMenuItem: (type, user) => {\n user && (this._selectedUser = user);\n this.menuOptions[type]();\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } }));\n }\n else if (this.state.layOutStatus === \"MESSAGE\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMessage__WEBPACK_IMPORTED_MODULE_5__.ZegoMessage, { userID: this.props.core._expressConfig.userID, messageList: this.state.messageList, sendMessage: (msg) => {\n this.sendMessage(msg);\n }, getAvatar: (userID) => {\n const user = this.getAllMemberList().find((u) => u.userID === userID);\n return (user === null || user === void 0 ? void 0 : user.avatar) || \"\";\n }, closeCallBac: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n } }));\n }\n else if (this.state.layOutStatus === \"LAYOUT\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoLayout__WEBPACK_IMPORTED_MODULE_12__.ZegoLayout, { selectLayout: this.state.userLayoutStatus, closeCallBac: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }, selectCallBack: this.handleLayoutChange.bind(this) }));\n }\n else if (this.state.layOutStatus === \"MANAGE\") {\n pages = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoManage__WEBPACK_IMPORTED_MODULE_13__.ZegoManage, { closeCallback: () => {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }, selectCallback: this.manageSelectCallback.bind(this), selectedUser: this._selectedUser, showPinButton: this.isShownPin, showMicButton: this.showTurnOffMicrophoneButton, showCameraButton: this.showTurnOffCameraButton, showRemoveButton: this.showRemoveButton, showRemoveCohostButton: this.showRemoveCohostButton, showInviteToCohostButton: this.showInviteToCohostButton }));\n }\n if (pages) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].mask} zegocloud_layout_Mask`, onClick: (ev) => {\n // @ts-ignore\n const className = ev.target.className;\n if (className.includes(\"zegocloud_layout_Mask\")) {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n }\n } }, { children: pages })));\n }\n }\n getLayoutScreen() {\n var _a, _b, _c, _d, _e;\n if (((_a = this.props.core._config.scenario) === null || _a === void 0 ? void 0 : _a.mode) === _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming) {\n const hasVideo = [\n ...this.getAllUser(),\n ...this.state.screenSharingUserList,\n ].some((u) => {\n if (u.streamList) {\n return u.streamList.some((s) => {\n return s.cameraStatus === \"OPEN\" || s.micStatus === \"OPEN\";\n });\n }\n return false;\n });\n if (((_c = (_b = this.props.core._config.scenario) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n if (this.state.liveStatus !== \"1\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveNotStart} zegoUserVideo_click` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"The Live has not started yet\" })] })));\n }\n else if (hasVideo &&\n this.props.core._config.scenario.config.enableVideoMixing &&\n this.props.core._config.scenario.config.role === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].mixVideoWrapper }, { children: [this.state.isScreenPortrait &&\n this.state.screenSharingUserList.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: this.state.screenSharingUserList[0].userName }), \" \", \"is presenting.\"] }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoMixPlayer__WEBPACK_IMPORTED_MODULE_23__.ZegoMixPlayer, { userInfo: this.props.core.mixUser, showFullScreen: this.state.liveStatus === \"1\" &&\n ((_e = (_d = this.props.core._config.scenario) === null || _d === void 0 ? void 0 : _d.config) === null || _e === void 0 ? void 0 : _e.enableVideoMixing), isPureAudio: this.props.core.zum.isPureAudio })] })));\n }\n }\n if (!hasVideo) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].noOneStreaming} zegoUserVideo_click` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"No one has turned on the camera or microphone yet.\" })] })));\n }\n }\n if (this.state.screenSharingUserList.length > 0) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.state.isScreenPortrait && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"p\", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: this.state.screenSharingUserList[0].userName }), \" is presenting.\"] }), this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }))] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoScreen__WEBPACK_IMPORTED_MODULE_18__.ZegoScreen, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), screenSharingUser: this.state.screenSharingUserList[0], videoShowNumber: 5, soundLevel: this.state.soundLevel })] }));\n }\n if (this.state.isZegoWhiteboardSharing) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.state.isScreenPortrait && this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoWhiteboard__WEBPACK_IMPORTED_MODULE_20__.ZegoWhiteboard, { userList: this.getShownUser(), videoShowNumber: 5, selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, \n // isSelfScreen={this.state.isWhiteboardSharingBySelf}\n soundLevel: this.state.soundLevel, roomID: this.props.core._expressConfig.roomID, onShow: (el) => __awaiter(this, void 0, void 0, function* () {\n var _f;\n // 主动渲染\n if (this.isCreatingWhiteboardSharing &&\n !this.state.zegoSuperBoardView) {\n try {\n const zegoSuperBoardView = yield this.props.core.createAndPublishWhiteboard(el, this.props.core._expressConfig.userName);\n this.setState({\n isWhiteboardSharingBySelf: true,\n zegoSuperBoardView,\n });\n }\n catch (error) {\n console.error(\"createAndPublishWhiteboard\", error);\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Notice\",\n contentText: \"Operation too frequent, failed to load the whiteboard.\",\n okText: \"Okay\",\n }, document.querySelector(`.${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom}`));\n }\n this.isCreatingWhiteboardSharing = false;\n }\n else if (this.state.zegoSuperBoardView) {\n // 被动渲染\n const uniqueID = (_f = this.state.zegoSuperBoardView\n .getCurrentSuperBoardSubView()) === null || _f === void 0 ? void 0 : _f.getModel().uniqueID;\n uniqueID &&\n this.state.zegoSuperBoardView.switchSuperBoardSubView(uniqueID);\n }\n }), onResize: (el) => {\n // 主动渲染\n }, onclose: () => {\n this.toggleWhiteboardSharing();\n }, onToolChange: (type, fontSize, color) => {\n this.props.core.setWhiteboardToolType(type, fontSize, color);\n }, onFontChange: (font, fontSize, color) => {\n this.props.core.setWhiteboardFont(font, fontSize, color);\n }, onImageAdd: () => __awaiter(this, void 0, void 0, function* () { }), zegoSuperBoardView: this.state.zegoSuperBoardView })] }));\n }\n if ((this.state.userLayoutStatus === \"Auto\" &&\n this.getShownUser().length < 3) ||\n this.getShownUser().length < 2) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoOne2One__WEBPACK_IMPORTED_MODULE_4__.ZegoOne2One, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), soundLevel: this.state.soundLevel, onLocalStreamPaused: () => __awaiter(this, void 0, void 0, function* () {\n yield this.props.core.enableVideoCaptureDevice(this.state.localStream, !this.state.cameraOpen);\n this.props.core.enableVideoCaptureDevice(this.state.localStream, this.state.cameraOpen);\n }), showTimerUI: this.showRoomTimerUI })] }));\n }\n else if ((this.state.userLayoutStatus === \"Grid\" &&\n this.getShownUser().length > 1) ||\n (this.state.userLayoutStatus === \"Auto\" && this.getShownUser().length > 2)) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoGrid__WEBPACK_IMPORTED_MODULE_14__.ZegoGrid, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), videoShowNumber: 6, soundLevel: this.state.soundLevel })] }));\n }\n else if (this.state.userLayoutStatus === \"Sidebar\" &&\n this.getShownUser().length > 1) {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.showRoomTimerUI && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].screenTopBar} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].center}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoTimer__WEBPACK_IMPORTED_MODULE_22__.ZegoTimer, { time: this.state.roomTime }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_zegoSidebar__WEBPACK_IMPORTED_MODULE_15__.ZegoSidebar, { selfInfo: {\n userID: this.props.core._expressConfig.userID,\n }, userList: this.getShownUser(), videoShowNumber: 5, soundLevel: this.state.soundLevel })] }));\n }\n }\n clickVideo(e) {\n var _a, _b;\n // @ts-ignore\n let className = e.target.className;\n let whiteboardClick = false;\n if (\n // @ts-ignore\n ((_a = e.target) === null || _a === void 0 ? void 0 : _a.id).startsWith(\"zego-whiteboard-\") &&\n // @ts-ignore\n e.target.parentElement) {\n // @ts-ignore\n className = (_b = e.target.parentElement) === null || _b === void 0 ? void 0 : _b.className;\n whiteboardClick = true;\n }\n if (className.includes(\"zegoUserVideo_videoCommon\") ||\n className.includes(\"zegoMore_more\") ||\n className.includes(\"ZegoRoomMobile_ZegoRoom\") ||\n className.includes(\"zegoUserVideo_click\")) {\n if (!this.state.showFooter) {\n // 横屏白板不展示底部工具栏\n if (!this.state.isZegoWhiteboardSharing ||\n this.state.isScreenPortrait) {\n this.setState({ showFooter: true });\n }\n }\n else {\n if (this.state.layOutStatus !== \"ONE_VIDEO\") {\n this.setState({\n layOutStatus: \"ONE_VIDEO\",\n });\n clearTimeout(this.footerTimer);\n this.footerTimer = setTimeout(() => {\n this.setState({ showFooter: false, showMore: false });\n }, 5000);\n }\n else {\n this.setState({ showFooter: false, showMore: false });\n }\n }\n !whiteboardClick && e.stopPropagation();\n }\n else {\n clearTimeout(this.footerTimer);\n this.footerTimer = setTimeout(() => {\n !this.state.showMore &&\n this.setState({ showFooter: false, showMore: false });\n }, 5000);\n }\n }\n setLive() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n (0,_components_zegoModel__WEBPACK_IMPORTED_MODULE_17__.ZegoModelShow)({\n header: \"Stop broadcast\",\n contentText: \"Are you sure to stop broadcasting?\",\n okText: \"Stop\",\n cancelText: \"Cancel\",\n onOk: () => __awaiter(this, void 0, void 0, function* () {\n // stop live\n yield this.props.core.setLive(\"stop\");\n this.setState({\n liveCountdown: -1,\n });\n }),\n });\n }\n else if (this.state.liveCountdown === -1) {\n this.setState({\n liveCountdown: 3,\n }, () => {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n });\n }\n });\n }\n liveCountdownTimer() {\n this.setState((preState) => {\n return {\n liveCountdown: preState.liveCountdown - 1,\n };\n }, () => __awaiter(this, void 0, void 0, function* () {\n if (this.state.liveCountdown === 0) {\n yield this.props.core.setLive(\"live\");\n }\n else {\n setTimeout(() => {\n this.liveCountdownTimer();\n }, 1000);\n }\n }));\n }\n toggleWhiteboardSharing() {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length > 0)\n return;\n if (this.state.isZegoWhiteboardSharing) {\n this.closeWhiteboardSharing();\n }\n else if (!this.state.isZegoWhiteboardSharing) {\n this.createWhiteboardSharing();\n }\n });\n }\n createWhiteboardSharing() {\n var _a;\n return __awaiter(this, void 0, void 0, function* () {\n if (this.state.screenSharingUserList.length > 0) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${this.state.screenSharingUserList[0].userName} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n else if (this.state.zegoSuperBoardView) {\n (0,_components_mobile_zegoToast__WEBPACK_IMPORTED_MODULE_11__.ZegoToast)({\n content: `${(_a = this.state.zegoSuperBoardView.getCurrentSuperBoardSubView()) === null || _a === void 0 ? void 0 : _a.getModel.name} is presenting now. You cannot share your whiteboard.`,\n });\n return;\n }\n if (this.isCreatingWhiteboardSharing)\n return;\n this.isCreatingWhiteboardSharing = true;\n this.setState({\n isZegoWhiteboardSharing: true,\n showFooter: this.state.isScreenPortrait ? this.state.showFooter : false,\n });\n });\n }\n closeWhiteboardSharing() {\n try {\n this.state.zegoSuperBoardView &&\n this.props.core.destroyAndStopPublishWhiteboard();\n this.setState({\n isWhiteboardSharingBySelf: false,\n isZegoWhiteboardSharing: false,\n zegoSuperBoardView: null,\n });\n this.isCreatingWhiteboardSharing = false;\n }\n catch (error) {\n console.error(error);\n }\n }\n startRoomTimer() {\n if (this.roomTimer)\n return;\n this.roomTimer = setInterval(() => {\n this.setState({ roomTime: (0,_modules_tools_util__WEBPACK_IMPORTED_MODULE_21__.formatTime)(++this.roomTimeNum) });\n }, 1000);\n }\n onOrientationChange() {\n var _a;\n let isScreenPortrait = this.state.isScreenPortrait;\n (_a = this.props.core._config.container) === null || _a === void 0 ? void 0 : _a.querySelectorAll(\"input\").forEach((el) => el.blur());\n if (window.orientation === 180 || window.orientation === 0) {\n // 竖屏\n isScreenPortrait = true;\n }\n if (window.orientation === 90 || window.orientation === -90) {\n // 横屏\n isScreenPortrait = false;\n }\n if (!isScreenPortrait) {\n this.setState({ showFooter: false });\n }\n this.setState({\n isScreenPortrait: isScreenPortrait,\n }, () => {\n if (!isScreenPortrait && !(0,_util__WEBPACK_IMPORTED_MODULE_6__.isIOS)()) {\n this.setViewportMeta();\n }\n else {\n if (this.setViewportMetaTimer) {\n clearTimeout(this.setViewportMetaTimer);\n this.setViewportMetaTimer = null;\n }\n }\n setTimeout(() => {\n var _a, _b;\n (_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.reloadView();\n }, 300);\n });\n }\n // 解决横屏时键盘弹起导致视窗高度变小，页面缩小的问题\n setViewportMeta() {\n var _a;\n if (this.viewportHeight)\n return;\n let metaEl = document.querySelector(\"meta[name=viewport]\");\n let content = \"\";\n if (window.outerHeight > window.outerWidth) {\n this.setViewportMetaTimer = setTimeout(() => {\n this.setViewportMeta();\n this.setViewportMetaTimer = null;\n }, 100);\n return;\n }\n else {\n this.viewportHeight = window.outerHeight;\n }\n const height = \"height=\" + this.viewportHeight;\n if (metaEl) {\n let contentArr = metaEl.content\n .split(\",\")\n .filter((attr) => !attr.includes(\"height=\"));\n contentArr.push(height);\n content = contentArr.join(\",\");\n }\n else {\n metaEl = document.createElement(\"meta\");\n metaEl.name = \"viewport\";\n (_a = document.querySelector(\"header\")) === null || _a === void 0 ? void 0 : _a.appendChild(metaEl);\n }\n metaEl.content = content;\n }\n render() {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;\n const startIndex = this.state.notificationList.length < 4\n ? 0\n : this.state.notificationList.length - 2;\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_context_showManage__WEBPACK_IMPORTED_MODULE_16__[\"default\"].Provider, Object.assign({ value: {\n show: (_user) => {\n _user && (this._selectedUser = _user);\n this.setState({\n layOutStatus: this.showManager(_user) ? \"MANAGE\" : \"ONE_VIDEO\",\n });\n },\n liveStatus: this.state.liveStatus,\n showPinButton: (!!this.props.core._config.showPinButton ||\n !!this.props.core._config.showTurnOffRemoteCameraButton ||\n !!this.props.core._config.showTurnOffRemoteMicrophoneButton ||\n !!this.props.core._config.showRemoveUserButton) &&\n this.getShownUser().length > 1,\n whiteboard_page: ((_b = (_a = this.state.zegoSuperBoardView) === null || _a === void 0 ? void 0 : _a.getCurrentSuperBoardSubView()) === null || _b === void 0 ? void 0 : _b.getCurrentPage()) || 1,\n whiteboard_toolType: ((_c = this.props.core.zegoSuperBoard) === null || _c === void 0 ? void 0 : _c.getToolType()) || 0,\n whiteboard_fontSize: ((_d = this.props.core.zegoSuperBoard) === null || _d === void 0 ? void 0 : _d.getFontSize()) || 0,\n whiteboard_brushSize: ((_e = this.props.core.zegoSuperBoard) === null || _e === void 0 ? void 0 : _e.getBrushSize()) || 0,\n whiteboard_brushColor: ((_f = this.props.core.zegoSuperBoard) === null || _f === void 0 ? void 0 : _f.getBrushColor()) || \"\",\n whiteboard_isFontBold: (_g = this.props.core.zegoSuperBoard) === null || _g === void 0 ? void 0 : _g.isFontBold(),\n whiteboard_isFontItalic: (_h = this.props.core.zegoSuperBoard) === null || _h === void 0 ? void 0 : _h.isFontItalic(),\n whiteboard_showAddImage: (_j = this.props.core._config.whiteboardConfig) === null || _j === void 0 ? void 0 : _j.showAddImageButton,\n whiteboard_showCreateClose: (_k = this.props.core._config.whiteboardConfig) === null || _k === void 0 ? void 0 : _k.showCreateAndCloseButton,\n userInfo: { userID: this.props.core._expressConfig.userID },\n } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].ZegoRoom} ZegoRoomMobile_ZegoRoom ${((_l = this.props.core._config.scenario) === null || _l === void 0 ? void 0 : _l.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming\n ? ((_o = (_m = this.props.core._config.scenario) === null || _m === void 0 ? void 0 : _m.config) === null || _o === void 0 ? void 0 : _o.role) === _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].host\n : ((_q = (_p = this.props.core._config.scenario) === null || _p === void 0 ? void 0 : _p.config) === null || _q === void 0 ? void 0 : _q.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Audience\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].audience\n : \"\"\n : \"\"}`, onClick: (e) => {\n // @ts-ignore\n this.clickVideo(e);\n } }, { children: [this.getLayoutScreen(), this.state.isNetworkPoor && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].network })), (this.state.showFooter || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].footer }, { children: [this.props.core._config.showMyCameraToggleButton &&\n (((_r = this.props.core._config.scenario) === null || _r === void 0 ? void 0 : _r.mode) !==\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming ||\n ((_t = (_s = this.props.core._config.scenario) === null || _s === void 0 ? void 0 : _s.config) === null || _t === void 0 ? void 0 : _t.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Cohost) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].switchCamera}`, onClick: () => {\n this.switchCamera();\n } })), this.props.core._config.showMyCameraToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: this.state.cameraOpen\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].toggleCamera\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].cameraClose, onClick: () => {\n this.toggleCamera();\n } })), this.props.core._config.showMyMicrophoneToggleButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: this.state.micOpen\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].toggleMic\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].micClose, onClick: () => {\n this.toggleMic();\n } })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", { className: ((_u = this.props.core._config.scenario) === null || _u === void 0 ? void 0 : _u.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].liveLeaveButton\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].leaveRoom, onClick: () => {\n this.leaveRoom();\n } }), (this.props.core._config.showTextChat ||\n this.props.core._config.showUserList ||\n this.props.core._config.sharedLinks) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"a\", Object.assign({ id: \"ZegoRoomCssMobileMore\", className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].more} ${!this.state.showMore && this.state.unreadInviteList.size > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].moreRedPoint\n : \"\"}`, onClick: () => {\n this.openMore();\n } }, { children: [(this.state.showMore || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ id: \"ZegoRoomCssMobilePopMore\", className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popMore} ${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popLiveMore}` }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popMoreContent }, { children: [this.props.core._config.showMyCameraToggleButton &&\n ((_v = this.props.core._config.scenario) === null || _v === void 0 ? void 0 : _v.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_w = this.props.core._config.scenario.config) === null || _w === void 0 ? void 0 : _w.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].switchCamera} zegoUserVideo_click`, onClick: () => {\n this.switchCamera();\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].switchCamera} zegoUserVideo_click` }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Flip\" })] }))), this.props.core._config.showRoomDetailsButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].roomDetail, onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"INVITE\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].details }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Room details\" })] }))), this.props.core._config.showUserList && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: `${this.state.unreadInviteList.size > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].unread\n : \"\"}`, onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"USER_LIST\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].member }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Member\" })] }))), this.props.core._config.showTextChat && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"MESSAGE\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].chat }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Chat\" })] }))), this.props.core._config.showLayoutButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"LAYOUT\");\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].layout }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Layout\" })] }))), this.showRequestToCohostButton && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.handleRequestCohost();\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: `${this.state.isRequestingCohost\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].connected\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].connect} ` }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Connect\" })] }))), ((_x = this.props.core._config.plugins) === null || _x === void 0 ? void 0 : _x.ZegoSuperBoardManager) &&\n ((_y = this.props.core._config.whiteboardConfig) === null || _y === void 0 ? void 0 : _y.showCreateAndCloseButton) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ onClick: (ev) => {\n ev.stopPropagation();\n this.toggleLayOut(\"WHITEBOARD\");\n this.toggleWhiteboardSharing();\n } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", { className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].whiteboard} ${this.state.isZegoWhiteboardSharing\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].sharing\n : \"\"} ${this.state.screenSharingUserList.length > 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].forbiddenSharing\n : \"\"}` }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: \"Whiteboard\" })] })))] })) }))), (this.state.showMore || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].popMoreArray }))] }))), ((_z = this.props.core._config.scenario) === null || _z === void 0 ? void 0 : _z.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n ((_0 = this.props.core._config.scenario.config) === null || _0 === void 0 ? void 0 : _0.role) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.LiveRole.Host && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"a\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLive} ${this.state.liveCountdown === 0\n ? _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].goLiveEnabled\n : \"\"}`, id: \"ZegoLiveButton\", onClick: () => {\n this.setLive();\n } }, { children: this.state.liveCountdown === 3 ||\n this.state.liveCountdown === -1\n ? \"Go Live\"\n : this.state.liveCountdown === 0\n ? \"Stop\"\n : \"Go Live\" })))] }))), this.getListScreen(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: this.getHiddenUser() }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notify, id: \"zego_left_notify_wrapper\" }, { children: this.state.notificationList.slice(startIndex).map((notify) => {\n if (notify.type === \"MSG\") {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h5\", { children: notify.userName }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: notify.content })] }), notify.content));\n }\n else {\n return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].notifyContent }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", { children: notify.content }) }), notify.content));\n }\n }) })), this.state.liveCountdown > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({ className: _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].countDown }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: this.state.liveCountdown }) }))), (this.state.connecting || false) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ZegoReconnect__WEBPACK_IMPORTED_MODULE_10__.ZegoReconnect, { content: this.state.firstLoading || false\n ? \"Joining Room\"\n : \"Trying to reconnect...\" })), ((_1 = this.props.core._config.scenario) === null || _1 === void 0 ? void 0 : _1.mode) ===\n _model__WEBPACK_IMPORTED_MODULE_2__.ScenarioModel.LiveStreaming &&\n (this.state.liveCountdown === 0 ||\n this.state.liveStatus === \"1\") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"button\", Object.assign({ className: `${_index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].LiveStateButton} ${this.state.showFooter\n ? \"\"\n : _index_module_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"].LiveStateButtonNoFooter}` }, { children: \"Live\" })))] })) })));\n }\n}\nZegoRoomMobile.contextType = _context_showManage__WEBPACK_IMPORTED_MODULE_16__[\"default\"];\n\n\n//# sourceURL=webpack://zegocloud_client_sdk_web/./src/sdk/view/pages/ZegoRoomMobile/index.tsx?");
|
|
2919
2919
|
|
|
2920
2920
|
/***/ }),
|
|
2921
2921
|
|