Make links a bigger target

This commit is contained in:
Nick O'Leary 2014-05-15 22:44:07 +01:00
parent 525321ec7f
commit 863ceb065a
2 changed files with 45 additions and 21 deletions

View File

@ -1188,27 +1188,35 @@ RED.view = function() {
var link = vis.selectAll(".link").data(RED.nodes.links.filter(function(d) { return d.source.z == activeWorkspace && d.target.z == activeWorkspace })); var link = vis.selectAll(".link").data(RED.nodes.links.filter(function(d) { return d.source.z == activeWorkspace && d.target.z == activeWorkspace }));
link.enter().insert("svg:path",".node").attr("class","link") var linkEnter = link.enter().insert("g",".node").attr("class","link");
.on("mousedown",function(d) {
mousedown_link = d; linkEnter.each(function(d,i) {
clearSelection(); var l = d3.select(this);
selected_link = mousedown_link; l.append("svg:path").attr("class","link_background link_path")
updateSelection(); .on("mousedown",function(d) {
redraw(); mousedown_link = d;
d3.event.stopPropagation(); clearSelection();
}) selected_link = mousedown_link;
.on("touchstart",function(d) { updateSelection();
mousedown_link = d; redraw();
clearSelection(); d3.event.stopPropagation();
selected_link = mousedown_link; })
updateSelection(); .on("touchstart",function(d) {
redraw(); mousedown_link = d;
d3.event.stopPropagation(); clearSelection();
}); selected_link = mousedown_link;
updateSelection();
redraw();
d3.event.stopPropagation();
});
l.append("svg:path").attr("class","link_outline link_path");
l.append("svg:path").attr("class","link_line link_path");
});
link.exit().remove(); link.exit().remove();
link.attr("d",function(d){ var links = vis.selectAll(".link_path")
links.attr("d",function(d){
var numOutputs = d.source.outputs || 1; var numOutputs = d.source.outputs || 1;
var sourcePort = d.sourcePort || 0; var sourcePort = d.sourcePort || 0;
var y = -((numOutputs-1)/2)*13 +13*sourcePort; var y = -((numOutputs-1)/2)*13 +13*sourcePort;

View File

@ -465,21 +465,37 @@ a.brand img {
fill: none; fill: none;
} }
.link { .link_line {
stroke: #7f7f7f; stroke: #7f7f7f;
stroke-width: 4; stroke-width: 4;
fill: none;
pointer-events: none;
}
.link_outline {
stroke: #fff;
stroke-width: 6;
cursor: crosshair;
fill: none;
pointer-events: none;
}
.link_background {
stroke: #fff;
opacity: 0;
stroke-width: 25;
cursor: crosshair; cursor: crosshair;
fill: none; fill: none;
} }
.link_selected { g.link_selected path.link_line {
stroke: #ff7f0e; stroke: #ff7f0e;
} }
.link_unknown { g.link_unknown path.link_line {
stroke: #f00; stroke: #f00;
stroke-width: 2; stroke-width: 2;
stroke-dasharray: 10, 4; stroke-dasharray: 10, 4;
} }
#shade { #shade {
position: absolute; position: absolute;
top:0; top:0;