import Shape from './shape';
import { AreaOptions } from '../models/painter';

function filterPoints(points) {
  const filteredPoints = [];
  for (let i = 0, len = points.length; i < len; i++) {
    const point = points[i];
    if (!isNaN(point.x) && !isNaN(point.y)) {
      filteredPoints.push(point);
    }
  }

  return filteredPoints;
}

export default class Area extends Shape {
  draw(): void {
    const {
      points = [],
      fillStyle = 'rgba(200, 200, 200, .2)',
    } = this.config as AreaOptions;

    const filteredPoints = filterPoints(points);

    this.ctx.save();
    this.ctx.beginPath();

    // 绘制
    if (filteredPoints.length) {
      this.ctx.moveTo(filteredPoints[0].x, filteredPoints[0].y);

      let i;
      let l;
      for (i = 1, l = filteredPoints.length - 1; i < l; i++) {
        this.ctx.lineTo(filteredPoints[i].x, filteredPoints[i].y);
      }
      this.ctx.lineTo(filteredPoints[l].x, filteredPoints[l].y);

      this.ctx.closePath();
    }
    this.ctx.fillStyle = fillStyle;
    this.ctx.fill();
    this.ctx.restore();
  }
}