// Generated by CoffeeScript 1.10.0
(function() {
  var MARGIN;

  MARGIN = 4;

  window.Matrix = Backbone.D3View.extend({
    tagName: 'svg',
    events: {
      'click .cell': function(evt, d) {
        return this.model.select(d.id);
      }
    },
    initialize: function() {
      this.d3el.classed('matrix', true);
      this.vis = this.d3el.append('g').attr({
        transform: "translate(" + MARGIN + "," + MARGIN + ")"
      });
      this.listenTo(this.model, 'change:graph', this.render);
      return this.listenTo(this.model, 'change:selected', this.focus);
    },
    render: function() {
      var cell_size, cells, enter_cells, enter_mirror_cells, graph, height, mirror_cells, size, width;
      width = this.el.getBoundingClientRect().width;
      height = this.el.getBoundingClientRect().height;
      size = Math.min(width, height) - 2 * MARGIN;
      graph = this.model.get('graph');
      graph.nodes.forEach(function(d, i) {
        return d.i = i;
      });
      cell_size = size / graph.nodes.length;
      cells = this.vis.selectAll('.cell').data(graph.links, function(d) {
        return d.id;
      });
      enter_cells = cells.enter().append('rect').attr({
        "class": 'cell'
      });
      enter_cells.append('title').text(function(d) {
        return d.id;
      });
      cells.attr({
        x: function(d) {
          return d.target.i * cell_size;
        },
        y: function(d) {
          return d.source.i * cell_size;
        },
        width: cell_size,
        height: cell_size,
        fill: function(d) {
          if (d.directed) {
            return 'orange';
          } else {
            return 'teal';
          }
        }
      });
      cells.exit().remove();
      mirror_cells = this.vis.selectAll('.mirror').data(graph.links.filter(function(d) {
        return !d.directed;
      }), function(d) {
        return 'mirror_' + d.id;
      });
      enter_mirror_cells = mirror_cells.enter().append('rect').attr({
        "class": 'mirror cell'
      });
      enter_mirror_cells.append('title').text(function(d) {
        return d.id;
      });
      mirror_cells.attr({
        x: function(d) {
          return d.source.i * cell_size;
        },
        y: function(d) {
          return d.target.i * cell_size;
        },
        width: cell_size,
        height: cell_size,
        fill: function(d) {
          return 'teal';
        }
      });
      return mirror_cells.exit().remove();
    },
    focus: function() {
      var id;
      id = this.model.get('selected');
      return this.vis.selectAll('.cell').classed('selected', function(d) {
        return d.id === id;
      }).classed('unselected', function(d) {
        if (id === null) {
          return null;
        } else {
          return d.id !== id;
        }
      });
    }
  });

}).call(this);