1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Remove d3 from radialMenu

This commit is contained in:
Nick O'Leary 2022-08-05 23:07:39 +01:00
parent c24d7fafa9
commit 24ff5262d9
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
2 changed files with 22 additions and 38 deletions

View File

@ -27,26 +27,24 @@ RED.touch.radialMenu = (function() {
function createRadial(obj,pos,options) {
isActive = true;
try {
touchMenu = d3.select("body").append("div").classed("red-ui-editor-radial-menu",true)
.on('touchstart',function() {
touchMenu = $('<div>', {class: 'red-ui-editor-radial-menu'}).appendTo('body')
.on('touchstart',function(evt) {
hide();
d3.event.preventDefault();
evt.preventDefault();
});
var menu = touchMenu.append("div")
.style({
var menu = $('<div>').appendTo(touchMenu).css({
top: (pos[1]-80)+"px",
left:(pos[0]-80)+"px",
});
var menuOpts = [];
var createMenuOpt = function(x,y,opt) {
opt.el = menu.append("div").classed("red-ui-editor-radial-menu-opt",true)
.style({
opt.el = $('<div>', {class: 'red-ui-editor-radial-menu-opt'}).appendTo(menu)
.css({
top: (y+80-25)+"px",
left:(x+80-25)+"px"
})
.classed("red-ui-editor-radial-menu-opt-disabled",!!opt.disabled)
.toggleClass("red-ui-editor-radial-menu-opt-disabled",!!opt.disabled)
opt.el.html(opt.name);
@ -54,16 +52,16 @@ RED.touch.radialMenu = (function() {
opt.y = y;
menuOpts.push(opt);
opt.el.on('touchstart',function() {
opt.el.classed("red-ui-editor-radial-menu-opt-active",true)
d3.event.preventDefault();
d3.event.stopPropagation();
opt.el.on('touchstart',function(evt) {
opt.el.toggleClass("red-ui-editor-radial-menu-opt-active",true)
evt.preventDefault();
evt.stopPropagation();
});
opt.el.on('touchend',function() {
opt.el.on('touchend',function(evt) {
hide();
opt.onselect();
d3.event.preventDefault();
d3.event.stopPropagation();
evt.preventDefault();
evt.stopPropagation();
});
}
@ -88,8 +86,8 @@ RED.touch.radialMenu = (function() {
}
obj.on('touchend.radial',function() {
obj.on('touchend.radial',null);
obj.on('touchmenu.radial',null);
obj.off('touchend.radial');
obj.off('touchmenu.radial');
if (activeOption) {
try {
@ -103,9 +101,9 @@ RED.touch.radialMenu = (function() {
}
});
obj.on('touchmove.radial',function() {
obj.on('touchmove.radial',function(evt) {
try {
var touch0 = d3.event.touches.item(0);
var touch0 = evt.touches.item(0);
var p = [touch0.pageX - pos[0],touch0.pageY-pos[1]];
for (var i=0;i<menuOpts.length;i++) {
var opt = menuOpts[i];
@ -119,7 +117,7 @@ RED.touch.radialMenu = (function() {
if (opt === activeOption) {
activeOption = null;
}
opt.el.classed("selected",false);
opt.el.toggleClass("selected",false);
}
}
}

View File

@ -294,25 +294,13 @@ RED.view = (function() {
]
startTouchDistance = Math.sqrt((a*a)+(b*b));
} else {
var obj = d3.select(document.body);
touch0 = d3.event.touches.item(0);
var pos = [touch0.pageX,touch0.pageY];
startTouchCenter = [touch0.pageX,touch0.pageY];
startTouchDistance = 0;
var point = d3.touches(this)[0];
touchStartTime = setTimeout(function() {
touchStartTime = null;
showTouchMenu(obj,pos);
//lasso = eventLayer.append("rect")
// .attr("ox",point[0])
// .attr("oy",point[1])
// .attr("rx",2)
// .attr("ry",2)
// .attr("x",point[0])
// .attr("y",point[1])
// .attr("width",0)
// .attr("height",0)
// .attr("class","nr-ui-view-lasso");
showTouchMenu(document.body,pos);
},touchLongPressTimeout);
}
d3.event.preventDefault();
@ -3703,13 +3691,12 @@ RED.view = (function() {
}
function nodeTouchStart(d) {
if (RED.view.DEBUG) { console.warn("nodeTouchStart", mouse_mode,d); }
var obj = d3.select(this);
var touch0 = d3.event.touches.item(0);
var pos = [touch0.pageX,touch0.pageY];
startTouchCenter = [touch0.pageX,touch0.pageY];
startTouchDistance = 0;
touchStartTime = setTimeout(function() {
showTouchMenu(obj,pos);
showTouchMenu(this,pos);
},touchLongPressTimeout);
nodeMouseDown.call(this,d)
d3.event.preventDefault();
@ -3868,12 +3855,11 @@ RED.view = (function() {
focusView();
d3.event.stopPropagation();
var obj = d3.select(document.body);
var touch0 = d3.event.touches.item(0);
var pos = [touch0.pageX,touch0.pageY];
touchStartTime = setTimeout(function() {
touchStartTime = null;
showTouchMenu(obj,pos);
showTouchMenu(document.body,pos);
},touchLongPressTimeout);
d3.event.preventDefault();
}