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

Add onpre/postselect, direction opts to menu and make id optional

This commit is contained in:
Nick O'Leary 2022-06-16 13:50:05 +01:00
parent 6bea3dabbb
commit cce4f6f7f7
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9

View File

@ -16,6 +16,7 @@
RED.menu = (function() { RED.menu = (function() {
var menuItems = {}; var menuItems = {};
let menuItemCount = 0
function createMenuItem(opt) { function createMenuItem(opt) {
var item; var item;
@ -59,15 +60,16 @@ RED.menu = (function() {
item = $('<li class="red-ui-menu-divider"></li>'); item = $('<li class="red-ui-menu-divider"></li>');
} else { } else {
item = $('<li></li>'); item = $('<li></li>');
if (!opt.id) {
opt.id = 'red-ui-menu-item-'+(menuItemCount++)
}
if (opt.group) { if (opt.group) {
item.addClass("red-ui-menu-group-"+opt.group); item.addClass("red-ui-menu-group-"+opt.group);
} }
var linkContent = '<a '+(opt.id?'id="'+opt.id+'" ':'')+'tabindex="-1" href="#">'; var linkContent = '<a '+(opt.id?'id="'+opt.id+'" ':'')+'tabindex="-1" href="#">';
if (opt.toggle) { if (opt.toggle) {
linkContent += '<i class="fa fa-square pull-left"></i>'; linkContent += '<i class="fa fa-square'+(opt.direction!=='right'?" pull-left":"")+'"></i>';
linkContent += '<i class="fa fa-check-square pull-left"></i>'; linkContent += '<i class="fa fa-check-square'+(opt.direction!=='right'?" pull-left":"")+'"></i>';
} }
if (opt.icon !== undefined) { if (opt.icon !== undefined) {
@ -77,12 +79,15 @@ RED.menu = (function() {
linkContent += '<i class="'+(opt.icon?opt.icon:'" style="display: inline-block;"')+'"></i> '; linkContent += '<i class="'+(opt.icon?opt.icon:'" style="display: inline-block;"')+'"></i> ';
} }
} }
let label = opt.label
if (!opt.label && typeof opt.onselect === 'string') {
label = RED.actions.getLabel(opt.onselect)
}
if (opt.sublabel) { if (opt.sublabel) {
linkContent += '<span class="red-ui-menu-label-container"><span class="red-ui-menu-label">'+opt.label+'</span>'+ linkContent += '<span class="red-ui-menu-label-container"><span class="red-ui-menu-label">'+label+'</span>'+
'<span class="red-ui-menu-sublabel">'+opt.sublabel+'</span></span>' '<span class="red-ui-menu-sublabel">'+opt.sublabel+'</span></span>'
} else { } else {
linkContent += '<span class="red-ui-menu-label"><span>'+opt.label+'</span></span>' linkContent += '<span class="red-ui-menu-label"><span>'+label+'</span></span>'
} }
linkContent += '</a>'; linkContent += '</a>';
@ -126,10 +131,21 @@ RED.menu = (function() {
}); });
} }
if (opt.options) { if (opt.options) {
item.addClass("red-ui-menu-dropdown-submenu pull-left"); item.addClass("red-ui-menu-dropdown-submenu"+(opt.direction!=='right'?" pull-left":""));
var submenu = $('<ul id="'+opt.id+'-submenu" class="red-ui-menu-dropdown"></ul>').appendTo(item); var submenu = $('<ul id="'+opt.id+'-submenu" class="red-ui-menu-dropdown"></ul>').appendTo(item);
for (var i=0;i<opt.options.length;i++) { for (var i=0;i<opt.options.length;i++) {
if (opt.options[i]) {
if (opt.onpreselect && opt.options[i].onpreselect === undefined) {
opt.options[i].onpreselect = opt.onpreselect
}
if (opt.onpostselect && opt.options[i].onpostselect === undefined) {
opt.options[i].onpostselect = opt.onpostselect
}
opt.options[i].direction = opt.direction
}
var li = createMenuItem(opt.options[i]); var li = createMenuItem(opt.options[i]);
if (li) { if (li) {
li.appendTo(submenu); li.appendTo(submenu);
@ -147,7 +163,9 @@ RED.menu = (function() {
} }
function createMenu(options) { function createMenu(options) {
var topMenu = $("<ul/>",{class:"red-ui-menu red-ui-menu-dropdown pull-right"}); var topMenu = $("<ul/>",{class:"red-ui-menu red-ui-menu-dropdown pull-right"});
if (options.direction) {
topMenu.addClass("red-ui-menu-dropdown-direction-"+options.direction)
}
if (options.id) { if (options.id) {
topMenu.attr({id:options.id+"-submenu"}); topMenu.attr({id:options.id+"-submenu"});
var menuParent = $("#"+options.id); var menuParent = $("#"+options.id);
@ -175,6 +193,15 @@ RED.menu = (function() {
var lastAddedSeparator = false; var lastAddedSeparator = false;
for (var i=0;i<options.options.length;i++) { for (var i=0;i<options.options.length;i++) {
var opt = options.options[i]; var opt = options.options[i];
if (opt) {
if (options.onpreselect && opt.onpreselect === undefined) {
opt.onpreselect = options.onpreselect
}
if (options.onpostselect && opt.onpostselect === undefined) {
opt.onpostselect = options.onpostselect
}
opt.direction = options.direction || 'left'
}
if (opt !== null || !lastAddedSeparator) { if (opt !== null || !lastAddedSeparator) {
var li = createMenuItem(opt); var li = createMenuItem(opt);
if (li) { if (li) {
@ -190,6 +217,9 @@ RED.menu = (function() {
function triggerAction(id, args) { function triggerAction(id, args) {
var opt = menuItems[id]; var opt = menuItems[id];
var callback = opt.onselect; var callback = opt.onselect;
if (opt.onpreselect) {
opt.onpreselect.call(opt,args)
}
if (typeof opt.onselect === 'string') { if (typeof opt.onselect === 'string') {
callback = RED.actions.get(opt.onselect); callback = RED.actions.get(opt.onselect);
} }
@ -198,6 +228,9 @@ RED.menu = (function() {
} else { } else {
console.log("No callback for",id,opt.onselect); console.log("No callback for",id,opt.onselect);
} }
if (opt.onpostselect) {
opt.onpostselect.call(opt,args)
}
} }
function isSelected(id) { function isSelected(id) {