1. Udi Bauman
  2. model

Source

model / model_app / views.coffee

class ClassView extends Backbone.View
  current_offset: 0
  default_class_width: 150
  default_member_height: 20
  default_member_spacing: 20

  initialize: =>
    unless @svg
      w = 675
      h = 360
      pack = d3.layout.pack()
        .size([ w - 4, h - 4 ])
        .value((d) -> d.size)
      @svg = d3.select("#chart")
        .append("svg")
        .attr("width", w)
        .attr("height", h)
        .attr("class", "pack")
        .append("g")
        .attr("transform", "translate(2, 2)")


  render: =>
    data = @model.get_all_members()
    x = @current_offset
    y = 50
    margin = 10
    @el = @svg.append("g")
      .attr("x", x)
      .attr("y", y)

    @el.append("rect")
      .attr("x", x)
      .attr("y", y)
      .attr("width", @default_class_width)
      .attr("height", data.length * @default_member_height)
    @el.selectAll("text")
      .data(data)
      .enter()
      .append("text")
      .attr("x", x + margin)
      .attr("y", (d, i) => y + margin + i * @default_member_height)
      .attr("dy", ".35em")
      .text String
    @el.append("line")
      .attr("x1", x)
      .attr("y1", y + @default_member_height)
      .attr("x2", x + @default_class_width)
      .attr("y2", y + @default_member_height)
    @current_offset += @default_class_width + @default_member_spacing


class ClassDiagramView extends Backbone.View
  svg: null
  current_offset: 0
  default_class_width: 150
  default_member_height: 20
  default_member_spacing: 20
  class_containers: {}

  initialize: =>
    @render()
    current_diagram.on "add", @add_class

  render: =>
    w = 675
    h = 360
    pack = d3.layout.pack()
    .size([ w - 4, h - 4 ])
    .value((d) -> d.size)
    @svg = d3.select("#chart")
    .append("svg")
    .attr("width", w)
    .attr("height", h)
    .attr("class", "pack")
    .append("g")
    .attr("transform", "translate(2, 2)")

  add_class: (model) =>
    data = model.get_all_members()
    x = @current_offset
    y = 50
    margin = 10
    g = @svg.append("g")
      .attr("x", x)
      .attr("y", y)
    @class_containers[model.get("name")] = g
    g.append("rect")
      .attr("x", x)
      .attr("y", y)
      .attr("width", @default_class_width)
      .attr("height", data.length * @default_member_height)
    g.selectAll("text")
      .data(data)
      .enter()
      .append("text")
      .attr("x", x + margin)
      .attr("y", (d, i) => y + margin + i * @default_member_height)
      .attr("dy", ".35em")
      .text(String)
    g.append("line")
      .attr("x1", x)
      .attr("y1", y + @default_member_height)
      .attr("x2", x + @default_class_width)
      .attr("y2", y + @default_member_height)
    @current_offset += @default_class_width + @default_member_spacing


view = new ClassDiagramView