import { defineComponent, computed, ref, onMounted, onBeforeUnmount, openBlock, createElementBlock, withDirectives, normalizeStyle, createBlock, Fragment, createVNode, unref } from "vue";
import { TUIVideoStreamType } from "@tencentcloud/tuiroom-engine-js";
import StreamPlay from "./StreamPlay/index.vue.mjs";
import StreamCover from "./StreamCover/index.vue.mjs";
import LocalScreenView from "./LocalScreenView/index.vue.mjs";
import { useBasicStore } from "../../../stores/basic.mjs";
import vDblTouch from "../../../directives/vDblTouch.mjs";
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "StreamRegionPC",
  props: {
    streamInfo: {},
    isEnlarge: { type: Boolean, default: false },
    aspectRatio: {},
    isNeedPlayStream: { type: Boolean, default: true },
    observerViewInVisible: { type: Boolean }
  },
  emits: ["room-dblclick"],
  setup(__props) {
    const props = __props;
    const basicStore = useBasicStore();
    const isLocalScreen = computed(
      () => props.streamInfo && props.streamInfo.userId === basicStore.userId && props.streamInfo.streamType === TUIVideoStreamType.kScreenStream
    );
    const streamRegionContainerRef = ref();
    const streamStyle = ref({ width: "", height: "" });
    const widthRatio = computed(() => {
      if (!props.aspectRatio || props.aspectRatio.indexOf(":") < 0) {
        return 0;
      }
      return Number(props.aspectRatio.split(":")[0]);
    });
    const heightRatio = computed(() => {
      if (!props.aspectRatio || props.aspectRatio.indexOf(":") < 0) {
        return 0;
      }
      return Number(props.aspectRatio.split(":")[1]);
    });
    function handleStreamRegionSize() {
      if (!streamRegionContainerRef.value) {
        return;
      }
      const containerWidth = streamRegionContainerRef.value.offsetWidth;
      const containerHeight = streamRegionContainerRef.value.offsetHeight;
      let width = containerWidth;
      let height = containerHeight;
      if (widthRatio.value && heightRatio.value) {
        const scaleWidth = containerWidth / widthRatio.value;
        const scaleHeight = containerHeight / heightRatio.value;
        if (scaleWidth > scaleHeight) {
          width = containerHeight / heightRatio.value * widthRatio.value;
          height = containerHeight;
        }
        if (scaleWidth <= scaleHeight) {
          width = containerWidth;
          height = containerWidth / widthRatio.value * heightRatio.value;
        }
      }
      streamStyle.value.width = `${width}px`;
      streamStyle.value.height = `${height}px`;
    }
    const ro = new ResizeObserver(() => {
      handleStreamRegionSize();
    });
    onMounted(() => {
      ro.observe(streamRegionContainerRef.value);
    });
    onBeforeUnmount(() => {
      ro.unobserve(streamRegionContainerRef.value);
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: "stream-region-container",
        ref_key: "streamRegionContainerRef",
        ref: streamRegionContainerRef
      }, [
        withDirectives((openBlock(), createElementBlock("div", {
          class: "stream-region",
          onDblclick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("room-dblclick")),
          style: normalizeStyle(streamStyle.value)
        }, [
          isLocalScreen.value ? (openBlock(), createBlock(LocalScreenView, {
            key: 0,
            streamInfo: _ctx.streamInfo,
            isMiniRegion: !_ctx.isEnlarge
          }, null, 8, ["streamInfo", "isMiniRegion"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
            createVNode(StreamPlay, {
              streamInfo: _ctx.streamInfo,
              isEnlarge: _ctx.isEnlarge,
              isNeedPlayStream: _ctx.isNeedPlayStream,
              observerViewInVisible: _ctx.observerViewInVisible
            }, null, 8, ["streamInfo", "isEnlarge", "isNeedPlayStream", "observerViewInVisible"]),
            createVNode(StreamCover, { streamInfo: _ctx.streamInfo }, null, 8, ["streamInfo"])
          ], 64))
        ], 36)), [
          [
            unref(vDblTouch),
            () => {
              _ctx.$emit("room-dblclick");
            }
          ]
        ])
      ], 512);
    };
  }
});
export {
  _sfc_main as default
};
