import '../../../composables/index.mjs';
import usePosition from '../../../composables/private/use-position.mjs';
import { VcBtn, VcTooltip } from '../../ui/index.mjs';
import { $ } from '../../../utils/private/vm.mjs';
import { defineComponent, getCurrentInstance, ref, reactive, computed, onUnmounted, h, createCommentVNode } from 'vue';
import _Viewer from '../../viewer/index.mjs';
import { hSlot } from '../../../utils/private/render.mjs';
import { commonEmits } from '../../../utils/emits.mjs';
import { makeColor } from '../../../utils/cesium-helpers.mjs';
import useCommon from '../../../composables/use-common/index.mjs';
import { useLocale } from '../../../composables/use-locale/index.mjs';

const overviewProps = {
  position: {
    type: String,
    default: "bottom-right",
    validator: (v) => ["top-right", "top-left", "bottom-right", "bottom-left"].includes(v)
  },
  offset: {
    type: Array,
    validator: (v) => v.length === 2
  },
  width: {
    type: String,
    default: "150px"
  },
  height: {
    type: String,
    default: "150px"
  },
  border: {
    type: String,
    default: "solid 4px rgb(255, 255, 255)"
  },
  borderRadius: {
    type: String
  },
  toggleOpts: {
    type: Object
  },
  viewerOpts: {
    type: Object
  },
  centerRectColor: {
    type: [Object, Array, String],
    default: "#ff000080"
  },
  widthFactor: {
    type: Number,
    default: 2
  },
  heightFactor: {
    type: Number,
    default: 2
  },
  modelValue: {
    type: Boolean,
    default: true
  }
};
var OverviewMap = defineComponent({
  name: "VcOverviewMap",
  props: overviewProps,
  emits: {
    ...commonEmits,
    "update:modelValue": (value) => true
  },
  setup(props, ctx) {
    const instance = getCurrentInstance();
    instance.cesiumClass = "VcOverviewMap";
    instance.cesiumEvents = [];
    const commonState = useCommon(props, ctx, instance);
    if (commonState === void 0) {
      return;
    }
    const { t } = useLocale();
    const { $services } = commonState;
    const rootRef = ref(null);
    const toggleBtnRef = ref(null);
    const rootStyle = reactive({});
    const tooltipRef = ref(null);
    const viewerRef = ref(null);
    const positionState = usePosition(props, $services);
    const showing = ref(props.modelValue);
    let unwatchFns = [];
    let overviewViewer;
    let centerRect;
    const toggleOpts = computed(() => {
      return Object.assign({}, {
        color: "#fff",
        background: "#3f4854",
        icon: "vc-icons-overview-toggle",
        size: "15px",
        tooltip: {
          delay: 500,
          anchor: "bottom middle",
          offset: [0, 20],
          tip: void 0
        }
      }, props.toggleOpts);
    });
    const viewerOpts = computed(() => {
      return Object.assign({}, {
        removeCesiumScript: false,
        showCredit: false,
        sceneMode: 2,
        containerId: "vc-overview-map"
      }, props.viewerOpts);
    });
    instance.createCesiumObject = async () => {
      const { viewer } = $services;
      const viewerElement = viewer._element;
      viewerElement.appendChild($(rootRef));
      return [$(rootRef), $(viewerRef)];
    };
    instance.mount = async () => {
      updateRootStyle();
      const { viewer } = $services;
      viewer.clock.onTick.addEventListener(onClockTick);
      return true;
    };
    instance.unmount = async () => {
      const { viewer } = $services;
      const viewerElement = viewer._element;
      viewer.clock.onTick.removeEventListener(onClockTick);
      viewerElement.contains($(rootRef)) && viewerElement.removeChild($(rootRef));
      return true;
    };
    const onClockTick = () => {
      if (overviewViewer) {
        const { viewer: parentViewer } = $services;
        const parentCameraRectangle = parentViewer.camera.computeViewRectangle();
        const { defined } = Cesium;
        if (!defined(parentCameraRectangle)) {
          return;
        }
        const rectangle = parentCameraRectangle.expand(props.widthFactor, props.heightFactor);
        overviewViewer.camera.flyTo({
          destination: rectangle.clone(),
          orientation: {
            heading: parentViewer.camera.heading,
            pitch: parentViewer.camera.pitch,
            roll: parentViewer.camera.roll
          },
          duration: 0
        });
        const { Cartesian3, SceneTransforms } = Cesium;
        const wnPosition = Cartesian3.fromRadians(parentCameraRectangle.west, parentCameraRectangle.north);
        const enPosition = Cartesian3.fromRadians(parentCameraRectangle.east, parentCameraRectangle.north);
        const wsPosition = Cartesian3.fromRadians(parentCameraRectangle.west, parentCameraRectangle.south);
        const esPosition = Cartesian3.fromRadians(parentCameraRectangle.east, parentCameraRectangle.south);
        const scene = overviewViewer.scene;
        const wnWindowPosition = SceneTransforms.wgs84ToWindowCoordinates(scene, wnPosition);
        const enWindowPosition = SceneTransforms.wgs84ToWindowCoordinates(scene, enPosition);
        const wsWindowPosition = SceneTransforms.wgs84ToWindowCoordinates(scene, wsPosition);
        const esWindowPosition = SceneTransforms.wgs84ToWindowCoordinates(scene, esPosition);
        if (!defined(wnWindowPosition) || !defined(enWindowPosition) || !defined(wsWindowPosition) || !defined(esWindowPosition)) {
          return;
        }
        const width = enWindowPosition.x - wnWindowPosition.x;
        const height = wsWindowPosition.y - wnWindowPosition.y;
        const x = (wnWindowPosition.x + enWindowPosition.x) / 2 - width / 2;
        const y = (wnWindowPosition.y + wsWindowPosition.y) / 2 - height / 2;
        if (width <= 0 || height <= 0) {
          return;
        }
        const boundingRectangle = new Cesium.BoundingRectangle(x, y, width, height);
        centerRect.rectangle = boundingRectangle;
        centerRect.material.uniforms.color = makeColor(props.centerRectColor);
        centerRect.show = true;
      }
    };
    const onViewerReady = (readyObj) => {
      const { viewer } = readyObj;
      overviewViewer = viewer;
      const control = viewer.scene.screenSpaceCameraController;
      control.enableRotate = false;
      control.enableTranslate = false;
      control.enableZoom = false;
      control.enableTilt = false;
      control.enableLook = false;
      overviewViewer.scene.highDynamicRange = false;
      overviewViewer.scene.globe.enableLighting = false;
      overviewViewer.scene.globe.showWaterEffect = false;
      overviewViewer.scene.globe.depthTestAgainstTerrain = false;
      overviewViewer.scene.skyAtmosphere.show = false;
      overviewViewer.scene.fog.enabled = false;
      overviewViewer.scene.skyBox.show = false;
      overviewViewer.scene.sun.show = false;
      overviewViewer.scene.moon.show = false;
      overviewViewer.scene.highDynamicRange = false;
      overviewViewer.scene.globe.showGroundAtmosphere = false;
      centerRect = new Cesium.ViewportQuad(new Cesium.BoundingRectangle(150, 100, 100, 50));
      centerRect.show = false;
      overviewViewer.scene.primitives.add(centerRect);
    };
    const updateRootStyle = () => {
      var _a;
      const css = positionState.style.value;
      rootStyle.left = css.left;
      rootStyle.top = css.top;
      rootStyle.transform = css.transform;
      rootStyle["pointer-events"] = "none";
      css.borderRadius = props.borderRadius;
      css.border = props.border;
      if (showing.value) {
        css.width = props.width;
        css.height = props.height;
      } else {
        const reg = /(\d+)/g;
        const regResult = reg.exec(props.border);
        const boder = (regResult == null ? void 0 : regResult.length) ? parseFloat(regResult[0]) : 0;
        const toggleBtnRefStyle = getComputedStyle((_a = $(toggleBtnRef)) == null ? void 0 : _a.$el);
        css.width = `${parseFloat(toggleBtnRefStyle.width) + parseFloat(toggleBtnRefStyle.padding) + boder}px`;
        css.height = `${parseFloat(toggleBtnRefStyle.height) + parseFloat(toggleBtnRefStyle.padding) + boder}px`;
      }
      Object.assign(rootStyle, css);
    };
    const onToggle = () => {
      if (showing.value) {
        minimize();
      } else {
        restore();
      }
      showing.value = !showing.value;
      ctx.emit("update:modelValue", showing.value);
    };
    const minimize = () => {
      var _a;
      const reg = /(\d+)/g;
      const regResult = reg.exec(props.border);
      const boder = (regResult == null ? void 0 : regResult.length) ? parseFloat(regResult[0]) : 0;
      const toggleBtnRefStyle = getComputedStyle((_a = $(toggleBtnRef)) == null ? void 0 : _a.$el);
      rootStyle.width = `${parseFloat(toggleBtnRefStyle.width) + parseFloat(toggleBtnRefStyle.padding) + boder}px`;
      rootStyle.height = `${parseFloat(toggleBtnRefStyle.height) + parseFloat(toggleBtnRefStyle.padding) + boder}px`;
    };
    const restore = () => {
      rootStyle.width = props.width;
      rootStyle.height = props.height;
    };
    onUnmounted(() => {
      unwatchFns.forEach((item) => item());
      unwatchFns = [];
    });
    return () => {
      const children = [];
      children.push(h(VcBtn, {
        ref: toggleBtnRef,
        class: "toggle toggle-" + props.position + (!showing.value ? " minimized " : ""),
        flat: true,
        dense: true,
        icon: toggleOpts.value.icon,
        size: toggleOpts.value.size,
        style: { color: toggleOpts.value.color, background: toggleOpts.value.background, "pointer-events": "auto" },
        onClick: onToggle
      }, () => toggleOpts.value.tooltip ? h(VcTooltip, {
        ref: tooltipRef,
        ...toggleOpts.value.tooltip
      }, () => h("strong", {}, toggleOpts.value.tooltip.tip || t(`vc.overview.${!showing.value ? "show" : "hidden"}`))) : createCommentVNode("v-if")));
      children.push(h(_Viewer, {
        ref: viewerRef,
        ...viewerOpts.value,
        onReady: onViewerReady
      }, () => hSlot(ctx.slots.default)));
      return h("div", {
        ref: rootRef,
        class: "vc-overview-map " + positionState.classes.value,
        style: rootStyle
      }, children);
    };
  }
});

export { OverviewMap as default, overviewProps };
//# sourceMappingURL=index.mjs.map
