Add main menu customisation

editor/js/ui/keyboard.js

@@ -59,46 +59,53 @@ RED.keyboard = (function() {
     }
     
     
-    var dialog = $('<div id="keyboard-help-dialog" class="hide">'+
+    var dialog = null;
-    '<div style="vertical-align: top;display:inline-block; box-sizing: border-box; width:50%; padding: 10px;">'+
-        '<table class="keyboard-shortcuts">'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">a</span></td><td>Select all nodes</td></tr>'+
-            '<tr><td><span class="help-key">Shift</span> + <span class="help-key">Click</span></td><td>Select all connected nodes</td></tr>'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">Click</span></td><td>Add/remove node from selection</td></tr>'+
-            '<tr><td><span class="help-key">Delete</span></td><td>Delete selected nodes or link</td></tr>'+
-            '<tr><td>&nbsp;</td><td></td></tr>'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">i</span></td><td>Import nodes</td></tr>'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">e</span></td><td>Export selected nodes</td></tr>'+
-        '</table>'+
-    '</div>'+
-    '<div style="vertical-align: top;display:inline-block; box-sizing: border-box; width:50%; padding: 10px;">'+
-        '<table class="keyboard-shortcuts">'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">Space</span></td><td>Toggle sidebar</td></tr>'+
-            '<tr><td></td><td></td></tr>'+
-            '<tr><td><span class="help-key">Delete</span></td><td>Delete selected nodes or link</td></tr>'+
-            '<tr><td></td><td></td></tr>'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">c</span></td><td>Copy selected nodes</td></tr>'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">x</span></td><td>Cut selected nodes</td></tr>'+
-            '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">v</span></td><td>Paste nodes</td></tr>'+
-        '</table>'+
-    '</div>'+
-    '</div>')
-    .appendTo("body")
-    .dialog({
-        modal: true,
-        autoOpen: false,
-        width: "800",
-        title:"Keyboard shortcuts",
-        resizable: false,
-        open: function() {
-            RED.keyboard.disable();
-        },
-        close: function() {
-            RED.keyboard.enable();
-        }
-    });
     
     function showKeyboardHelp() {
+        if (!RED.settings.theme("menu.btn-keyboard-shortcuts",true)) {
+            return;
+        }
+        if (!dialog) {
+            dialog = $('<div id="keyboard-help-dialog" class="hide">'+
+                '<div style="vertical-align: top;display:inline-block; box-sizing: border-box; width:50%; padding: 10px;">'+
+                    '<table class="keyboard-shortcuts">'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">a</span></td><td>Select all nodes</td></tr>'+
+                        '<tr><td><span class="help-key">Shift</span> + <span class="help-key">Click</span></td><td>Select all connected nodes</td></tr>'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">Click</span></td><td>Add/remove node from selection</td></tr>'+
+                        '<tr><td><span class="help-key">Delete</span></td><td>Delete selected nodes or link</td></tr>'+
+                        '<tr><td>&nbsp;</td><td></td></tr>'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">i</span></td><td>Import nodes</td></tr>'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">e</span></td><td>Export selected nodes</td></tr>'+
+                    '</table>'+
+                '</div>'+
+                '<div style="vertical-align: top;display:inline-block; box-sizing: border-box; width:50%; padding: 10px;">'+
+                    '<table class="keyboard-shortcuts">'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">Space</span></td><td>Toggle sidebar</td></tr>'+
+                        '<tr><td></td><td></td></tr>'+
+                        '<tr><td><span class="help-key">Delete</span></td><td>Delete selected nodes or link</td></tr>'+
+                        '<tr><td></td><td></td></tr>'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">c</span></td><td>Copy selected nodes</td></tr>'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">x</span></td><td>Cut selected nodes</td></tr>'+
+                        '<tr><td><span class="help-key">Ctrl/&#8984;</span> + <span class="help-key">v</span></td><td>Paste nodes</td></tr>'+
+                    '</table>'+
+                '</div>'+
+                '</div>')
+            .appendTo("body")
+            .dialog({
+                modal: true,
+                autoOpen: false,
+                width: "800",
+                title:"Keyboard shortcuts",
+                resizable: false,
+                open: function() {
+                    RED.keyboard.disable();
+                },
+                close: function() {
+                    RED.keyboard.enable();
+                }
+            });
+        }
+        
         dialog.dialog("open");
     }
     

editor/js/ui/library.js

@@ -402,7 +402,9 @@ RED.library = (function() {
                 }
             });
             
