d3.js svg path drawing not allowed

Question

Hy i have this code: https://jsfiddle.net/fa765d2o/1/

(Sorry for the js part i had to paste in the dagre-d3 plugin, didnt knew any other way to make it work)

So i use d3.js and dagre-d3 to create an organizational chart, which works. I'm working on adding a functionality to create new relations.

This works by clicking on one of the nodes and dragging to another node and releasing the mouse it will connect the two nodes and refresh the graph.

The problem is that after the first time the second time it wont work, so if i connect "Drone-3" to "Drone-7" it will work but after that if i want to connect "Drone-3" to anyone else it wont let me and i get the "not-allowed" cursor.

This is basically the important part of the code... where the magic happens :)

d3.selectAll('svg g.node')
.on('mousedown', function(d) {
    console.log(d);
    // Prevent svg canvas movement
    d3.event.stopPropagation();

    // Define node position
    mousedown_node = d;
    md_node = g.node(d);
    md_node_x = md_node.x;
    md_node_y = md_node.y;

    drag_line.style('marker-end', 'url(#end-arrow)');        
})
.on('mouseover', function(d) {

    // Source and target node the same
    if(!mousedown_node || d === mousedown_node)
    {

    }
    else // Source and target node different
    {
        // Show hover state
        d3.select(this).classed('node-connect-hover', true);
    }        

})
.on('mouseout', function(d) {        
    // Remove hover state
    d3.select(this).classed('node-connect-hover', false);
})
.on('mouseup', function(d) {        
    // Do nothing if the source and target node is the same
    if(!mousedown_node || d === mousedown_node) return;

    // Set up realation 
    g.setEdge(mousedown_node, d);

    // Refresh the graph
    render(container, g);        
});


/**
 * Draw the path on mouse movement
 */
function mousemove() {

    if(!mousedown_node) return;

    var xn = translateXY[0] + md_node_x * d3Scale,
        yn = translateXY[1] + md_node_y * d3Scale;

    drag_line.classed('hidden', false)
             .attr('d', 'M' + xn + ',' + yn + 'L' + d3.mouse(this)[0] + ',' +  d3.mouse(this)[1]);
}

/**
 * Hide the path on mouse up
 */
function mouseup() {

    if(mousedown_node)
    {      
      // hide drag line
      drag_line.classed('hidden', true)
               .style('marker-end', '');
    }

    // because :active only works in WebKit?
    svg.classed('active', false);

    // clear mouse event vars
    resetMouseVars();
}


/**
 * Attach event listeners to the svg
 */
svg.on('mousemove', mousemove)
   .on('mouseup', mouseup);