text: // Generated by CoffeeScript 1.12.7
  var MultiBarChart, React, ReactDOM, d3,
    extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
    hasProp = {}.hasOwnProperty;
  
  React = require('react');
  
  ReactDOM = require('react-dom');
  
  d3 = require('d3');
  
  MultiBarChart = (function(superClass) {
    extend(MultiBarChart, superClass);
  
    function MultiBarChart() {
      return MultiBarChart.__super__.constructor.apply(this, arguments);
    }
  
    MultiBarChart.prototype.componentDidMount = function() {
      return this.renderBarChart();
    };
  
    MultiBarChart.prototype.componentWillUnmount = function() {
      if (this.tooltip != null) {
        return this.tooltip.remove();
      }
    };
  
    MultiBarChart.prototype.render = function() {
      return React.createElement("svg", null);
    };
  
    MultiBarChart.prototype.renderBarChart = function() {
      var bar, barWidth, chart, height, self, tooltip, values, xAxis, y;
      self = this;
      if (this.props.hoverColor == null) {
        this.props.hoverColor = this.props.fillColor;
      }
      values = this.props.data.slice();
      y = d3.scale.linear().range([this.props.height, 0]);
      y.domain([0, Math.max.apply(null, values)]);
      if (this.props.xAxis) {
        height = this.props.height + 1;
      } else {
        height = this.props.height;
      }
      chart = d3.select(ReactDOM.findDOMNode(this)).attr("width", this.props.width).attr("height", height);
      barWidth = this.props.width / values.length;
      bar = chart.selectAll(".rect").data(values).enter().append("g").attr("transform", function(d, i) {
        return "translate(" + i * barWidth + ",0)";
      });
      if (self.props.tooltip) {
        this.tooltip = tooltip = d3.select("body").append("div").attr("class", "barchart-tooltip").style("opacity", 1e-6).style("position", "absolute");
        bar.append("rect").attr("width", barWidth - 3).attr("height", this.props.height).attr("y", 0).attr("fill", this.props.bgColor).on("mouseover", function(d, i) {
          var box, coords, fadingIn, matrix, point, scrollLeft, scrollTop, tipHeight, tipWidth;
          d3.select(this).attr("fill", self.props.bgColor);
          if (self.props.tooltip) {
            point = chart[0][0].createSVGPoint();
            matrix = this.getScreenCTM();
            box = this.getBBox();
            point.x = box.x;
            point.y = box.y;
            coords = point.matrixTransform(matrix);
            tooltip.html(self.props.tipTemplate(d, i, values));
            tipWidth = tooltip[0][0].offsetWidth;
            tipHeight = tooltip[0][0].offsetHeight;
            if (tooltip[0][0].style.opacity < 0.5) {
              fadingIn = true;
            }
            scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
            scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
            if (fadingIn) {
              return tooltip.style("visibility", "visible").style("left", coords.x + scrollLeft - tipWidth / 2 + barWidth / 2 - self.props.tipOffset[0] + "px").style("top", coords.y + scrollTop - tipHeight - self.props.tipOffset[1] + "px").transition().duration(100).style("opacity", 1);
            } else {
              return tooltip.style("visibility", "visible").transition().duration(100).style("opacity", 1).style("left", coords.x + scrollLeft - tipWidth / 2 + barWidth / 2 - self.props.tipOffset[0] + "px").style("top", coords.y + scrollTop - tipHeight - self.props.tipOffset[1] + "px");
            }
          }
        }).on("mouseout", function(d) {
          d3.select(this).attr("fill", self.props.bgColor);
          if (self.props.tooltip) {
            return tooltip.transition().duration(250).style("opacity", 1 / 1e6).each("end", function() {
              return tooltip.style("visibility", "hidden");
            });
          }
        });
      }
      bar.append("rect").attr("y", function(d) {
        return y(d);
      }).attr("height", (function(_this) {
        return function(d) {
          return _this.props.height - y(d);
        };
      })(this)).attr("width", barWidth - 3).attr("fill", this.props.fillColor).on("mouseover", function(d, i) {
        var box, coords, fadingIn, matrix, point, scrollLeft, scrollTop, tipHeight, tipWidth;
        d3.select(this).attr("fill", self.props.hoverColor);
        if (self.props.tooltip) {
          point = chart[0][0].createSVGPoint();
          matrix = this.getScreenCTM();
          box = this.getBBox();
          point.x = box.x;
          point.y = box.y;
          coords = point.matrixTransform(matrix);
          tooltip.html(self.props.tipTemplate(d, i, values));
          tipWidth = tooltip[0][0].offsetWidth;
          tipHeight = tooltip[0][0].offsetHeight;
          if (tooltip[0][0].style.opacity < 0.5) {
            fadingIn = true;
          }
          scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
          scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
          if (fadingIn) {
            return tooltip.style("visibility", "visible").style("left", coords.x + scrollLeft - tipWidth / 2 + barWidth / 2 - self.props.tipOffset[0] + "px").style("top", coords.y + scrollTop - tipHeight - self.props.tipOffset[1] + "px").transition().duration(100).style("opacity", 1);
          } else {
            return tooltip.style("visibility", "visible").transition().duration(100).style("opacity", 1).style("left", coords.x + scrollLeft - tipWidth / 2 + barWidth / 2 - self.props.tipOffset[0] + "px").style("top", coords.y + scrollTop - tipHeight - self.props.tipOffset[1] + "px");
          }
        }
      }).on("mouseout", function(d) {
        d3.select(this).attr("fill", self.props.fillColor);
        if (self.props.tooltip) {
          return tooltip.transition().duration(250).style("opacity", 1 / 1e6).each("end", function() {
            return tooltip.style("visibility", "hidden");
          });
        }
      });
      if (this.props.onClick) {
        bar.on("click", (function(_this) {
          return function(d, i) {
            return _this.props.onClick(d, i);
          };
        })(this));
      }
      if (this.props.xAxis) {
        xAxis = d3.svg.axis().scale(d3.scale.linear().range([this.props.width - 1, 0])).orient("bottom");
        return chart.append("g").attr("class", "x axis").attr("fill", this.props.fillColor).attr("transform", "translate(0," + this.props.height + ")").call(xAxis);
      }
    };
  
    return MultiBarChart;
  
  })(React.Component);
  
  MultiBarChart.defaultProps = {
    width: 100,
    height: 16,
    xAxis: false,
    fillColor: 'black',
    bgColor: 'white',
    data: [7, 1, 5, 5, 4, 3, 5, 2, 3, 5, 6],
    tooltip: false,
    tipOffset: [0, 0],
    tipTemplate: function(d, i) {
      return "Value: " + d + ", index: " + i;
    }
  };
  
  module.exports = MultiBarChart;
  