mirror of https://github.com/node-red/node-red.git
Add 'add' option to touch radialMenu for quick-add dialog
This commit is contained in:
Nick O'Leary
parent
cb218a57f1
commit
091a462a42
|
|
@ -241,10 +241,13 @@ RED.typeSearch = (function() {
|
|||
$(document).off('mousedown.red-ui-type-search');
|
||||
$(document).off('mouseup.red-ui-type-search');
|
||||
$(document).off('click.red-ui-type-search');
|
||||
$(document).off('touchstart.red-ui-type-search');
|
||||
$(document).off('mousedown.red-ui-type-search');
|
||||
setTimeout(function() {
|
||||
$(document).on('mousedown.red-ui-type-search',handleMouseActivity);
|
||||
$(document).on('mouseup.red-ui-type-search',handleMouseActivity);
|
||||
$(document).on('click.red-ui-type-search',handleMouseActivity);
|
||||
$(document).on('touchstart.red-ui-type-search',handleMouseActivity);
|
||||
},200);
|
||||
|
||||
refreshTypeList(opts);
|
||||
|
|
@ -260,7 +263,9 @@ RED.typeSearch = (function() {
|
|||
searchResultsDiv.slideDown(300);
|
||||
setTimeout(function() {
|
||||
searchResultsDiv.find(".red-ui-editableList-container").scrollTop(0);
|
||||
searchInput.trigger("focus");
|
||||
if (!opts.disableFocus) {
|
||||
searchInput.trigger("focus");
|
||||
}
|
||||
},100);
|
||||
}
|
||||
function hide(fast) {
|
||||
|
|
@ -279,6 +284,7 @@ RED.typeSearch = (function() {
|
|||
$(document).off('mousedown.red-ui-type-search');
|
||||
$(document).off('mouseup.red-ui-type-search');
|
||||
$(document).off('click.red-ui-type-search');
|
||||
$(document).off('touchstart.red-ui-type-search');
|
||||
}
|
||||
}
|
||||
function getTypeLabel(type, def) {
|
||||
|
|
|
|||
|
|
@ -29,7 +29,6 @@
|
|||
*/
|
||||
|
||||
RED.view = (function() {
|
||||
var DEBUG_EVENTS = false;
|
||||
var space_width = 5000,
|
||||
space_height = 5000,
|
||||
lineCurveScale = 0.75,
|
||||
|
|
@ -152,6 +151,7 @@ RED.view = (function() {
|
|||
}
|
||||
})
|
||||
.on("touchend", function() {
|
||||
d3.event.preventDefault();
|
||||
clearTimeout(touchStartTime);
|
||||
touchStartTime = null;
|
||||
if (RED.touch.radialMenu.active()) {
|
||||
|
|
@ -159,7 +159,7 @@ RED.view = (function() {
|
|||
}
|
||||
canvasMouseUp.call(this);
|
||||
})
|
||||
.on("touchcancel", canvasMouseUp)
|
||||
.on("touchcancel", function() { d3.event.preventDefault(); canvasMouseUp.call(this); })
|
||||
.on("touchstart", function() {
|
||||
var touch0;
|
||||
if (d3.event.touches.length>1) {
|
||||
|
|
@ -204,6 +204,7 @@ RED.view = (function() {
|
|||
// .attr("class","nr-ui-view-lasso");
|
||||
},touchLongPressTimeout);
|
||||
}
|
||||
d3.event.preventDefault();
|
||||
})
|
||||
.on("touchmove", function(){
|
||||
if (RED.touch.radialMenu.active()) {
|
||||
|
|
@ -255,6 +256,7 @@ RED.view = (function() {
|
|||
redraw();
|
||||
}
|
||||
}
|
||||
d3.event.preventDefault();
|
||||
});
|
||||
|
||||
// Workspace Background
|
||||
|
|
@ -756,7 +758,7 @@ RED.view = (function() {
|
|||
}
|
||||
|
||||
function canvasMouseDown() {
|
||||
if (DEBUG_EVENTS) { console.warn("canvasMouseDown", mouse_mode); }
|
||||
if (RED.view.DEBUG) { console.warn("canvasMouseDown", mouse_mode); }
|
||||
var point;
|
||||
if (mouse_mode === RED.state.SELECTING_NODE) {
|
||||
d3.event.stopPropagation();
|
||||
|
|
@ -810,7 +812,7 @@ if (DEBUG_EVENTS) { console.warn("canvasMouseDown", mouse_mode); }
|
|||
}
|
||||
}
|
||||
|
||||
function showQuickAddDialog(point, spliceLink, targetGroup) {
|
||||
function showQuickAddDialog(point, spliceLink, targetGroup, touchTrigger) {
|
||||
if (targetGroup && !targetGroup.active) {
|
||||
selectGroup(targetGroup,false);
|
||||
enterActiveGroup(targetGroup);
|
||||
|
|
@ -899,6 +901,7 @@ if (DEBUG_EVENTS) { console.warn("canvasMouseDown", mouse_mode); }
|
|||
RED.typeSearch.show({
|
||||
x:d3.event.clientX-mainPos.left-node_width/2 - (ox-point[0]),
|
||||
y:d3.event.clientY-mainPos.top+ node_height/2 + 5 - (oy-point[1]),
|
||||
disableFocus: touchTrigger,
|
||||
filter: filter,
|
||||
move: function(dx,dy) {
|
||||
if (ghostNode) {
|
||||
|
|
@ -926,6 +929,10 @@ if (DEBUG_EVENTS) { console.warn("canvasMouseDown", mouse_mode); }
|
|||
redraw();
|
||||
},
|
||||
add: function(type,keepAdding) {
|
||||
if (touchTrigger) {
|
||||
keepAdding = false;
|
||||
resetMouseVars();
|
||||
}
|
||||
var result = addNode(type);
|
||||
if (!result) {
|
||||
return;
|
||||
|
|
@ -1450,7 +1457,7 @@ if (DEBUG_EVENTS) { console.warn("canvasMouseDown", mouse_mode); }
|
|||
}
|
||||
|
||||
function canvasMouseUp() {
|
||||
if (DEBUG_EVENTS) { console.warn("canvasMouseUp", mouse_mode); }
|
||||
if (RED.view.DEBUG) { console.warn("canvasMouseUp", mouse_mode); }
|
||||
var i;
|
||||
var historyEvent;
|
||||
if (mouse_mode === RED.state.PANNING) {
|
||||
|
|
@ -1744,7 +1751,7 @@ if (DEBUG_EVENTS) { console.warn("canvasMouseUp", mouse_mode); }
|
|||
}
|
||||
|
||||
function clearSelection() {
|
||||
if (DEBUG_EVENTS) { console.warn("clearSelection", mouse_mode); }
|
||||
if (RED.view.DEBUG) { console.warn("clearSelection", mouse_mode); }
|
||||
for (var i=0;i<moving_set.length;i++) {
|
||||
var n = moving_set[i];
|
||||
n.n.dirty = true;
|
||||
|
|
@ -2252,7 +2259,7 @@ if (DEBUG_EVENTS) { console.warn("clearSelection", mouse_mode); }
|
|||
}
|
||||
|
||||
function portMouseDown(d,portType,portIndex) {
|
||||
if (DEBUG_EVENTS) { console.warn("portMouseDown", mouse_mode,d); }
|
||||
if (RED.view.DEBUG) { console.warn("portMouseDown", mouse_mode,d); }
|
||||
//console.log(d,portType,portIndex);
|
||||
// disable zoom
|
||||
//eventLayer.call(d3.behavior.zoom().on("zoom"), null);
|
||||
|
|
@ -2280,7 +2287,7 @@ if (DEBUG_EVENTS) { console.warn("portMouseDown", mouse_mode,d); }
|
|||
}
|
||||
|
||||
function portMouseUp(d,portType,portIndex) {
|
||||
if (DEBUG_EVENTS) { console.warn("portMouseUp", mouse_mode,d); }
|
||||
if (RED.view.DEBUG) { console.warn("portMouseUp", mouse_mode,d); }
|
||||
if (mouse_mode === RED.state.SELECTING_NODE) {
|
||||
d3.event.stopPropagation();
|
||||
return;
|
||||
|
|
@ -2621,7 +2628,7 @@ if (DEBUG_EVENTS) { console.warn("portMouseUp", mouse_mode,d); }
|
|||
}
|
||||
|
||||
function nodeMouseUp(d) {
|
||||
if (DEBUG_EVENTS) { console.warn("nodeMouseUp", mouse_mode,d); }
|
||||
if (RED.view.DEBUG) { console.warn("nodeMouseUp", mouse_mode,d); }
|
||||
if (mouse_mode === RED.state.SELECTING_NODE) {
|
||||
d3.event.stopPropagation();
|
||||
return;
|
||||
|
|
@ -2696,7 +2703,7 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseUp", mouse_mode,d); }
|
|||
}
|
||||
|
||||
function nodeMouseDown(d) {
|
||||
if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
||||
if (RED.view.DEBUG) { console.warn("nodeMouseDown", mouse_mode,d); }
|
||||
focusView();
|
||||
if (d3.event.button === 1) {
|
||||
return;
|
||||
|
|
@ -3123,6 +3130,10 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
options.push({name:"edit",disabled:(moving_set.length != 1),onselect:function() { RED.editor.edit(mdn);}});
|
||||
options.push({name:"select",onselect:function() {selectAll();}});
|
||||
options.push({name:"undo",disabled:(RED.history.depth() === 0),onselect:function() {RED.history.pop();}});
|
||||
options.push({name:"add",onselect:function() {
|
||||
chartPos = chart.offset();
|
||||
showQuickAddDialog([pos[0]-chartPos.left+chart.scrollLeft(),pos[1]-chartPos.top+chart.scrollTop()],undefined,undefined,true)
|
||||
}});
|
||||
|
||||
RED.touch.radialMenu.show(obj,pos,options);
|
||||
resetMouseVars();
|
||||
|
|
@ -3216,6 +3227,7 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
showTouchMenu(obj,pos);
|
||||
},touchLongPressTimeout);
|
||||
nodeMouseDown.call(this,d)
|
||||
d3.event.preventDefault();
|
||||
})
|
||||
.on("touchend", function(d) {
|
||||
clearTimeout(touchStartTime);
|
||||
|
|
@ -3225,13 +3237,14 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
return;
|
||||
}
|
||||
nodeMouseUp.call(this,d);
|
||||
d3.event.preventDefault();
|
||||
});
|
||||
|
||||
outGroup.append("g").attr('transform','translate(-5,15)').append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10)
|
||||
.on("mousedown", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
|
||||
.on("mouseup", function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);})
|
||||
.on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
|
||||
.on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
|
||||
.on("mouseout",function(d){portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
|
||||
|
||||
|
|
@ -3259,6 +3272,7 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
showTouchMenu(obj,pos);
|
||||
},touchLongPressTimeout);
|
||||
nodeMouseDown.call(this,d)
|
||||
d3.event.preventDefault();
|
||||
})
|
||||
.on("touchend", function(d) {
|
||||
clearTimeout(touchStartTime);
|
||||
|
|
@ -3268,13 +3282,14 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
return;
|
||||
}
|
||||
nodeMouseUp.call(this,d);
|
||||
d3.event.preventDefault();
|
||||
});
|
||||
|
||||
inGroup.append("g").attr('transform','translate(35,15)').append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10)
|
||||
.on("mousedown", function(d,i){portMouseDown(d,PORT_TYPE_OUTPUT,i);} )
|
||||
.on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_OUTPUT,i);} )
|
||||
.on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_OUTPUT,i);d3.event.preventDefault();} )
|
||||
.on("mouseup", function(d,i){portMouseUp(d,PORT_TYPE_OUTPUT,i);})
|
||||
.on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_OUTPUT,i);} )
|
||||
.on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_OUTPUT,i);d3.event.preventDefault();} )
|
||||
.on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_OUTPUT,0);})
|
||||
.on("mouseout",function(d) {portMouseOut(d3.select(this),d,PORT_TYPE_OUTPUT,0);});
|
||||
|
||||
|
|
@ -3302,8 +3317,10 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
showTouchMenu(obj,pos);
|
||||
},touchLongPressTimeout);
|
||||
nodeMouseDown.call(this,d)
|
||||
d3.event.preventDefault();
|
||||
})
|
||||
.on("touchend", function(d) {
|
||||
d3.event.preventDefault();
|
||||
clearTimeout(touchStartTime);
|
||||
touchStartTime = null;
|
||||
if (RED.touch.radialMenu.active()) {
|
||||
|
|
@ -3315,9 +3332,9 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
|
||||
statusGroup.append("g").attr('transform','translate(-5,15)').append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10)
|
||||
.on("mousedown", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
|
||||
.on("mouseup", function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);})
|
||||
.on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
|
||||
.on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
|
||||
.on("mouseout",function(d){portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
|
||||
|
||||
|
|
@ -3426,7 +3443,7 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
d3.select(this).attr("fill-opacity",op);
|
||||
}})
|
||||
.on("click",nodeButtonClicked)
|
||||
.on("touchstart",nodeButtonClicked)
|
||||
.on("touchstart",function(d) { nodeButtonClicked.call(this,d); d3.event.preventDefault();})
|
||||
}
|
||||
|
||||
var mainRect = node.append("rect")
|
||||
|
|
@ -3447,8 +3464,10 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
showTouchMenu(obj,pos);
|
||||
},touchLongPressTimeout);
|
||||
nodeMouseDown.call(this,d)
|
||||
d3.event.preventDefault();
|
||||
})
|
||||
.on("touchend", function(d) {
|
||||
d3.event.preventDefault();
|
||||
clearTimeout(touchStartTime);
|
||||
touchStartTime = null;
|
||||
if (RED.touch.radialMenu.active()) {
|
||||
|
|
@ -3750,9 +3769,9 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
inputGroupPorts = inputGroup.append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10)
|
||||
}
|
||||
inputGroupPorts.on("mousedown",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);})
|
||||
.on("touchstart",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);})
|
||||
.on("touchstart",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();})
|
||||
.on("mouseup",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchend",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);} )
|
||||
.on("touchend",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
|
||||
.on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
|
||||
.on("mouseout",function(d) {portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
|
||||
}
|
||||
|
|
@ -3787,9 +3806,9 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
}
|
||||
|
||||
output_group_ports.on("mousedown",(function(){var node = d; return function(d,i){portMouseDown(node,PORT_TYPE_OUTPUT,i);}})() )
|
||||
.on("touchstart",(function(){var node = d; return function(d,i){portMouseDown(node,PORT_TYPE_OUTPUT,i);}})() )
|
||||
.on("touchstart",(function(){var node = d; return function(d,i){portMouseDown(node,PORT_TYPE_OUTPUT,i);d3.event.preventDefault();}})() )
|
||||
.on("mouseup",(function(){var node = d; return function(d,i){portMouseUp(node,PORT_TYPE_OUTPUT,i);}})() )
|
||||
.on("touchend",(function(){var node = d; return function(d,i){portMouseUp(node,PORT_TYPE_OUTPUT,i);}})() )
|
||||
.on("touchend",(function(){var node = d; return function(d,i){portMouseUp(node,PORT_TYPE_OUTPUT,i);d3.event.preventDefault();}})() )
|
||||
.on("mouseover",(function(){var node = d; return function(d,i){portMouseOver(d3.select(this),node,PORT_TYPE_OUTPUT,i);}})())
|
||||
.on("mouseout",(function(){var node = d; return function(d,i) {portMouseOut(d3.select(this),node,PORT_TYPE_OUTPUT,i);}})());
|
||||
|
||||
|
|
@ -3975,6 +3994,7 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
|
|||
touchStartTime = null;
|
||||
showTouchMenu(obj,pos);
|
||||
},touchLongPressTimeout);
|
||||
d3.event.preventDefault();
|
||||
})
|
||||
l.append("svg:path").attr("class","red-ui-flow-link-outline red-ui-flow-link-path");
|
||||
l.append("svg:path").attr("class","red-ui-flow-link-line red-ui-flow-link-path")
|
||||
|
|
|
|||
Loading…
Reference in New Issue