import { ILayer, LineLayer, PointLayer } from "@antv/l7";
import Store from "../../../hpaas-core/base/store";
import Overlay from "./../Overlay";
import { IODSegmentOverlayDataOption, IOverlayFilter, IOverlayOptions } from "./../overlay.types";
import HPaaSL7 from "../../HPaaSL7";
import PointModel from "../../../models/PointModel";
import { SegmentOverlayData } from "./../overlay.types";
import { HpaasEventKey } from "../../types";
import { Feature, FeatureCollection, Point, Polygon } from "@turf/turf";
import { filterSegmentGroupDataByFeatures } from "../../../../components/report/worker";

class LineODBySegmentsOverlay extends Overlay<IODSegmentOverlayDataOption> {
  layers = new Map<any, ILayer>();
  data!: SegmentOverlayData[][];
  pointLayers = new Map<any, ILayer>();
  textLayers = new Map<any, ILayer>();
  constructor(hpaas: HPaaSL7, options: IOverlayOptions<IODSegmentOverlayDataOption>) {
    super(hpaas, options);

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

  createOneLayer(filter: IOverlayFilter) {
    const layer = new LineLayer({
      blend: "normal",
      zIndex: 121,
      enableHighlight: false,
    });
    // parseFloat((6 * 1.4 ** (zoom - 17)).toFixed(1));
    //
    layer
      .source([], {
        parser: {
          type: "json",
          x: "x",
          y: "y",
          x1: "x1",
          y1: "y1",
        },
      })
      .shape("arc3d")
      .size(this.dataOption.size || 2)
      .color(filter.color || "#666")
      .style({
        opacity: 1,
        cursor: "pointer",
      });
    //
    this.hpaas.l7Scene.addLayer(layer);
    this.layers.set(filter.name, layer);
    const startPoint = new PointLayer({
      blend: "normal",
      zIndex: 120,
    })
      .source([], {
        parser: {
          type: "json",
          x: "lng",
          y: "lat",
        },
      })
      .shape("circle")
      .color(filter.color || "#666")
      // .animate({
      //   speed: 0.8,
      // })
      .size(25)
      .style({
        opacity: 1.0,
      });
    this.hpaas.l7Scene.addLayer(startPoint);
    this.pointLayers.set(filter.name, startPoint);
    const textLayer = new PointLayer({
      zIndex: 122,
    })
      .source([], {
        parser: {
          type: "json",
          x: "lng",
          y: "lat",
        },
      })
      .shape("text", "text")
      .size(10)
      .color("#999")
      .style({
        textAnchor: "left",
        textOffset: [17, -2],
        padding: [10, 10],
        // textAllowOverlap: true,
      });
    this.hpaas.l7Scene.addLayer(textLayer);
    this.textLayers.set(filter.name, textLayer);
  }
  filterDataByDataOption() {
    console.log("filterDataByDataOption");
    if (this.dataOption.show) {
      this.show();
      this.dataOption.filters.forEach((filter) => {
        if (this.dataOption.show && filter.checked) {
          const filteredList = this.data.map((group) => {
            return group.filter((d) => {
              return filter.value == "*" || d.filterValue == filter.value;
            });
          });
          filter.totalCount = filteredList.length;
          this.updateData(filter, filteredList);
        } else {
          filter.totalCount = 0;
          this.updateData(filter, []);
        }
      });
    } else {
      this.hide();
      this.dataOption.filters.forEach((filter) => {
        this.updateData(filter, []);
      });
    }
  }
  /**
   * 渲染区域内车次或速度可视化
   * @param linesData 渲染数据
   * @param colorOption 颜色配置
   * @param zIndex 渲染层级
   */
  renderData(linesGroupData: SegmentOverlayData[][]) {
    console.log("begin line group");
    if (!this.hpaas.sceneLoaded) {
      this.hpaas.l7Scene.on("loaded", () => {
        this.renderData(linesGroupData);
      });
      return;
    }
    if (!this.hpaas.segmentLoaded) {
      this.hpaas.events.on(HpaasEventKey.SEGMENT_DATA_LOADED, () => {
        this.renderData(linesGroupData);
      });
      return;
    }
    linesGroupData.forEach((group) => {
      group.forEach((l) => {
        const model = Store.segmentsRenderData.get(l.segroad_uid);
        l.model = model;
      });
    });
    this.data = linesGroupData;
    this.filterDataByDataOption();
    // this.dataOption.filters.forEach((filter) => {
    //   let filteredList = [];
    //   if (filter.value == "*") {
    //     filteredList = this.data;
    //   } else {
    //     filteredList = this.data.filter((d) => {
    //       return d.filterValue == filter.value;
    //     });
    //   }
    //   filter.totalCount = filteredList.length;
    //   this.updateData(filter, filteredList);
    // });
  }
  updateData(filter: IOverlayFilter, linesGroupData: SegmentOverlayData[][]) {
    if (!this.hpaas.sceneLoaded) {
      this.hpaas.l7Scene.on("loaded", () => {
        this.updateData(filter, linesGroupData);
      });
      return;
    }
    const paths: {
      x: number;
      y: number;
      x1: number;
      y1: number;
    }[] = [];

    const points: PointModel[] = [];
    linesGroupData.forEach((group) => {
      if (group.length) {
        const startSegment = group[0];
        const endSegment = group[group.length - 1];
        if (startSegment.model && endSegment.model) {
          startSegment.model.point1.lng += (Math.random() - 0.5) * 0.005;
          startSegment.model.point1.lat += (Math.random() - 0.5) * 0.005;
          endSegment.model.point2.lng += (Math.random() - 0.5) * 0.005;
          endSegment.model.point2.lat += (Math.random() - 0.5) * 0.005;
          paths.push({
            x: startSegment.model.point1.lng,
            y: startSegment.model.point1.lat,
            x1: endSegment.model.point2.lng,
            y1: endSegment.model.point2.lat,
          });
          points.push(startSegment.model.point1.setText("起点"));
          points.push(endSegment.model.point2.setText("终点"));
        }
      }
    });
    this.layers.get(filter.name)?.animate({
      enable: true,
      interval: 0.05,
      trailLength: 1,
      duration: 0.5,
    });
    this.pointLayers.get(filter.name)?.animate({
      speed: 1,
    });
    this.layers.get(filter.name)?.show().setData(paths);
    this.pointLayers.get(filter.name)?.show().setData(points);
    this.textLayers.get(filter.name)?.show().setData(points);
  }

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

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

export default LineODBySegmentsOverlay;