import { useDispatch } from "react-redux";
import { Camera, useCesium } from "resium";

function LabFlytoQTP() {
  const { viewer } = useCesium();
  const { camera } = viewer;
  const dispatch = useDispatch();

  function cameraFlyToLine(adjustPitch) {
    // barotorpic
    const barotorpic = {
      destination: Cesium.Cartesian3.fromDegrees(42, 46, 15000000),
      duration: 30,
      complete: () => {},
    };

    // 俯视看箭头上升
    const sideViewOptions = {
      destination: Cesium.Cartesian3.fromDegrees(-50, 46, 2000000),
      duration: 5,
      orientation: {
        heading: Cesium.Math.toRadians(-15.0),
        pitch: -Cesium.Math.PI_OVER_FOUR,
        roll: 0.0,
      },
      complete: () => {
        viewer.clock.shouldAnimate = true;
        setTimeout(function () {
          camera.flyTo(barotorpic);
        }, 1000);
        dispatch.data.updateImageLayer({
          labrador: true,
        });
        dispatch.data.updateToolbar({ showPanel: true });
      },
    };

    // 青藏高原
    const plateauOptions = {
      destination: Cesium.Cartesian3.fromDegrees(90, 20, 1600000),
      duration: 5,
      orientation: {
        heading: Cesium.Math.toRadians(-15.0),
        pitch: -Cesium.Math.PI_OVER_FOUR,
        roll: 0.0,
      },
      complete: function () {
        setTimeout(function () {
          camera.flyTo(sideViewOptions);
        }, 1000);
      },
    };

    // 拉布拉多海
    const labrador = {
      destination: Cesium.Cartesian3.fromDegrees(-55, 45, 1600000),
      duration: 10,
      orientation: {
        heading: Cesium.Math.toRadians(-15.0),
        pitch: -Cesium.Math.PI_OVER_FOUR,
        roll: 0.0,
      },
      complete: function () {
        setTimeout(function () {
          camera.flyTo(plateauOptions);
        }, 1000);
      },
    };

    if (adjustPitch) {
      plateauOptions.pitchAdjustHeight = 1000;
      sideViewOptions.pitchAdjustHeight = 1000;
    }
    camera.flyTo(labrador);
  }
  cameraFlyToLine();

  return <></>;
}

export default LabFlytoQTP;
