"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Vue = require("vue");
const pinia = require("pinia");
const IconButton = require("../common/base/IconButton.vue.js");
const SvgIcon = require("../common/base/SvgIcon.vue.js");
const BasicBeautyIcon = require("../common/icons/BasicBeautyIcon.vue.js");
const index = require("../../locales/index.js");
require("../../services/main.js");
const roomService = require("../../services/roomService.js");
const TUIRoomEngine = require("@tencentcloud/tuiroom-engine-js");
require("mitt");
require("../../services/manager/roomActionManager.js");
require("@tencentcloud/tui-core");
const index$1 = require("../common/base/Dialog/index.js");
const Button = require("../common/base/Button.vue.js");
const Slider = require("../common/base/Slider.vue.js");
const CloseBeautyIcon = require("../common/icons/CloseBeautyIcon.vue.js");
const SmootherBeautyIcon = require("../common/icons/SmootherBeautyIcon.vue.js");
const WhiteningBeautyIcon = require("../common/icons/WhiteningBeautyIcon.vue.js");
const RuddyBeautyIcon = require("../common/icons/RuddyBeautyIcon.vue.js");
const ResetIcon = require("../common/icons/ResetIcon.vue.js");
const CompareIcon = require("../common/icons/CompareIcon.vue.js");
const useRoomEngine = require("../../hooks/useRoomEngine.js");
const basic = require("../../stores/basic.js");
const environment = require("../../utils/environment.js");
const room = require("../../constants/room.js");
const _hoisted_1 = {
  key: 0,
  class: "basicBeauty-control-container"
};
const _hoisted_2 = {
  id: "test-preview",
  class: "test-preview"
};
const _hoisted_3 = { class: "text" };
const _hoisted_4 = {
  key: 0,
  class: "degree"
};
const _hoisted_5 = { class: "text" };
const _hoisted_6 = { class: "text-value" };
const _hoisted_7 = { class: "text" };
const _hoisted_8 = {
  key: 1,
  class: "mask"
};
const _hoisted_9 = {
  key: 2,
  class: "spinner"
};
const _hoisted_10 = { class: "setting" };
const _hoisted_11 = { class: "setting-header" };
const _hoisted_12 = { class: "setting-container" };
const _hoisted_13 = ["onClick"];
const _hoisted_14 = { class: "setting-item-icon" };
const _hoisted_15 = { class: "footer" };
const _hoisted_16 = { class: "mirror-container" };
const _hoisted_17 = { class: "mirror-text" };
const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
  __name: "BasicBeauty",
  setup(__props) {
    const roomEngine = useRoomEngine.default();
    const basicStore = basic.useBasicStore();
    const { isLocalStreamMirror } = pinia.storeToRefs(basicStore);
    const { t } = index.useI18n();
    const isShowDegree = Vue.ref(false);
    const componentConfig = roomService.roomService.componentManager.getComponentConfig("BasicBeauty");
    const isAllowed = Vue.computed(
      () => roomService.roomService.roomStore.localStream.hasVideoStream
    );
    Vue.watch(isLocalStreamMirror, async (val) => {
      var _a;
      const trtcCloud = (_a = roomEngine.instance) == null ? void 0 : _a.getTRTCCloud();
      if (!environment.isMobile) {
        await (trtcCloud == null ? void 0 : trtcCloud.setLocalRenderParams({
          mirrorType: val ? TUIRoomEngine.TRTCVideoMirrorType.TRTCVideoMirrorType_Enable : TUIRoomEngine.TRTCVideoMirrorType.TRTCVideoMirrorType_Disable,
          rotation: TUIRoomEngine.TRTCVideoRotation.TRTCVideoRotation0,
          fillMode: TUIRoomEngine.TRTCVideoFillMode.TRTCVideoFillMode_Fill
        }));
      }
    });
    const appliedBasicBeautyItem = Vue.ref("close");
    const selectBasicBeautyItem = Vue.ref(
      "close"
    );
    const isDialogVisible = Vue.ref(false);
    const isShowResetDialog = Vue.ref(false);
    const isLoading = Vue.ref(false);
    const sliderValue = Vue.ref(0);
    const beautyLevels = Vue.reactive({
      close: 0,
      smoother: 0,
      whitening: 0,
      ruddy: 0
    });
    const beautyOptionList = [
      { value: "close", text: "Close", icon: CloseBeautyIcon.default },
      { value: "smoother", text: "Smoother", icon: SmootherBeautyIcon.default },
      { value: "whitening", text: "Whitening", icon: WhiteningBeautyIcon.default },
      { value: "ruddy", text: "Ruddy", icon: RuddyBeautyIcon.default }
    ];
    const openSettingPanel = async () => {
      var _a;
      roomService.roomService.basicBeauty.initBasicBeauty();
      isDialogVisible.value = true;
      isLoading.value = true;
      await Vue.nextTick();
      await ((_a = roomService.roomService.roomEngine.instance) == null ? void 0 : _a.startCameraDeviceTest({
        view: "test-preview"
      }));
      await applyBasicBeautyItem(appliedBasicBeautyItem.value);
      isLoading.value = false;
    };
    const closeSettingPanel = async () => {
      var _a;
      isDialogVisible.value = false;
      (_a = roomService.roomService.roomEngine.instance) == null ? void 0 : _a.stopCameraDeviceTest();
      selectBasicBeautyItem.value = appliedBasicBeautyItem.value;
    };
    const saveBasicBeautySetting = async () => {
      if (!isAllowed.value) return;
      appliedBasicBeautyItem.value = selectBasicBeautyItem.value;
      if (selectBasicBeautyItem.value === "close") {
        await roomService.roomService.basicBeauty.setBasicBeauty(
          room.TRTCBeautyStyle.TRTCBeautyStyleNature,
          0,
          0,
          0
        );
      } else {
        await roomService.roomService.basicBeauty.setBasicBeauty(
          room.TRTCBeautyStyle.TRTCBeautyStyleNature,
          Math.floor(beautyLevels.smoother / 100 * 9),
          Math.floor(beautyLevels.whitening / 100 * 9),
          Math.floor(beautyLevels.ruddy / 100 * 9)
        );
      }
      closeSettingPanel();
    };
    const setBasicBeauty = async () => {
      await roomService.roomService.basicBeauty.setTestBasicBeauty(
        room.TRTCBeautyStyle.TRTCBeautyStyleNature,
        Math.floor(beautyLevels.smoother / 100 * 9),
        Math.floor(beautyLevels.whitening / 100 * 9),
        Math.floor(beautyLevels.ruddy / 100 * 9)
      );
    };
    const resetBasicBeauty = async () => {
      await roomService.roomService.basicBeauty.setTestBasicBeauty(
        room.TRTCBeautyStyle.TRTCBeautyStyleNature,
        0,
        0,
        0
      );
    };
    Vue.watch(sliderValue, async (newValue) => {
      if (selectBasicBeautyItem.value === "smoother") {
        beautyLevels.smoother = newValue;
      }
      if (selectBasicBeautyItem.value === "whitening") {
        beautyLevels.whitening = newValue;
      }
      if (selectBasicBeautyItem.value === "ruddy") {
        beautyLevels.ruddy = newValue;
      }
      await setBasicBeauty();
    });
    const applyBasicBeautyItem = async (type) => {
      if (type === "close") {
        await resetBasicBeauty();
        beautyLevels.smoother = 0;
        beautyLevels.whitening = 0;
        beautyLevels.ruddy = 0;
        sliderValue.value = 0;
      } else {
        sliderValue.value = beautyLevels[type];
      }
      isShowDegree.value = type !== "close";
      selectBasicBeautyItem.value = type;
      isLoading.value = false;
    };
    const handleShowResetDialog = () => {
      isShowResetDialog.value = true;
    };
    const handleResetBeauty = async () => {
      await resetBasicBeauty();
      beautyLevels.smoother = 0;
      beautyLevels.whitening = 0;
      beautyLevels.ruddy = 0;
      sliderValue.value = 0;
      isShowResetDialog.value = false;
    };
    const handleMouseDown = async () => {
      await resetBasicBeauty();
    };
    const handleMouseUp = async () => {
      await setBasicBeauty();
    };
    return (_ctx, _cache) => {
      return Vue.unref(componentConfig).visible ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
        Vue.createVNode(IconButton.default, {
          title: Vue.unref(t)("Beauty"),
          onClickIcon: openSettingPanel
        }, {
          default: Vue.withCtx(() => [
            Vue.createVNode(BasicBeautyIcon.default)
          ]),
          _: 1
        }, 8, ["title"]),
        Vue.createVNode(Vue.unref(index$1.default), {
          modelValue: isDialogVisible.value,
          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isDialogVisible.value = $event),
          title: Vue.unref(t)("Beauty"),
          width: "600px",
          modal: true,
          "append-to-room-container": true,
          "close-on-click-modal": false,
          onClose: closeSettingPanel
        }, {
          default: Vue.withCtx(() => [
            Vue.createElementVNode("div", _hoisted_2, [
              Vue.createElementVNode("div", {
                class: "reset",
                onClick: handleShowResetDialog
              }, [
                Vue.createVNode(SvgIcon.default, { icon: ResetIcon.default }),
                Vue.createElementVNode("span", _hoisted_3, Vue.toDisplayString(Vue.unref(t)("Reset")), 1)
              ]),
              isShowDegree.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_4, [
                Vue.createElementVNode("span", _hoisted_5, Vue.toDisplayString(Vue.unref(t)("Degree")), 1),
                Vue.createVNode(Slider.default, {
                  modelValue: sliderValue.value,
                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => sliderValue.value = $event),
                  class: "slider"
                }, null, 8, ["modelValue"]),
                Vue.createElementVNode("span", _hoisted_6, Vue.toDisplayString(sliderValue.value), 1)
              ])) : Vue.createCommentVNode("", true),
              Vue.createElementVNode("div", {
                class: "compare",
                onMousedown: handleMouseDown,
                onMouseup: handleMouseUp
              }, [
                Vue.createVNode(SvgIcon.default, { icon: CompareIcon.default }),
                Vue.createElementVNode("span", _hoisted_7, Vue.toDisplayString(Vue.unref(t)("Compare")), 1)
              ], 32),
              isLoading.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_8)) : Vue.createCommentVNode("", true),
              isLoading.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_9)) : Vue.createCommentVNode("", true)
            ]),
            Vue.createElementVNode("div", _hoisted_10, [
              Vue.createElementVNode("div", _hoisted_11, Vue.toDisplayString(Vue.unref(t)("Beauty Effects")), 1),
              Vue.createElementVNode("div", _hoisted_12, [
                (Vue.openBlock(), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(beautyOptionList, (item) => {
                  return Vue.createElementVNode("div", {
                    key: item.value,
                    class: Vue.normalizeClass([
                      "setting-item",
                      selectBasicBeautyItem.value === item.value ? "active" : ""
                    ]),
                    onClick: ($event) => applyBasicBeautyItem(item.value)
                  }, [
                    Vue.createElementVNode("i", _hoisted_14, [
                      Vue.createVNode(SvgIcon.default, {
                        icon: item.icon
                      }, null, 8, ["icon"])
                    ]),
                    Vue.createElementVNode("span", null, Vue.toDisplayString(Vue.unref(t)(item.text)), 1)
                  ], 10, _hoisted_13);
                }), 64))
              ])
            ]),
            Vue.createElementVNode("div", _hoisted_15, [
              Vue.createElementVNode("div", _hoisted_16, [
                Vue.withDirectives(Vue.createElementVNode("input", {
                  type: "checkbox",
                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => Vue.isRef(isLocalStreamMirror) ? isLocalStreamMirror.value = $event : null)
                }, null, 512), [
                  [Vue.vModelCheckbox, Vue.unref(isLocalStreamMirror)]
                ]),
                Vue.createElementVNode("span", _hoisted_17, Vue.toDisplayString(Vue.unref(t)("Mirror")), 1)
              ]),
              Vue.createVNode(Button.default, {
                class: "button",
                disabled: !isAllowed.value,
                onClick: saveBasicBeautySetting
              }, {
                default: Vue.withCtx(() => [
                  Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Save")), 1)
                ]),
                _: 1
              }, 8, ["disabled"]),
              Vue.createVNode(Button.default, {
                class: "button",
                type: "primary",
                onClick: closeSettingPanel
              }, {
                default: Vue.withCtx(() => [
                  Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Cancel")), 1)
                ]),
                _: 1
              })
            ])
          ]),
          _: 1
        }, 8, ["modelValue", "title"]),
        Vue.createVNode(Vue.unref(index$1.default), {
          modelValue: isShowResetDialog.value,
          "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => isShowResetDialog.value = $event),
          title: Vue.unref(t)("Sure you want to reset the beauty effect?"),
          width: "480px",
          modal: true,
          "append-to-room-container": true,
          "close-on-click-modal": true
        }, {
          footer: Vue.withCtx(() => [
            Vue.createVNode(Button.default, {
              size: "default",
              onClick: handleResetBeauty
            }, {
              default: Vue.withCtx(() => [
                Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Reset")), 1)
              ]),
              _: 1
            }),
            Vue.createVNode(Button.default, {
              class: "cancel",
              size: "default",
              type: "primary",
              onClick: _cache[3] || (_cache[3] = ($event) => isShowResetDialog.value = false)
            }, {
              default: Vue.withCtx(() => [
                Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Cancel")), 1)
              ]),
              _: 1
            })
          ]),
          default: Vue.withCtx(() => [
            Vue.createElementVNode("span", null, Vue.toDisplayString(Vue.unref(t)("All beauty parameters will revert to default after reset")), 1)
          ]),
          _: 1
        }, 8, ["modelValue", "title"])
      ])) : Vue.createCommentVNode("", true);
    };
  }
});
exports.default = _sfc_main;
