"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.MicrophoneDevice = exports.CameraDevice = void 0;
var _i18n = require("../../../i18n");
var _divider = _interopRequireDefault(require("../../divider"));
var _icon = require("../../icon");
var _type = require("../../icon/type");
var _radio = require("../../radio");
var _tooltipsButton = require("../../tooltips-button");
var _microphoneState = require("../microphone-state");
require("./index.css");
var _iconPhoneCall = require("../../icon-phone-call");
var _jsxRuntime = require("react/jsx-runtime");
var CameraDevice = exports.CameraDevice = function CameraDevice(props) {
  var t = (0, _i18n.useI18n)();
  var _props$onCameraDevice = props.onCameraDevicePopoverVisibleChange,
    onCameraDevicePopoverVisibleChange = _props$onCameraDevice === void 0 ? function () {} : _props$onCameraDevice,
    popoverContent = props.popoverContent,
    isMuted = props.isMuted;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: "share-action-nav__button fcr-divider-vertical share-action-nav__not-draggable",
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltipsButton.FrcTooltipButton, {
      tooltip: {
        icon: {
          type: isMuted ? _type.FcrIconType.FCR_CAMERAOFF : _type.FcrIconType.FCR_CAMERA,
          colors: {
            iconPrimary: isMuted ? 'var(--fcr_ui_scene_ramp_red6)' : 'var(--fcr_web_ui_scene_mainicon1)',
            iconSecondary: 'var(--fcr_ui_scene_ramp_red6)'
          },
          size: 32
        },
        content: t('fmt_toolbar_label_camera')
      },
      withPopover: true,
      onTooltipButtonClick: props.onTooltipButtonClick,
      popover: {
        content: popoverContent ? popoverContent : /*#__PURE__*/(0, _jsxRuntime.jsx)(VideoDeviceListPopoverContent, {}),
        onVisibleChange: onCameraDevicePopoverVisibleChange
      }
    })
  });
};
var ConnectType = /*#__PURE__*/function (ConnectType) {
  ConnectType[ConnectType["NONE"] = 0] = "NONE";
  ConnectType[ConnectType["COMPUTER"] = 1] = "COMPUTER";
  ConnectType[ConnectType["PHONE"] = 2] = "PHONE";
  return ConnectType;
}(ConnectType || {});
var MicrophoneDevice = exports.MicrophoneDevice = function MicrophoneDevice(props) {
  var t = (0, _i18n.useI18n)();
  var _props$isMuted = props.isMuted,
    isMuted = _props$isMuted === void 0 ? true : _props$isMuted,
    _props$voicePercent = props.voicePercent,
    voicePercent = _props$voicePercent === void 0 ? 0 : _props$voicePercent,
    _props$connectType = props.connectType,
    connectType = _props$connectType === void 0 ? ConnectType.NONE : _props$connectType;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: "share-action-nav__button share-action-nav__not-draggable",
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltipsButton.FrcTooltipButton, {
      tooltip: {
        content: t('fmt_setting_label_Mic')
      },
      onTooltipButtonClick: props.onTooltipButtonClick,
      withPopover: true,
      popover: {
        content: props.popoverContent ? props.popoverContent : /*#__PURE__*/(0, _jsxRuntime.jsx)(AudioDeviceListPopoverContent, {}),
        onVisibleChange: props.onMicrophoneDevicePopoverVisibleChange
      },
      children: connectType === ConnectType.COMPUTER ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_microphoneState.MicrophoneState, {
        isMicrophoneMuted: isMuted,
        voicePercent: voicePercent,
        size: 32
      }) : connectType === ConnectType.NONE ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
        type: _type.FcrIconType.FCR_WEB_CONNECTSOUND,
        size: 32,
        colors: {
          iconPrimary: "var(--fcr_web_ui_scene_mainicon1)",
          iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
        }
      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconPhoneCall.FcrIconPhoneCall, {
        isMuted: isMuted
      })
    })
  });
};
var VideoDeviceListPopoverContent = function VideoDeviceListPopoverContent() {
  var t = (0, _i18n.useI18n)();
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: "share-action-nav__popover-inner-content share-action-nav__not-draggable",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "share-action-nav__media-list-group",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "share-action-nav__media-title",
        children: t('fmt_toolbar_label_camera')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadioGroup, {
        options: [{
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_toolbar_label_camera'), "1"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent',
          checked: true
        }, {
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_toolbar_label_camera'), "2"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent'
        }],
        onChange: function onChange(value) {
          console.log(value);
        }
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
      type: "horizontal",
      style: {
        margin: '8px 0'
      }
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "share-action-nav__media-list-group",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "share-action-nav__media-title",
        children: t('fmt_setting_label_Mic')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadioGroup, {
        options: [{
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_setting_label_Mic'), "1"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent',
          checked: true
        }, {
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_setting_label_Mic'), "2"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent'
        }],
        onChange: function onChange(value) {
          console.log(value);
        }
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
      type: "horizontal",
      style: {
        margin: '8px 0'
      }
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: "share-action-nav__media-list-group",
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
        className: "fcr-flex fcr-items-center share-action-nav__popover-option-media-setting share-action-nav__popover-option",
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
          type: _type.FcrIconType.FCR_SETTING,
          size: 24,
          colors: {
            iconPrimary: 'var(--fcr_ui_scene_icontext5)'
          }
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
          children: t('fmt_setting_option_Video')
        })]
      })
    })]
  });
};
var AudioDeviceListPopoverContent = function AudioDeviceListPopoverContent() {
  var t = (0, _i18n.useI18n)();
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: "share-action-nav__popover-inner-content share-action-nav__not-draggable",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "share-action-nav__media-list-group",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "share-action-nav__media-title",
        children: t('fmt_setting_label_Speaker')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadioGroup, {
        options: [{
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_setting_label_Speaker'), "1"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent',
          checked: true
        }, {
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_setting_label_Speaker'), "1"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent'
        }],
        onChange: function onChange(value) {
          console.log(value);
        }
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
      type: "horizontal",
      style: {
        margin: '8px 0'
      }
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "share-action-nav__media-list-group",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "share-action-nav__media-title",
        children: t('fmt_setting_label_Mic')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadioGroup, {
        options: [{
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_setting_label_Mic'), "1"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent',
          checked: true
        }, {
          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
            className: "color-dark-gray-icontext1",
            children: [t('fmt_setting_label_Mic'), "2"]
          }),
          iconColor: 'var(--fcr_ui_scene_ramp_brand6)',
          styleType: 'transparent'
        }],
        onChange: function onChange(value) {
          console.log(value);
        }
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
      type: "horizontal",
      style: {
        margin: '8px 0'
      }
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: "share-action-nav__media-list-group ",
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
        className: "fcr-flex fcr-items-center share-action-nav__popover-option-media-setting share-action-nav__popover-option",
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
          type: _type.FcrIconType.FCR_SETTING,
          size: 24,
          colors: {
            iconPrimary: 'var(--fcr_ui_scene_icontext5)'
          }
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
          className: "share-action-nav__device-setting",
          children: t('fmt_setting_label_setting')
        })]
      })
    })]
  });
};