fcr-ui-scene 1.0.20 → 3.1.0-1

package/lib/modules/connection-gateway/components/phone/index.js

@@ -0,0 +1,181 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+require("core-js/modules/es.array.map.js");
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _button = require("agora-ui-foundation/lib/components/button");
+var _divider = _interopRequireDefault(require("agora-ui-foundation/lib/components/divider"));
+var _zonePhone = require("agora-ui-foundation/lib/components/zone-phone");
+var _calling = require("./components/calling");
+var _callinfo = _interopRequireDefault(require("./components/callinfo"));
+var _mobxReact = require("mobx-react");
+var _useing = require("./components/useing");
+var _remeber = require("./components/remeber");
+var _react = require("react");
+var _store = require("../../store");
+var _type = require("agora-edu-core/lib/room-control/room-connector-control/type");
+var _regex = require("../../../../utilities/regex");
+require("./index.css");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _jsxRuntime = require("react/jsx-runtime");
+var ConnectFromPhone = (0, _mobxReact.observer)(function () {
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    phoneCallState = _useContext.phoneCallState,
+    regionChangeHandler = _useContext.regionChangeHandler,
+    currentRegion = _useContext.currentRegion,
+    connectInfo = _useContext.connectInfo,
+    rememberedNumberList = _useContext.rememberedNumberList,
+    rememberMe = _useContext.rememberMe,
+    startCall = _useContext.startCall,
+    stopCall = _useContext.stopCall,
+    setCurrentCallInfo = _useContext.setCurrentCallInfo,
+    currentCallInfo = _useContext.currentCallInfo,
+    setRememberMe = _useContext.setRememberMe,
+    connectType = _useContext.connectType,
+    calling = _useContext.calling,
+    phoneCallReason = _useContext.phoneCallReason,
+    outgoingCall = _useContext.outgoingCall,
+    isHangup = _useContext.isHangup,
+    hasPstnStream = _useContext.hasPstnStream,
+    hasOwnPstnStream = _useContext.hasOwnPstnStream,
+    hasNeedMergedStream = _useContext.hasNeedMergedStream;
+  var transI18n = (0, _i18n.useI18n)();
+  var _useState = (0, _react.useState)(''),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    errorMessage = _useState2[0],
+    setErrorMessage = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    isRejectedState = _useState4[0],
+    setRejected = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    isStaticState = _useState6[0],
+    setStaticState = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+    isRingingState = _useState8[0],
+    setRingingState = _useState8[1];
+  var _useState9 = (0, _react.useState)(false),
+    _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
+    isAcceptingState = _useState10[0],
+    setAcceptingState = _useState10[1];
+  var validateNumberHandler = function validateNumberHandler(value) {
+    if (!value) {
+      setErrorMessage(transI18n('fmt_PSTN_tips_unempty'));
+      return false;
+    }
+    if (!(0, _regex.isPhoneNumber)(value)) {
+      setErrorMessage(transI18n('fmt_PSTN_tips_formaterror'));
+      return false;
+    }
+    setErrorMessage('');
+    return true;
+  };
+  var handleCallSelf = function handleCallSelf() {
+    var phone = currentCallInfo.phone;
+    if (!validateNumberHandler(phone)) return;
+    startCall();
+  };
+  var isPhoneAudioConnected = connectType === _store.ConnectType.PHONE;
+  (0, _react.useEffect)(function () {
+    setRejected(phoneCallState === _type.FcrRoomConnectorSessionState.END && phoneCallReason === _type.FcrRoomConnectorSessionReason.REJECT);
+    setStaticState(phoneCallReason === _type.FcrRoomConnectorSessionReason.NONE && phoneCallState === _type.FcrRoomConnectorSessionState.CALLING);
+    setRingingState(phoneCallState === _type.FcrRoomConnectorSessionState.RINGING && phoneCallReason === _type.FcrRoomConnectorSessionReason.NONE);
+    setAcceptingState(phoneCallReason === _type.FcrRoomConnectorSessionReason.ACCEPTED && phoneCallState === _type.FcrRoomConnectorSessionState.END);
+  }, [phoneCallState, phoneCallReason]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "connector-phone",
+    children: [(isStaticState && !isAcceptingState && !hasOwnPstnStream || hasPstnStream && !hasOwnPstnStream) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "connector-phone_inner",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "connector-phone_selector",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_zonePhone.FcrZonePhone, {
+          zoneDefault: currentCallInfo.zone || '+86',
+          phoneDefault: currentCallInfo.phone || '',
+          zoneOptions: [{
+            text: transI18n('fmt_PSTN_status_china'),
+            value: '+86'
+          }, {
+            text: transI18n('fmt_PSTN_status_usa'),
+            value: '+1'
+          }],
+          phoneOptions: (0, _toConsumableArray2["default"])(rememberedNumberList.map(function (_ref) {
+            var text = _ref.zone,
+              value = _ref.phone;
+            return {
+              text: text,
+              value: value
+            };
+          })),
+          onChange: function onChange(zone, phone) {
+            setCurrentCallInfo({
+              zone: zone,
+              phone: phone
+            });
+          },
+          onInputBlur: function onInputBlur(e) {
+            return validateNumberHandler(currentCallInfo.phone);
+          }
+        }), errorMessage && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "connector-phone_selector_errmsg",
+          children: errorMessage
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_remeber.ConnectionRemember, {
+        checked: rememberMe,
+        onChange: setRememberMe
+      })]
+    }), (isPhoneAudioConnected || isAcceptingState) && hasOwnPstnStream && /*#__PURE__*/(0, _jsxRuntime.jsx)(_useing.ConnectionUsing, {}), isStaticState && !hasOwnPstnStream && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "connector-phone_inner",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        size: "XS",
+        block: true,
+        styleType: "success",
+        className: "connector-phone_callme-button",
+        onClick: handleCallSelf,
+        loading: calling,
+        children: transI18n('fmt_pstn_button_callme')
+      })
+    }), (isRingingState || !isStaticState) && !isAcceptingState && /*#__PURE__*/(0, _jsxRuntime.jsx)(_calling.CallingPhone, {
+      failure: !isRingingState,
+      number: outgoingCall ? currentCallInfo.phone : '',
+      region: outgoingCall ? currentCallInfo.zone : '',
+      reason: isRingingState ? transI18n('fmt_pstn_status_calling') : isRejectedState ? transI18n('fmt_pstn_status_hungup') : isHangup ? transI18n('fmt_PSTN_status_hangup') : transI18n('fmt_pstn_status_failed')
+    }), (isRingingState || isAcceptingState || !isStaticState) && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "connector-phone_inner",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        size: "XS",
+        block: true,
+        styleType: "danger",
+        className: "connector-phone_hangup-button",
+        disabled: !isAcceptingState && !isRingingState,
+        onClick: stopCall,
+        children: transI18n('fmt_pstn_button_hangupphone')
+      })
+    }), (outgoingCall || isStaticState) && (!hasOwnPstnStream || isAcceptingState) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
+      style: {
+        margin: '10px 0 12px'
+      },
+      type: "horizontal",
+      size: "0.4px",
+      children: transI18n('fmt_pstn_label_dialinphone')
+    }), hasPstnStream && !outgoingCall && !hasOwnPstnStream && hasNeedMergedStream && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "connector-phone-alert",
+      children: transI18n('fmt_pstn_label_alreadyin', {
+        reason1: connectInfo === null || connectInfo === void 0 ? void 0 : connectInfo.phoneUserId
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_callinfo["default"], {
+      disabled: phoneCallState === _type.FcrRoomConnectorSessionState.END,
+      onChange: regionChangeHandler,
+      value: currentRegion,
+      info: connectInfo
+    })]
+  });
+});
+var _default = exports["default"] = ConnectFromPhone;

