//提示信息
const Tooltip = function (styleOrText = {}, position, show) {
  let style, _x, _y, _color, id;
  if (typeof styleOrText === "object") {
    style = styleOrText;
  }
  if (style && style.origin) {
    style.origin === "center" && ((_x = 15), (_y = -12));
    style.origin === "top" && ((_x = 15), (_y = -44));
    style.origin === "bottom" && ((_x = 15), (_y = 20));
  } else {
    _x = 15;
    _y = 20;
  }
  if (style && style.color) {
    style.color === "white" &&
      (_color = "background: rgba(255, 255, 255, 0.8);color: black;");
    style.color === "black" &&
      (_color = "background: rgba(0, 0, 0, 0.5);color: white;");
    style.color === "yellow" &&
      (_color =
        "color: black;background-color: #ffcc33;border: 1px solid white;");
  } else {
    _color = "background: rgba(0, 0, 0, 0.5);color: white;";
  }
  if (style && style.id) {
    id = `toolTip${style.id}`;
  } else {
    id = "toolTip";
  }

  let tooltip = null;

  if (!tooltip) {
    const elementbottom = document.createElement("div");
    $(".map-widget").append(elementbottom);
    const html = `<div id="${id}" style="display: none;pointer-events: none;position: absolute;z-index: 1000;opacity: 0.8;border-radius: 4px;padding: 4px 8px;white-space: nowrap;font-family:黑体;color:white;font-weight: bolder;font-size: 14px;${_color}"></div>`;
    $(".map-widget").append(html);
    tooltip = document.getElementById(id);
  }
  if (show) {
    tooltip.innerHTML = styleOrText;
    tooltip.style.left = `${position.x + _x}px`;
    tooltip.style.top = `${position.y + _y}px`;
    tooltip.style.display = "block";
  } else {
    tooltip.style.display = "none";
  }
  return {
    tooltip: tooltip,
    style: style,
    showAt: function (position, text) {
      this.tooltip.innerHTML = text;
      if (this.style && this.style.origin) {
        this.style.origin === "center" &&
          ((_x = 15), (_y = -this.tooltip.offsetHeight / 2));
        this.style.origin === "top" &&
          ((_x = 15), (_y = -this.tooltip.offsetHeight - 20));
        this.style.origin === "bottom" && ((_x = 15), (_y = 20));
      } else {
        _x = 15;
        _y = -this.tooltip.offsetHeight / 2;
      }
      this.tooltip.style.left = `${position.x + _x}px`;
      this.tooltip.style.top = `${position.y + _y}px`;
      this.tooltip.style.display = "block";
    },
    show: function (show) {
      if (show) {
        this.tooltip.style.display = "block";
      } else {
        this.tooltip.style.display = "none";
      }
    },
  };
}
let handler = null;

