import * as mars3d from "mars3d"

export let map // mars3d.Map三维地图对象
export let graphicLayer // 矢量图层对象

// 需要覆盖config.json中地图属性参数（当前示例框架中自动处理合并）
export const mapOptions = {
  scene: {
    center: { lat: 31.623244, lng: 123.508771, alt: 345435, heading: 0, pitch: -48 }
    // cameraController: {
    //   maximumZoomDistance: 500000000,
    // },
  },
  control: {
    clockAnimate: true, // 时钟动画控制(左下角)
    timeline: true,
    compass: { top: "10px", left: "5px" }
  }
}

export const eventTarget = new mars3d.BaseClass()

/**
 * 初始化地图业务，生命周期钩子函数（必须）
 * 框架在地图初始化完成后自动调用该函数
 * @param {mars3d.Map} mapInstance 地图对象
 * @returns {void} 无
 */
export function onMounted(mapInstance) {
  map = mapInstance // 记录首次创建的map
  map.toolbar.style.bottom = "55px" // 修改toolbar控件的样式

  // url传入模型地址
  const type = mars3d.Util.getRequestByName("data")
  switch (type) {
    case "feiji":
      showAircraft()
      break
    case "chuanbo":
      showShip()
      break
    case "huojian":
      showRocket()
      break
    default:
      showAircraft()
      break
  }
}

/**
 * 释放当前地图业务的生命周期函数
 * @returns {void} 无
 */
export function onUnmounted() {
  map = null
}

function removeLayer() {
  map.trackedEntity = null
  if (graphicLayer) {
    map.removeLayer(graphicLayer, true)
    graphicLayer = null
  }
}

// 示例：
export function showAircraft() {
  removeLayer()

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "飞行编队",
    url: "//data.mars3d.cn/file/czml/flight.czml",
    popup: "all",
    flyTo: true
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)
    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}

// 示例：
export function showCar() {
  removeLayer()

  map.setCameraView({ lat: 40.893923, lng: 121.917192, alt: 691, heading: 64, pitch: -46 })

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "汽车",
    url: "//data.mars3d.cn/file/czml/car.czml"
    // flyTo: true,
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)
    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}

// 示例：
export function showShip() {
  removeLayer()

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "船舶编队",
    url: "//data.mars3d.cn/file/czml/ship.czml",
    popup: "all",
    flyTo: true
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)
    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}

// 示例：
export function showBDSatellite() {
  removeLayer()

  // 更新地球参数
  map.setSceneOptions({
    cameraController: {
      maximumZoomDistance: 500000000
    }
  })

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "北斗卫星",
    url: "//data.mars3d.cn/file/czml/satellite.czml",
    center: { lng: 10, lat: 111.833884, z: 150000000, heading: 0, pitch: -90, roll: 0 },
    flyTo: true
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)

    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}

export function showSatellite() {
  removeLayer()

  // 更新地球参数
  map.setSceneOptions({
    cameraController: {
      maximumZoomDistance: 500000000
    }
  })

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "卫星",
    url: "//data.mars3d.cn/file/czml/satellite-simple.czml",
    center: { lat: -20.236138, lng: -144.262661, alt: 41875827, heading: 339, pitch: -90 },
    flyTo: true
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)

    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}

// 示例：
export function showRocket() {
  removeLayer()

  map.basemap = "ArcGIS影像"
  map.setCameraView({ lat: 28.561843, lng: -80.577575, alt: 630, heading: 359, pitch: -85 })

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "火箭发射",
    url: "//data.mars3d.cn/file/czml/space.czml",
    flyTo: true
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)
    // 火星发射时，锁定火箭模型对象
    map.trackedEntity = data.dataSource.entities.getById("Vulcan")

    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}

// 示例：
export function showFireDrill() {
  removeLayer()

  map.setCameraView({ lat: 32.891559, lng: 117.360875, alt: 378, heading: 18, pitch: -62 })

  graphicLayer = new mars3d.layer.CzmlLayer({
    name: "消防演练",
    url: "//data.mars3d.cn/file/czml/firedrill.czml"
    // flyTo: true
  })
  map.addLayer(graphicLayer)

  // 绑定事件
  graphicLayer.on(mars3d.EventType.load, function (data) {
    console.log("数据加载完成", data)
    eventTarget.fire("loadGraphicLayer", { data })
  })
  graphicLayer.on(mars3d.EventType.click, function (event) {
    console.log("单击了图层", event)
  })
}