package/lib/modules/connection-gateway/components/tabs/index.css

@@ -0,0 +1,31 @@
+.connector-tabs {
+  padding: 9px 0;
+  display: flex;
+  justify-content: center;
+  -webkit-app-region: drag;
+  cursor: move;
+  position: sticky;
+  top: 0;
+  background: var(--fcr_mobile_ui_scene_color_popup_fill2);
+  z-index: 100;
+  width: 100%;
+}
+.connector-tabs .fcr-tabs {
+  width: 306px;
+  border-radius: var(--fcr_cornerradius_s);
+  -webkit-app-region: no-drag;
+}
+.connector-tabs .fcr-tabs__nav-item {
+  flex: 1;
+  border-radius: var(--fcr_cornerradius_xs);
+  font-size: 12px;
+}
+.connector-tabs-content {
+  --top: 48px;
+  position: absolute;
+  top: var(--top);
+  height: calc(100% - var(--top));
+  width: 100%;
+  align-items: center;
+  display: flex;
+}

package/lib/modules/connection-gateway/components/tabs/index.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import './index.css';
+declare const ConnectorTabs: FC;
+export default ConnectorTabs;

package/lib/modules/connection-gateway/components/tabs/index.js

@@ -0,0 +1,43 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+require("core-js/modules/es.array.concat.js");
+var _tabs = require("agora-ui-foundation/lib/components/tabs");
+var _react = require("react");
+var _mobxReact = require("mobx-react");
+var _store = require("../../store");
+require("./index.css");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _jsxRuntime = require("react/jsx-runtime");
+var ConnectorTabs = (0, _mobxReact.observer)(function (props) {
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    activeTabKey = _useContext.activeTabKey,
+    onTabChange = _useContext.onTabChange,
+    hasOwnPstnStream = _useContext.hasOwnPstnStream,
+    connectType = _useContext.connectType;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "connector-frame",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "connector-tabs",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tabs.FcrTabs, {
+        activeKey: activeTabKey,
+        items: [{
+          label: "Computer Audio".concat(connectType === _store.ConnectType.COMPUTER ? "-".concat((0, _i18n.transI18n)('fmt_PSTN_status_connected')) : ''),
+          key: 'computer'
+        }, {
+          label: "".concat((0, _i18n.transI18n)('fmt_pstn_options_phoneaudio')).concat(hasOwnPstnStream ? "-".concat((0, _i18n.transI18n)('fmt_PSTN_status_connected')) : ''),
+          key: 'phone'
+        }],
+        onChange: onTabChange
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "connector-tabs-content",
+      children: props.children
+    })]
+  });
+});
+var _default = exports["default"] = ConnectorTabs;

