tabPageController.coffee

          queries = SearchInfo.db({name: {'!is': ''}, lda_vector: {isNull: false}}).get()
          console.log queries

          graph = {nodes: [], links: []}
          i = 0
          _.each queries, (query) ->
            graph.nodes.push {name: query.name, group: i++, info: query, size: PageInfo.db({query: query.name}).get().length}

          dot = (v1, v2) ->
            v = _.map _.zip(v1, v2), (xy) -> xy[0] * xy[1]
            v = _.reduce v, (x, y) -> x + y
            v

          mag = (v) ->
            v = _.map v, (x) -> x*x
            out = _.reduce v, (x, y) -> x + y
            Math.sqrt(out)
            
          cosine = (v1, v2) ->
            dot(v1, v2) / (mag(v1) * mag(v2))

          _.each graph.nodes, (node1) ->
            _.each graph.nodes, (node2) ->
              if node2.group > node1.group
                similarity = cosine(node1.info.lda_vector, node2.info.lda_vector)
                graph.links.push {source: node1.group, target: node2.group, value: similarity}

          console.log 'blah0'
          console.log graph
          console.log 'blah1'
          width = 960
          height = 800
          color = d3.scale.category20()

          console.log 'blah2'
          force = d3.layout.force()
              .charge(1000)
              .friction(0.01)
              .linkDistance (l) -> Math.pow(1.0 - l.value, 1) * 500
              .size([width, height])

          svg = d3.select("#graph").append("svg")
              .attr("width", width)
              .attr("height", height)

          force.nodes(graph.nodes)
              .links(graph.links)
              .on("tick", () ->
                link.attr("x1", (d) -> d.source.x)
                    .attr("y1", (d) -> d.source.y)
                    .attr("x2", (d) -> d.target.x)
                    .attr("y2", (d) -> d.target.y)

                node.attr("cx", (d) -> d.x )
                    .attr("cy", (d) -> d.y )

                text.attr("transform", (d) ->
                  "translate(" + (d.x + (2.5*d.size) + 5) + "," + (d.y + 3) + ")"
                )
                pin.attr("transform", (d) ->
                  "translate(" + (d.x) + "," + (d.y) + ")"
                )
            )

          wasDragging = false
          drag = force.drag()
            .on("drag", (d) ->
              console.log 'onDrag'
              if (d3.event.sourceEvent.shiftKey)
                d3.select(this).classed("fixed", d.fixed = true)
              wasDragging = true
            )
            .on("dragend", (d) ->
              console.log 'onDragEnd'
              if (wasDragging and !d3.event.sourceEvent.shiftKey)
                d3.select(this).classed("fixed", d.fixed = false)
              wasDragging = false
              render()
            )

          node = svg.selectAll(".node")
          link = svg.selectAll(".link")
          text = svg.selectAll("text.label")
          pin = svg.selectAll(".pin")

          render = () ->

            console.log 'render'
            console.log graph.nodes
            console.log 'render'

            link = link.data(graph.links)
            link.enter().append("line")
                .attr("class", "link")
                .style("stroke-width", (d) -> 
                  if d.value > 0.2
                    Math.pow(d.value, 2) * 3 
                  else
                    0
                )

            node = node.data(graph.nodes)
            node.enter().append("circle")
                .attr("class", "node")
                .attr("r", (d) -> 2.5 * d.size)
                .style("fill", (d) -> color(d.group) )
                .call(drag)
                .on('click', (d) ->
                  console.log 'onClick'
                  if (d3.event.defaultPrevented)
                    console.log 'onClick no'
                    return
       
                  if (!d3.event.shiftKey)
                    was_selected = d.selected
                    node.classed("selected", (p) -> p.selected =  p.previouslySelected = false)
                    d3.select(this).classed("selected", d.selected = !was_selected)
                  else
                    was_selected = d.selected
                    d3.select(this).classed("selected", d.selected = !d.previouslySelected)
                    d3.select(this).classed("selected", d.selected = !was_selected)
                )

            text = text.data(graph.nodes)
            text.enter().append("text")
                  .attr("class", "label")
                  .attr("fill", (d) -> color(d.group))
                  .attr('stroke', 'lightgray')
                  .attr('stroke-width', 0.5)
                  .text((d) -> d.name)

            pin = pin.data(graph.nodes)
            pin.enter().append("circle")
                .attr("class", "pin")
                .attr("r", (d) ->
                  if d.fixed
                    return 3
                  return 0
                )
                .style("fill", 'black')

          render()
          force.start()