/**
 * echarts组件： 网格
 *
 * @desc echarts基于Canvas，纯Javascript图表库，提供直观，生动，可交互，可个性化定制的数据统计图表。
 * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
 *
 */
module.exports = function (require) {
  var Base = require('./base'); // 图形依赖


  var RectangleShape = require('zrender/shape/Rectangle');

  var ecConfig = require('../config'); // 网格


  ecConfig.grid = {
    zlevel: 0,
    // 一级层叠
    z: 0,
    // 二级层叠
    x: 80,
    y: 60,
    x2: 80,
    y2: 60,
    // width: {totalWidth} - x - x2,
    // height: {totalHeight} - y - y2,
    backgroundColor: 'rgba(0,0,0,0)',
    borderWidth: 1,
    borderColor: '#ccc'
  };

  var zrUtil = require('zrender/tool/util');
  /**
   * 构造函数
   * @param {Object} messageCenter echart消息中心
   * @param {ZRender} zr zrender实例
   * @param {Object} option 图表选项
   *      @param {number=} option.grid.x 直角坐标系内绘图网格起始横坐标，数值单位px
   *      @param {number=} option.grid.y 直角坐标系内绘图网格起始纵坐标，数值单位px
   *      @param {number=} option.grid.width 直角坐标系内绘图网格宽度，数值单位px
   *      @param {number=} option.grid.height 直角坐标系内绘图网格高度，数值单位px
   */


  function Grid(ecTheme, messageCenter, zr, option, myChart) {
    Base.call(this, ecTheme, messageCenter, zr, option, myChart);
    this.refresh(option);
  }

  Grid.prototype = {
    type: ecConfig.COMPONENT_TYPE_GRID,
    getX: function () {
      return this._x;
    },
    getY: function () {
      return this._y;
    },
    getWidth: function () {
      return this._width;
    },
    getHeight: function () {
      return this._height;
    },
    getXend: function () {
      return this._x + this._width;
    },
    getYend: function () {
      return this._y + this._height;
    },
    getArea: function () {
      return {
        x: this._x,
        y: this._y,
        width: this._width,
        height: this._height
      };
    },
    getBbox: function () {
      return [[this._x, this._y], [this.getXend(), this.getYend()]];
    },

    /**
     * 实在找不到合适的地方做了，各种粗暴的写法~ -_-
     */
    refixAxisShape: function (component) {
      var zeroX;
      var zeroY;

      var axisList = component.xAxis._axisList.concat(component.yAxis ? component.yAxis._axisList : []);

      var len = axisList.length;
      var axis;

      while (len--) {
        axis = axisList[len];

        if (axis.type == ecConfig.COMPONENT_TYPE_AXIS_VALUE && axis._min < 0 && axis._max >= 0) {
          axis.isHorizontal() ? zeroX = axis.getCoord(0) : zeroY = axis.getCoord(0);
        }
      }

      if (typeof zeroX != 'undefined' || typeof zeroY != 'undefined') {
        len = axisList.length;

        while (len--) {
          axisList[len].refixAxisShape(zeroX, zeroY);
        }
      }
    },
    refresh: function (newOption) {
      if (newOption || this._zrWidth != this.zr.getWidth() || this._zrHeight != this.zr.getHeight()) {
        this.clear();
        this.option = newOption || this.option;
        this.option.grid = this.reformOption(this.option.grid);
        var gridOption = this.option.grid;
        this._zrWidth = this.zr.getWidth();
        this._zrHeight = this.zr.getHeight();
        this._x = this.parsePercent(gridOption.x, this._zrWidth);
        this._y = this.parsePercent(gridOption.y, this._zrHeight);
        var x2 = this.parsePercent(gridOption.x2, this._zrWidth);
        var y2 = this.parsePercent(gridOption.y2, this._zrHeight);

        if (typeof gridOption.width == 'undefined') {
          this._width = this._zrWidth - this._x - x2;
        } else {
          this._width = this.parsePercent(gridOption.width, this._zrWidth);
        }

        this._width = this._width <= 0 ? 10 : this._width;

        if (typeof gridOption.height == 'undefined') {
          this._height = this._zrHeight - this._y - y2;
        } else {
          this._height = this.parsePercent(gridOption.height, this._zrHeight);
        }

        this._height = this._height <= 0 ? 10 : this._height;
        this._x = this.subPixelOptimize(this._x, gridOption.borderWidth);
        this._y = this.subPixelOptimize(this._y, gridOption.borderWidth);
        this.shapeList.push(new RectangleShape({
          zlevel: this.getZlevelBase(),
          z: this.getZBase(),
          hoverable: false,
          style: {
            x: this._x,
            y: this._y,
            width: this._width,
            height: this._height,
            brushType: gridOption.borderWidth > 0 ? 'both' : 'fill',
            color: gridOption.backgroundColor,
            strokeColor: gridOption.borderColor,
            lineWidth: gridOption.borderWidth // type: this.option.splitArea.areaStyle.type,

          }
        }));
        this.zr.addShape(this.shapeList[0]);
      }
    }
  };
  zrUtil.inherits(Grid, Base);

  require('../component').define('grid', Grid);

  return Grid;
}(require);