package/lib/modules/connection-gateway/index.css

@@ -0,0 +1,6 @@
+.connector-frame {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+}

package/lib/modules/connection-gateway/index.d.ts

@@ -0,0 +1,16 @@
+import { FcrMainRoomControl } from 'agora-edu-core';
+import { UIModule } from '../../base';
+import { FcrUIEventStore } from '../../common/event-store';
+import './index.css';
+import { FcrDeviceStore } from '../../common/device-store';
+export declare class ConnectionGatewayUIModule extends UIModule {
+    private _store;
+    constructor(args: {
+        roomControl: FcrMainRoomControl;
+        uiEventStore: FcrUIEventStore;
+        deviceStore: FcrDeviceStore;
+    });
+    getComponent(): import("react/jsx-runtime").JSX.Element;
+    protected onUnload(): void;
+    private _handleUIEvent;
+}

package/lib/modules/connection-gateway/index.js

@@ -0,0 +1,67 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.reflect.construct.js");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ConnectionGatewayUIModule = void 0;
+require("core-js/modules/es.function.bind.js");
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _base = require("../../base");
+var _constant = require("../../utilities/constant");
+var _store = _interopRequireWildcard(require("./store"));
+var _view = require("./view");
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var ConnectionGatewayUIModule = exports.ConnectionGatewayUIModule = /*#__PURE__*/function (_UIModule) {
+  function ConnectionGatewayUIModule(args) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, ConnectionGatewayUIModule);
+    _this = _callSuper(this, ConnectionGatewayUIModule);
+    _this._store = new _store["default"](args);
+    args.uiEventStore.addObserver({
+      onEvent: _this._handleUIEvent.bind(_this)
+    });
+    return _this;
+  }
+  (0, _inherits2["default"])(ConnectionGatewayUIModule, _UIModule);
+  return (0, _createClass2["default"])(ConnectionGatewayUIModule, [{
+    key: "getComponent",
+    value: function getComponent() {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_store.StoreContext.Provider, {
+        value: this._store,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.View, {})
+      });
+    }
+  }, {
+    key: "onUnload",
+    value: function onUnload() {
+      this._store.release();
+    }
+  }, {
+    key: "_handleUIEvent",
+    value: function _handleUIEvent(action, payload) {
+      if (action === _constant.UIAction.OPEN_DIALOG && payload) {
+        var _payload$params;
+        this._store.onTabChange(((_payload$params = payload.params) === null || _payload$params === void 0 ? void 0 : _payload$params.type) || 'computer');
+      }
+    }
+  }]);
+}(_base.UIModule);

