frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2025-03-01 10:36:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Change default dropdown appearance and sidebar tab menu handling

Browse Source
This commit is contained in:
Nick O'Leary
2019-01-10 23:30:51 +00:00
parent 9e47d933af
commit f26b9feeaf
5 changed files with 27 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js vendored
View File

@@ -150,13 +150,14 @@ RED.menu = (function() {
}
function createMenu(options) {
var topMenu = $("<ul/>",{class:"dropdown-menu pull-right"});
var menuParent = $("#"+options.id);
var topMenu = $("<ul/>",{id:options.id+"-submenu", class:"dropdown-menu pull-right"});
if (menuParent.length === 1) {
topMenu.insertAfter(menuParent);
if (options.id) {
topMenu.attr({id:options.id+"-submenu"});
var menuParent = $("#"+options.id);
if (menuParent.length === 1) {
topMenu.insertAfter(menuParent);
}
}
var lastAddedSeparator = false;

13
packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js vendored
View File

@@ -96,6 +96,7 @@ RED.tabs = (function() {
var selectButton = $('<a href="#"><i class="fa fa-caret-down"></i></a>').appendTo(collapsedButtonsRow);
selectButton.addClass("red-ui-tab-link-button-menu")
selectButton.click(function(evt) {
evt.stopPropagation();
evt.preventDefault();
if (!collapsibleMenu) {
var pinnedOptions = [];
@@ -121,15 +122,21 @@ RED.tabs = (function() {
collapsibleMenu.css({
position: "absolute"
})
collapsibleMenu.on('mouseleave', function(){ $(this).hide() });
collapsibleMenu.on('mouseup', function() { $(this).hide() });
collapsibleMenu.appendTo("body");
}
var elementPos = selectButton.offset();
collapsibleMenu.css({
top: (elementPos.top+selectButton.height()-20)+"px",
top: (elementPos.top+selectButton.height()-2)+"px",
left: (elementPos.left - collapsibleMenu.width() + selectButton.width())+"px"
})
if (collapsibleMenu.is(":visible")) {
$(document).off("click.tabmenu");
} else {
$(document).on("click.tabmenu", function(evt) {
$(document).off("click.tabmenu");
collapsibleMenu.hide();
});
}
collapsibleMenu.toggle();
})
}