   createD3Elements: ->
     @tree = d3.layout.tree().size([@width, @height-20])
                             .nodeSize([100, 70])
+    @diagonal = d3.svg.diagonal().projection((d) =>
+      [ d.x, @height - d.y ]
+    )
 
   setZoom: ->
     @zoom = d3.behavior.zoom().scaleExtent([0.0001,3])


    @neurons = @tree.nodes(@rootNeuron)
    @shownNeurons = @neurons

    @drawLinks()
    @drawNeurons()
    @drawWithoutParent()

  drawNeurons: ->
    self = this
    neuron = @svg.selectAll("g.node")
                  .data(@shownNeurons)
                  .enter()
                  .append("g")
                  .attr("class", "node")
                  .attr("transform", (d) =>
                    "translate(#{d.x}, #{ @height - d.y})"
                  )
    neuron.append("circle")
          .attr("r", 4.5)
          .style("stroke", (d) ->
            if d.deleted then "#ec5747"
          ).style("fill", (d) ->
            if d._children then "lightsteelblue" else "#fff"
          ).on "click", (node) =>
            @toggleNode(node)

    neuron.append('text')
          .attr('dx', -8)
          .attr('dy', 3)
          .attr('text-anchor', "end")
          .text((d) ->
            d.title
          ).on("mouseenter", (node) ->
            self.showDetails(node, this)
          ).on("click", @showNeuron)

  showNeuron: (neuron) =>
    window.location.pathname = "/admin/neurons/#{neuron.id}"

  drawLinks: ->
    # re-calculate tree position
    @tree.nodes(@rootNeuron)

    links = @tree.links(@shownNeurons)
    diagonal = d3.svg.diagonal().projection((d) =>
      [ d.x, @height - d.y ]
    )
    link = @svg.selectAll("path.link")
                .data(links)
                .enter()
                .append("path")
                .attr("class", "link")
                .attr("d", diagonal)

  drawWithoutParent: ->
    self = this

              .append("svg")
              .attr("width", @width)
              .attr("height", @height)
              .style("overflow", "scroll")
              .append('g')
              .attr("class","drawarea")
              .attr("transform", "translate(#{@width / 2},-30)")
    d3.select('svg').call @zoom