const EditTools = (earthCtrl, callback) => {
  const parameter = "";
  let item = null;
  const textareas = 0;
  let we;
  const tempPointsxp = [];
  handler = new earthCtrl._cesium.ScreenSpaceEventHandler(
    earthCtrl.coreMap.scene.canvas
  );
  const positions = [];
  let hierarch = {};
  let poly;
  let model = {}

  earthCtrl.coreMap.scene.globe.depthTestAgainstTerrain = true;

  //绘制面
  const PolygonPrimitive = (function () {
    function execute(hierarch) {
      this.options = {
        name: "",
        polygon: {
          hierarchy: [],
          heightReference: earthCtrl._cesium.defaultValue(
            parameter.heightReference,
            1
          ),
          perPositionHeight: parameter.heightReference === 0 ? true : false,
          material: earthCtrl._cesium.defaultValue(
            parameter.material,
            earthCtrl._cesium.Color.YELLOW.withAlpha(0.5)
          )
        },
      };
      this.hierarchy = hierarch;
      this._init();
    }

    execute.prototype._init = function () {
      const _self = this;
      const _update = function () {
        return _self.hierarchy;
      };
      //实时更新polygon.hierarchy
      this.options.polygon.hierarchy = new earthCtrl._cesium.CallbackProperty(
        _update,
        false
      );
      this.polygon = earthCtrl.entities.add(this.options);
      item = this.polygon;
    };
    return execute;
  })();

  //鼠标单击画点
  handler.setInputAction(function (movement) {
    const ray = earthCtrl.coreMap.camera.getPickRay(movement.position);
    const cartesian = earthCtrl.coreMap.scene.globe.pick(
      ray,
      earthCtrl.coreMap.scene
    );

    let pickObject = earthCtrl.coreMap.scene.pick(movement.position);
    model = pickObject
    // var textArea = getArea(tempPointsxp, positions);
    const cartographic = earthCtrl._cesium.Cartographic.fromCartesian(
      cartesian
    );
    const longitudeString = earthCtrl._cesium.Math.toDegrees(
      cartographic.longitude
    );
    const latitudeString = earthCtrl._cesium.Math.toDegrees(
      cartographic.latitude
    );
    if (positions.length === 0) {
      positions.push(cartesian.clone());
      tempPointsxp.push([longitudeString, latitudeString]);
    }
    positions.push(cartesian);
    hierarch = new earthCtrl._cesium.PolygonHierarchy(positions);
    tempPointsxp.push([longitudeString, latitudeString]);
  }, earthCtrl._cesium.ScreenSpaceEventType.LEFT_CLICK);


  //鼠标移动
  const tooltip = new Tooltip();
  handler.setInputAction(function (movement) {
    if (positions.length === 0) {
      tooltip.showAt(movement.endPosition, "左键开始绘制！");
    } else if (positions.length <= 2) {
      tooltip.showAt(movement.endPosition, "点击继续绘制！");
    } else {
      tooltip.showAt(movement.endPosition, "右键结束绘制！");
    }
    const cartesian = earthCtrl.coreMap.scene.pickPosition(
      movement.endPosition
    );
    if (!cartesian) {
      return;
    }
    const cartographic = earthCtrl._cesium.Cartographic.fromCartesian(
      cartesian
    );
    const longitudeString = earthCtrl._cesium.Math.toDegrees(
      cartographic.longitude
    );
    const latitudeString = earthCtrl._cesium.Math.toDegrees(
      cartographic.latitude
    );
    if (positions.length >= 2) {
      if (!earthCtrl._cesium.defined(poly)) {
        hierarch = new earthCtrl._cesium.PolygonHierarchy(positions);
        poly = new PolygonPrimitive(hierarch);
      } else if (cartesian !== undefined) {
        positions.pop();
        cartesian.y += 1 + Math.random();
        positions.push(cartesian);
        hierarch = new earthCtrl._cesium.PolygonHierarchy(positions);
        tempPointsxp.pop();
        tempPointsxp.push([longitudeString, latitudeString]);
      }
      // var textArea = getArea(tempPointsxp, positions);
      // textareas = textArea;
      earthCtrl.entities.remove(we);
      we = earthCtrl.entities.add({
        name: "多边形面积",
        position: new earthCtrl._cesium.CallbackProperty(function () {
          const p = new earthCtrl._cesium.Cartesian3();
          positions.forEach((item) => {
            earthCtrl._cesium.Cartesian3.add(p, item, p);
          });
          return earthCtrl._cesium.Cartesian3.divideByScalar(
            p,
            positions.length,
            new earthCtrl._cesium.Cartesian3()
          );
        }, false),
      });
    }
  }, earthCtrl._cesium.ScreenSpaceEventType.MOUSE_MOVE);


  //鼠标右键单击结束绘制
  handler.setInputAction(function (movement) {
    // _this._tree.endtemporaryItem();
    handler.destroy();
    tooltip.show(false);
    //创建面对象并返回面对象
    const ploylinejl = {
      polygon: {},
      positions: [],
      area: [],
    };
    ploylinejl.polygon = poly;
    const positionsop = [];
    for (let j = 0; j < positions.length; j++) {
      const cartographicdr = earthCtrl._cesium.Cartographic.fromCartesian(
        positions[j]
      );
      const longitudeStringdr = earthCtrl._cesium.Math.toDegrees(
        cartographicdr.longitude
      );
      const latitudeStringdr = earthCtrl._cesium.Math.toDegrees(
        cartographicdr.latitude
      );
      const heightStringdr = cartographicdr.height;
      positionsop.push({
        lon: longitudeStringdr,
        lat: latitudeStringdr,
        hei: heightStringdr,
      });
    }
    ploylinejl.positions = positionsop;
    // callback & callback(tempPointsxp, parseInt(textareas))
    callback & callback(tempPointsxp, model);
    model = {}
    // callback & callback(item, tempPointsxp);
    earthCtrl.entities.remove(we);
    earthCtrl.entities.remove(item);
  }, earthCtrl._cesium.ScreenSpaceEventType.RIGHT_CLICK);
}

export default EditTools;