package/lib/modules/connection-gateway/store.d.ts

@@ -0,0 +1,80 @@
+/// <reference types="react" />
+import { FcrMainRoomControl } from 'agora-edu-core';
+import { FcrUIEventStore } from '../../common/event-store';
+import { FcrPhoneConnectorSession, FcrRoomConnectorPhoneInfo, FcrRoomConnectorSessionReason, FcrRoomConnectorSessionState } from 'agora-edu-core/lib/room-control/room-connector-control/type';
+import { FcrDeviceStore } from '../../common/device-store';
+export declare enum ConnectorRegion {
+    CHINA = 1,
+    AMERICA = 2
+}
+export declare enum ConnectType {
+    NONE = 0,
+    COMPUTER = 1,
+    PHONE = 2
+}
+type ConnectListType = {
+    phone: string;
+    zone: string;
+};
+export default class ConnectionGatewayStore {
+    private _roomControl;
+    private _userControl;
+    private _disposers;
+    private _uiEventStore;
+    private _deviceStore;
+    private _streamControl;
+    private _roomOberver;
+    private _streamObserver;
+    private _failureTimer;
+    private _accepted;
+    private _sessionId;
+    accessor connectType: ConnectType;
+    accessor activeTabKey: string;
+    accessor rememberMe: boolean;
+    accessor rememberedNumberList: ConnectListType[];
+    accessor connectionPhoneInfo: FcrRoomConnectorPhoneInfo[];
+    accessor currentRegion: ConnectorRegion;
+    accessor currentCallInfo: ConnectListType;
+    accessor connectInfo: FcrRoomConnectorPhoneInfo;
+    accessor phoneCallState: FcrRoomConnectorSessionState;
+    accessor phoneCallReason: FcrRoomConnectorSessionReason;
+    accessor connectSession: FcrPhoneConnectorSession | null;
+    accessor calling: boolean;
+    accessor outgoingCall: boolean;
+    accessor isHangup: boolean;
+    accessor hasPstnStream: boolean;
+    accessor hasOwnPstnStream: boolean;
+    accessor hasNeedMergedStream: boolean;
+    constructor({ roomControl, uiEventStore, deviceStore, }: {
+        roomControl: FcrMainRoomControl;
+        uiEventStore: FcrUIEventStore;
+        deviceStore: FcrDeviceStore;
+    });
+    joinAudioByComputer(): void;
+    stopAudioByComputer(): void;
+    openAudioSettings(): void;
+    closeConnectionDialog(): void;
+    onTabChange(key: string): void;
+    onGetConnectInfo(): Promise<void>;
+    regionChangeHandler(region: ConnectorRegion | string): void;
+    setConnectionInfo(region?: ConnectorRegion): void;
+    setCurrentCallInfo(data: {
+        zone: string;
+        phone: string;
+    }): void;
+    startCall(): Promise<void>;
+    stopCall(): Promise<void>;
+    setRememberMe(value: boolean): void;
+    initRememberedData(): void;
+    release(): void;
+    private _setResetTimer;
+    private _rememberNumber;
+    private _setWindowHeight;
+    private _phoneCallUpdated;
+    private _phoneCallReason;
+    private _setStreamState;
+    private _handleStreamsAddedOrUpdated;
+    private _handleStreamsRemoved;
+}
+export declare const StoreContext: import("react").Context<ConnectionGatewayStore>;
+export {};