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

Remove d3 from radialMenu

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

40
packages/node_modules/@node-red/editor-client/src/js/ui/touch/radialMenu.js vendored
View File

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

20
packages/node_modules/@node-red/editor-client/src/js/ui/view.js vendored
View File

@ -294,25 +294,13 @@ RED.view = (function() {
] ]
startTouchDistance = Math.sqrt((a*a)+(b*b)); startTouchDistance = Math.sqrt((a*a)+(b*b));
} else { } else {
var obj = d3.select(document.body);
touch0 = d3.event.touches.item(0); touch0 = d3.event.touches.item(0);
var pos = [touch0.pageX,touch0.pageY]; var pos = [touch0.pageX,touch0.pageY];
startTouchCenter = [touch0.pageX,touch0.pageY]; startTouchCenter = [touch0.pageX,touch0.pageY];
startTouchDistance = 0; startTouchDistance = 0;
var point = d3.touches(this)[0];
touchStartTime = setTimeout(function() { touchStartTime = setTimeout(function() {
touchStartTime = null; touchStartTime = null;
showTouchMenu(obj,pos); showTouchMenu(document.body,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");
},touchLongPressTimeout); },touchLongPressTimeout);
} }
d3.event.preventDefault(); d3.event.preventDefault();
@ -3703,13 +3691,12 @@ RED.view = (function() {
} }
function nodeTouchStart(d) { function nodeTouchStart(d) {
if (RED.view.DEBUG) { console.warn("nodeTouchStart", mouse_mode,d); } if (RED.view.DEBUG) { console.warn("nodeTouchStart", mouse_mode,d); }
var obj = d3.select(this);
var touch0 = d3.event.touches.item(0); var touch0 = d3.event.touches.item(0);
var pos = [touch0.pageX,touch0.pageY]; var pos = [touch0.pageX,touch0.pageY];
startTouchCenter = [touch0.pageX,touch0.pageY]; startTouchCenter = [touch0.pageX,touch0.pageY];
startTouchDistance = 0; startTouchDistance = 0;
touchStartTime = setTimeout(function() { touchStartTime = setTimeout(function() {
showTouchMenu(obj,pos); showTouchMenu(this,pos);
},touchLongPressTimeout); },touchLongPressTimeout);
nodeMouseDown.call(this,d) nodeMouseDown.call(this,d)
d3.event.preventDefault(); d3.event.preventDefault();
@ -3868,12 +3855,11 @@ RED.view = (function() {
focusView(); focusView();
d3.event.stopPropagation(); d3.event.stopPropagation();
var obj = d3.select(document.body);
var touch0 = d3.event.touches.item(0); var touch0 = d3.event.touches.item(0);
var pos = [touch0.pageX,touch0.pageY]; var pos = [touch0.pageX,touch0.pageY];
touchStartTime = setTimeout(function() { touchStartTime = setTimeout(function() {
touchStartTime = null; touchStartTime = null;
showTouchMenu(obj,pos); showTouchMenu(document.body,pos);
},touchLongPressTimeout); },touchLongPressTimeout);
d3.event.preventDefault(); d3.event.preventDefault();
} }