-            loadFlowLibrary();
+            if (RED.settings.theme("menu.btn-import-library") !== false) { 
+                loadFlowLibrary();
+            }
         },
         create: createUI,
         loadFlowLibrary: loadFlowLibrary,

editor/js/ui/menu.js

@@ -23,6 +23,13 @@ RED.menu = (function() {
     function createMenuItem(opt) {
         var item;
 
+        if (opt !== null && opt.id) {
+            var themeSetting = RED.settings.theme("menu."+opt.id);
+            if (themeSetting === false) {
+                return null;
+            }
+        }
+        
         function setState() {
             var savedStateActive = isSavedStateActive(opt.id);
             if (savedStateActive) {
@@ -113,7 +120,10 @@ RED.menu = (function() {
                 var submenu = $('<ul id="'+opt.id+'-submenu" class="dropdown-menu"></ul>').appendTo(item);
 
                 for (var i=0;i<opt.options.length;i++) {
-                    createMenuItem(opt.options[i]).appendTo(submenu);
+                    var li = createMenuItem(opt.options[i]);
+                    if (li) {
+                        li.appendTo(submenu);
+                    }
                 }
             }
             if (opt.disabled) {
@@ -148,9 +158,16 @@ RED.menu = (function() {
         
         var topMenu = $("<ul/>",{id:options.id+"-submenu", class:"dropdown-menu pull-right"}).insertAfter(button);
 
+        var lastAddedSeparator = false;
         for (var i=0;i<options.options.length;i++) {
             var opt = options.options[i];
-            createMenuItem(opt).appendTo(topMenu);
+            if (opt !== null || !lastAddedSeparator) {
+                var li = createMenuItem(opt);
+                if (li) {
+                    li.appendTo(topMenu);
+                    lastAddedSeparator = (opt === null);
+                }
+            }
         }
     }
 
@@ -176,7 +193,7 @@ RED.menu = (function() {
         } else {
             $("#"+id).removeClass("active");
         }
-        if (opt.onselect) {
+        if (opt && opt.onselect) {
             opt.onselect.call(opt,state);
         }
         setSavedState(id, state);
@@ -198,17 +215,20 @@ RED.menu = (function() {
     }
 
     function setAction(id,action) {
-        menuItems[id].onselect = action;
+        var opt = menuItems[id];
-        $("#"+id).click(function() {
+        if (opt) {
-            if ($(this).parent().hasClass("disabled")) {
+            opt.onselect = action;
-                return;
+            $("#"+id).click(function() {
-            }
+                if ($(this).parent().hasClass("disabled")) {
-            if (menuItems[id].toggle) {
+                    return;
-                setSelected(id,!isSelected(id));
+                }
-            } else {
+                if (menuItems[id].toggle) {
-                menuItems[id].onselect.call(menuItems[id]);
+                    setSelected(id,!isSelected(id));
-            }
+                } else {
-        });
+                    menuItems[id].onselect.call(menuItems[id]);
+                }
+            });
+        }
     }
 
     return {

red/api/theme.js

@@ -145,6 +145,11 @@ module.exports = {
             if (theme.help) {
                 themeSettings.help = theme.help;
             }
+            
+            if (theme.hasOwnProperty("menu")) {
+                themeSettings.menu = theme.menu;
+            }
+            
             return themeApp;
         }
     },