frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Make links a bigger target

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
public/red/ui/view.js
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 }));
link.enter().insert("svg:path",".node").attr("class","link")
.on("mousedown",function(d) {
mousedown_link = d;
clearSelection();
selected_link = mousedown_link;
updateSelection();
redraw();
d3.event.stopPropagation();
})
.on("touchstart",function(d) {
mousedown_link = d;
clearSelection();
selected_link = mousedown_link;
updateSelection();
redraw();
d3.event.stopPropagation();
});
var linkEnter = link.enter().insert("g",".node").attr("class","link");
linkEnter.each(function(d,i) {
var l = d3.select(this);
l.append("svg:path").attr("class","link_background link_path")
.on("mousedown",function(d) {
mousedown_link = d;
clearSelection();
selected_link = mousedown_link;
updateSelection();
redraw();
d3.event.stopPropagation();
})
.on("touchstart",function(d) {
mousedown_link = d;
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.attr("d",function(d){
var links = vis.selectAll(".link_path")
links.attr("d",function(d){
var numOutputs = d.source.outputs || 1;
var sourcePort = d.sourcePort || 0;
var y = -((numOutputs-1)/2)*13 +13*sourcePort;

22
public/style.css
View File

@ -465,21 +465,37 @@ a.brand img {
fill: none;
}
.link {
.link_line {
stroke: #7f7f7f;
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;
fill: none;
}
.link_selected {
g.link_selected path.link_line {
stroke: #ff7f0e;
}
.link_unknown {
g.link_unknown path.link_line {
stroke: #f00;
stroke-width: 2;
stroke-dasharray: 10, 4;
}
#shade {
position: absolute;
top:0;