import POILayer2D from "./POILayer2D";
import Style from 'ol/style/Style';
import StrokeStyle from 'ol/style/Stroke';
import { zindex2d } from "../../zindex";
import FillStyle from "ol/style/Fill";
import { Text } from 'ol/style';
import { Fill } from "ol/style.js";
import Stroke from "ol/style/Stroke";
import {config} from "../../../../../config";

export default class HL2Layer2D extends POILayer2D {
  static LayerName = 'HL2Layer';

  constructor(props) {
    super(props);

    this._style1 = new Style({
      stroke: new StrokeStyle({
        color: '#0070ff',
        width: 2,
      }),
      zIndex: zindex2d.sx,
    });

    this._style2 = new Style({
      // stroke: new StrokeStyle({
      //   color: 'rgba(122,227,200, 1)',
      //   width: 2,
      // }),
      fill: new FillStyle({
        color: '#bfdafc',//'rgba(0,161,233)',
      }),
      zIndex: zindex2d.sx,
    })
  }

  getLayerName() {
    return HL2Layer2D.LayerName;
  }

  async dataPromise() {
    const hlData = await fetch(`${process.env.PUBLIC_URL}/data/geojson/macheng/hl2.geojson`)
      .then(resp => resp.json())
      .then(data => data.features)
      .then(features => features
        // .filter(o => o.geometry.type === 'LineString' && o.geometry.coordinates.length > 1)
        .map(({ properties, geometry }) => ({
          ...properties,
          geometry,
          name: properties.name || properties.Name,
          pname: properties.projName,
          id: properties.FID, 
        })))
      .catch(() => []);
    return hlData;
  }

  styleFunc = (e) => {
    if (!this.isVisible()) {
      return null;
    }
    return this._style2;
  }
}