import { LineLayer, Marker, MarkerLayer, Popup } from "@antv/l7";
import Store from "../../../hpaas-core/base/store";
import Overlay from "../Overlay";
import { IOverlayFilter, IOverlayOptions, ISegmentOverlayDataOption, SegmentOverlayData } from "../overlay.types";
import HPaaSL7 from "../../HPaaSL7";
import { Feature, featureCollection, Point, Polygon, Properties } from "@turf/turf";
import LineModel from "../../../models/LineModel";
import { HpaasEventKey } from "../../types";
import { filterSegmentDataByFeatures } from "../../../../components/report/worker";

class LineBySegmentsOverlay extends Overlay<ISegmentOverlayDataOption> {
  layers = new Map<any, LineLayer>();
  data!: SegmentOverlayData[];
  lastZoom = 0;

  constructor(hpaas: HPaaSL7, options: IOverlayOptions<ISegmentOverlayDataOption>) {
    super(hpaas, options);

    this.dataOption.filters.forEach((filter) => {
      this.createOneLayer(filter);
    });
  }

  createOneLayer(filter: IOverlayFilter) {
    const zoom = this.hpaas.l7Scene.getZoom();
    this.lastZoom = zoom;
    const w = 2;
    const layer = new LineLayer({
      blend: "normal",
      zIndex: 90,
    });
    // parseFloat((6 * 1.4 ** (zoom - 17)).toFixed(1));
    //
    layer
      .source(featureCollection([]))
      .shape("line")
      .size(w)
      .color(filter.color || "#666")
      .style({
        opacity: 0.5,
        cursor: "pointer",
      });
    this.hpaas.l7Scene.addLayer(layer);
    this.layers.set(filter.name, layer);

    // this.hpaas.scene.on("mapmove", () => {
    //   const zoom = this.hpaas.scene.getZoom();
    //   const w = parseFloat((6 * 1.4 ** (zoom - 17)).toFixed(1)) as any;
    //   if (Math.abs(zoom - this.lastZoom) > 1) {
    //     this.layer?.size(w);
    //     this.checkedLayer?.size(w);
    //     this.lastZoom = zoom;
    //   }
    // });
  }
  filterDataByDataOption() {
    console.log("filterDataByDataOption");
    if (this.dataOption.show) {
      this.show();
      this.dataOption.filters.forEach((filter) => {
        const filteredList = filter.checked
          ? this.data.filter((d) => {
              return filter.value == "*" || d.filterValue == filter.value;
            })
          : [];
        filter.totalCount = filteredList.length;
        this.updateData(filter, filteredList);
      });
    } else {
      this.hide();
      this.layers.forEach((l) => {
        l.setData(featureCollection([]));
      });
    }
  }
  /**
   * 渲染区域内车次或速度可视化
   * @param linesData 渲染数据
   * @param colorOption 颜色配置
   * @param zIndex 渲染层级
   */
  renderData(linesData: SegmentOverlayData[]) {
    console.log("begin overlay line");
    if (!this.hpaas.sceneLoaded) {
      this.hpaas.l7Scene.on("loaded", () => {
        this.renderData(linesData);
      });
      return;
    }
    if (!this.hpaas.segmentLoaded) {
      this.hpaas.events.on(HpaasEventKey.SEGMENT_DATA_LOADED, () => {
        this.renderData(linesData);
      });
      return;
    }
    linesData.forEach((l) => {
      const model = Store.segmentsRenderData.get(l.segroad_uid);
      l.model = model;
    });
    this.data = linesData;

    this.filterDataByDataOption();
  }
  updateData(filter: IOverlayFilter, linesData: SegmentOverlayData[]) {
    console.log("segment begin updatedata");
    if (!this.hpaas.sceneLoaded) {
      this.hpaas.l7Scene.on("loaded", () => {
        this.updateData(filter, linesData);
      });
      return;
    }
    if (!this.hpaas.segmentLoaded) {
      this.hpaas.events.on(HpaasEventKey.SEGMENT_DATA_LOADED, () => {
        this.updateData(filter, linesData);
      });
      return;
    }
    const lineModels: LineModel[] = [];
    linesData.forEach((l) => {
      if (l.model) {
        lineModels.push(l.model);
      }
    });
    console.log("segment begin render data");

    const geometrys: Feature[] = [];
    lineModels.forEach((d) => {
      if (this.dataOption.lineArc) {
        d.geometry && geometrys.push(d.geometry);
      } else {
        geometrys.push(d.toTurf());
      }
    });
    const _featureCollection = featureCollection(geometrys);
    // requestAnimationFrame(() => {
    console.log("segment start set data");
    this.layers.get(filter.name)?.setData(_featureCollection);
    console.log("segment end render data");
    // });
  }

  hide() {
    this.layers.forEach((l) => {
      l.hide();
    });
  }

  show() {
    this.layers.forEach((l) => {
      l.show();
    });
  }
  async filterByFeature(features: Feature<Polygon>[]) {
    if (features.length == 0) {
      this.filterDataByDataOption();
      return;
    }
    const result = await filterSegmentDataByFeatures(this.data, features);
    result.forEach((l) => {
      const model = Store.segmentsRenderData.get(l.segroad_uid);
      l.model = model;
    });
    this.dataOption.filters.forEach((filter) => {
      const filteredList = filter.checked
        ? result.filter((d) => {
            return filter.value == "*" || d.filterValue == filter.value;
          })
        : [];
      filter.totalCount = filteredList.length;
      this.updateData(filter, filteredList);
    });
  }
}

export default LineBySegmentsOverlay;