text: import jui from "../base/base.js"
  
  export default {
      name: "chart.grid.rule",
      extend: "chart.grid.core",
      component: function () {
          var _ = jui.include("util.base");
          var UtilScale = jui.include("util.scale");
  
          var RuleGrid = function() {
  
              this.top = function(g) {
                  var height = this.axis.area('height'),
                      half_height = height/2;
  
                  g.append(this.axisLine({
                      y1 : this.center ? half_height : 0,
                      y2 : this.center ? half_height : 0,
                      x1 : this.start,
                      x2 : this.end
                  }));
  
                  var ticks = this.ticks,
                      values = this.values,
                      bar = this.bar;
  
                  for (var i = 0; i < ticks.length; i++) {
                      var domain = this.format(ticks[i], i);
  
                      if (!domain && domain !== 0) {
                          continue;
                      }
  
                      var isZero = (ticks[i] == 0),
                          axis = this.chart.svg.group().translate(values[i], (this.center) ? half_height : 0)
  
                      axis.append(this.line({
                          y1 : (this.center) ? -bar : 0,
                          y2 : bar,
                          stroke : this.color("gridAxisBorderColor"),
                          "stroke-width" : this.chart.theme("gridBorderWidth")
                      }));
  
                      if (!isZero || (isZero && !this.hideZero)) {
                          axis.append(this.getTextRotate(this.chart.text({
                              x : 0,
                              y : bar + bar + 4,
                              "text-anchor" : "middle",
                              fill : this.chart.theme("gridFontColor")
                          }, domain)));
                      }
  
                      g.append(axis);
                  }
              }
  
              this.bottom = function(g) {
                  var height = this.axis.area('height'),
                      half_height = height/2;
  
                  g.append(this.axisLine({
                      y1 : this.center ? -half_height : 0,
                      y2 : this.center ? -half_height : 0,
                      x1 : this.start,
                      x2 : this.end
                  }));
  
                  var ticks = this.ticks,
                      values = this.values,
                      bar = this.bar;
  
                  for (var i = 0; i < ticks.length; i++) {
                      var domain = this.format(ticks[i], i);
  
                      if (!domain && domain !== 0) {
                          continue;
                      }
  
                      var isZero = (ticks[i] == 0),
                          axis = this.chart.svg.group().translate(values[i], (this.center) ? -half_height : 0);
  
                      axis.append(this.line({
                          y1 : (this.center) ? -bar : 0,
                          y2 : (this.center) ? bar : -bar,
                          stroke : this.color("gridAxisBorderColor"),
                          "stroke-width" : this.chart.theme("gridBorderWidth")
                      }));
  
                      if (!isZero ||  (isZero && !this.hideZero)) {
                          axis.append(this.getTextRotate(this.chart.text({
                              x : 0,
                              y : -bar * 2,
                              "text-anchor" : "middle",
                              fill : this.chart.theme(isZero, "gridActiveFontColor", "gridFontColor")
                          }, domain)));
                      }
  
                      g.append(axis);
                  }
              }
  
              this.left = function(g) {
                  var width = this.axis.area('width'),
                      height = this.axis.area('height'),
                      half_width = width/2;
  
                  g.append(this.axisLine({
                      x1 : this.center ? half_width : 0,
                      x2 : this.center ? half_width : 0,
                      y1 : this.start ,
                      y2 : this.end
                  }));
  
                  var ticks = this.ticks,
                      values = this.values,
                      bar = this.bar;
  
                  for (var i = 0; i < ticks.length; i++) {
                      var domain = this.format(ticks[i], i);
  
                      if (!domain && domain !== 0) {
                          continue;
                      }
  
                      var isZero = (ticks[i] == 0),
                          axis = this.chart.svg.group().translate((this.center) ? half_width : 0, values[i])
  
                      axis.append(this.line({
                          x1 : (this.center) ? -bar : 0,
                          x2 : bar,
                          stroke : this.color("gridAxisBorderColor"),
                          "stroke-width" : this.chart.theme("gridBorderWidth")
                      }));
  
                      if (!isZero ||  (isZero && !this.hideZero)) {
                          axis.append(this.getTextRotate(this.chart.text({
                              x : bar/2 + 4,
                              y : bar-2,
                              fill : this.chart.theme("gridFontColor")
                          }, domain)));
                      }
  
                      g.append(axis);
                  }
              }
  
              this.right = function(g) {
                  var width = this.axis.area('width'),
                      half_width = width/2;
  
                  g.append(this.axisLine({
                      x1 : this.center ? -half_width : 0,
                      x2 : this.center ? -half_width : 0,
                      y1 : this.start ,
                      y2 : this.end
                  }));
  
                  var ticks = this.ticks,
                      values = this.values,
                      bar = this.bar;
  
                  for (var i = 0; i < ticks.length; i++) {
                      var domain = this.format(ticks[i], i);
  
                      if (!domain && domain !== 0) {
                          continue;
                      }
  
                      var isZero = (ticks[i] == 0),
                          axis = this.chart.svg.group().translate((this.center) ? -half_width : 0, values[i]);
  
                      axis.append(this.line({
                          x1 : (this.center) ? -bar : 0,
                          x2 : (this.center) ? bar : -bar,
                          stroke : this.color("gridAxisBorderColor"),
                          "stroke-width" : this.chart.theme("gridBorderWidth")
                      }));
  
                      if (!isZero ||  (isZero && !this.hideZero)) {
                          axis.append(this.getTextRotate(this.chart.text({
                              x : -bar - 4,
                              y : bar-2,
                              "text-anchor" : "end",
                              fill : this.chart.theme("gridFontColor")
                          }, domain)));
                      }
  
                      g.append(axis);
                  }
              }
  
              this.wrapper = function(scale, key) {
                  var old_scale = scale;
                  var self = this;
  
                  function new_scale(i) {
                      return old_scale(self.axis.data[i][key]);
                  }
  
                  return (key) ? _.extend(new_scale, old_scale) : old_scale;
              }
  
              this.initDomain = function() {
  
                  var domain = [];
                  var min = this.grid.min || undefined,
                      max = this.grid.max || undefined,
                      data = this.data();
                  var value_list = [];
  
                  if (_.typeCheck("string", this.grid.domain)) {
                      var field = this.grid.domain;
  
                      value_list = new Array(data.length);
                      for (var index = 0, len = data.length; index < len; index++) {
  
                          var value = data[index][field];
  
                          if (_.typeCheck("array", value)) {
                              value_list[index] = Math.max(value);
                              value_list.push(Math.min(value));
                          } else {
                              value_list[index]  = value;
                          }
  
                      }
                  } else if (_.typeCheck("function", this.grid.domain)) {
                      value_list = new Array(data.length);
  
                      for (var index = 0, len = data.length; index < len; index++) {
  
                          var value = this.grid.domain.call(this.chart, data[index]);
  
                          if (_.typeCheck("array", value)) {
  
                              value_list[index] = Math.max.apply(Math, value);
                              value_list.push(Math.min.apply(Math, value));
                          } else {
                              value_list[index]  = value;
                          }
                      }
                  } else {
                      value_list = grid.domain;
                  }
  
                  var tempMin = Math.min.apply(Math, value_list);
                  var tempMax = Math.max.apply(Math, value_list);
  
                  if (typeof min == 'undefined') min = tempMin;
                  if (typeof max == 'undefined') max = tempMax;
  
                  this.grid.max = max;
                  this.grid.min = min;
  
                  var unit;
  
                  if (_.typeCheck("function", this.grid.unit)) {
                      unit = this.grid.unit.call(this.chart, this.grid);
                  } else if (_.typeCheck("number", this.grid.unit)) {
                      unit = this.grid.unit;
                  } else {
                      unit = Math.ceil((max - min) / this.grid.step);
                  }
  
                  if (unit == 0) {
                      domain = [0, 0];
                  } else {
  
                      var start = 0;
  
                      while (start < max) {
                          start += unit;
                      }
  
                      var end = start;
                      while (end > min) {
                          end -= unit;
                      }
  
                      domain = [end, start];
                      //this.grid.step = Math.abs(start / unit) + Math.abs(end / unit);
                  }
  
                  if (this.grid.reverse) {
                      domain.reverse();
                  }
  
                  return domain;
              }
  
              this.drawBefore = function() {
                  var domain = this.initDomain();
  
                  var obj = this.getGridSize();
                  this.scale = UtilScale.linear().domain(domain);
  
                  if (this.grid.orient == "left" || this.grid.orient == "right") {
                      var arr = [obj.end, obj.start];
                  } else {
                      var arr = [obj.start, obj.end]
                  }
                  this.scale.range(arr);
  
                  this.start = obj.start;
                  this.size = obj.size;
                  this.end = obj.end;
                  this.step = this.grid.step;
                  this.nice = this.grid.nice;
                  this.ticks = this.scale.ticks(this.step, this.nice);
                  this.bar = 6;
                  this.hideZero = this.grid.hideZero;
                  this.center = this.grid.center;
                  this.values = [];
  
                  for (var i = 0, len = this.ticks.length; i < len; i++) {
                      this.values[i] = this.scale(this.ticks[i]);
                  }
              }
  
              this.draw = function() {
                  return this.drawGrid(chart, orient, "rule", grid);
              }
          }
  
          RuleGrid.setup = function() {
              return {
                  /** @cfg {String/Array/Function} [domain=null] Sets the value displayed on an axis.*/
                  domain: null,
                  /** @cfg {Array} [step=10] Sets the interval of the scale displayed on a grid. */
                  step: 10,
                  /** @cfg {Number} [min=0] Sets the minimum value of a grid.  */
                  min: 0,
                  /** @cfg {Number} [max=0] Sets the maximum value of a grid. */
                  max: 0,
                  /** @cfg {Number} [unit=null] Multiplies the axis value to be displayed.  */
                  unit: null,
                  /**
                   * @cfg {Boolean} [clamp=true]
                   *
                   * max 나 min 을 넘어가는 값에 대한 체크,
                   * true 이면 넘어가는 값도 min, max 에서 조정, false 이면  비율로 계산해서 넘어가는 값 적용
                   */
                  clamp : true,
                  /** @cfg {Boolean} [reverse=false] Reverses the value on domain values*/
                  reverse: false,
                  /** @cfg {String} [key=null] Sets the value on the grid to the value for the specified key. */
                  key: null,
                  /** @cfg {Boolean} [hideText=false] Determines whether to show text across the grid. */
                  hideText: false,
                  /** @cfg {Boolean} [hideZero=false] Determines whether to show '0' displayed on the grid. */
                  hideZero: false,
                  /** @cfg {Boolean} [nice=false] Automatically sets the value of a specific section.  */
                  nice: false,
                  /** @cfg {Boolean} [center=false] Place the reference axis in the middle.  */
                  center: false
  
              };
          }
  
          return RuleGrid;
      }
  }