// Generated by CoffeeScript 1.7.1
var WSF_BARCHART_CONTROL,
  __hasProp = {}.hasOwnProperty,
  __extends = 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; };

WSF_BARCHART_CONTROL = (function(_super) {
  __extends(WSF_BARCHART_CONTROL, _super);

  function WSF_BARCHART_CONTROL() {
    return WSF_BARCHART_CONTROL.__super__.constructor.apply(this, arguments);
  }

  WSF_BARCHART_CONTROL.prototype.requirements = ['/assets/d3.min.js', '/assets/graph.css'];

  WSF_BARCHART_CONTROL.prototype.attach_events = function() {
    var height, margin, svg, width, x, y;
    WSF_BARCHART_CONTROL.__super__.attach_events.apply(this, arguments);
    margin = {
      top: 20,
      right: 20,
      bottom: 30,
      left: 40
    };
    this.$el.html("");
    width = this.$el.width() - margin.left - margin.right;
    height = 500 - margin.top - margin.bottom;
    x = d3.scale.ordinal().rangeRoundBands([0, width], .1);
    y = d3.scale.linear().range([height, 0]);
    this.xAxis = d3.svg.axis().scale(x).orient("bottom");
    this.yAxis = d3.svg.axis().scale(y).orient("left").ticks(10);
    svg = d3.select(this.$el[0]).append("svg").attr("width", width + margin.left + margin.right).attr("height", height + margin.top + margin.bottom).append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");
    this.x = x;
    this.y = y;
    this.svg = svg;
    this.height = height;
    this.xAxis_container = svg.append("g").attr("class", "x axis").attr("transform", "translate(0," + height + ")");
    this.yAxis_container = svg.append("g").attr("class", "y axis");
    return this.updatechart();
  };

  WSF_BARCHART_CONTROL.prototype.updatechart = function() {
    var data, height, rect, x, y;
    height = this.height;
    data = this.state.data;
    x = this.x;
    y = this.y;
    x.domain(data.map(function(d) {
      return d.key;
    }));
    y.domain([
      0, d3.max(data, function(d) {
        return d.value;
      })
    ]);
    this.xAxis_container.transition().duration(1000).call(this.xAxis);
    this.yAxis_container.transition().duration(1000).call(this.yAxis);
    rect = this.svg.selectAll(".bar").data(data, function(d) {
      return d.key;
    });
    rect.enter().insert("rect").attr("class", "bar").attr("x", function(d) {
      return x(d.key);
    }).attr("width", x.rangeBand()).attr("y", function(d) {
      return height;
    }).attr("height", function(d) {
      return 0;
    });
    rect.transition().duration(1000).attr("x", function(d) {
      return x(d.key);
    }).attr("width", x.rangeBand()).attr("y", function(d) {
      return y(d.value);
    }).attr("height", function(d) {
      return height - y(d.value);
    });
    return rect.exit().transition().duration(1000).style('opacity', 0).attr("height", function(d) {
      return 0;
    }).attr("y", function(d) {
      return height;
    }).remove();
  };

  WSF_BARCHART_CONTROL.prototype.update = function(state) {
    var data;
    if (state.data !== void 0) {
      this.state['data'] = state.data;
      data = state.data;
      return this.updatechart();
    }
  };

  return WSF_BARCHART_CONTROL;

})(WSF_CONTROL);
