diff --git a/editor/js/main.js b/editor/js/main.js index 59ec5e814..6c209eb6d 100644 --- a/editor/js/main.js +++ b/editor/js/main.js @@ -209,7 +209,6 @@ ]}); menuOptions.push(null); if (RED.settings.theme('palette.editable') !== false) { - RED.palette.editor.init(); menuOptions.push({id:"menu-item-edit-palette",label:RED._("menu.label.editPalette"),onselect:"core:manage-palette"}); menuOptions.push(null); } @@ -225,19 +224,23 @@ menuOptions.push({id:"menu-item-node-red-version", label:"v"+RED.settings.version, onselect: "core:show-about" }); + RED.view.init(); + RED.userSettings.init(); RED.user.init(); RED.library.init(); + RED.keyboard.init(); RED.palette.init(); + if (RED.settings.theme('palette.editable') !== false) { + RED.palette.editor.init(); + } + RED.sidebar.init(); RED.subflow.init(); RED.workspaces.init(); RED.clipboard.init(); RED.search.init(); - RED.view.init(); RED.editor.init(); - RED.keyboard.init(); RED.diff.init(); - RED.userSettings.init(); RED.menu.init({id:"btn-sidemenu",options: menuOptions}); diff --git a/editor/js/ui/common/tabs.js b/editor/js/ui/common/tabs.js index d5e0c95b8..f66b95421 100644 --- a/editor/js/ui/common/tabs.js +++ b/editor/js/ui/common/tabs.js @@ -22,7 +22,7 @@ RED.tabs = (function() { var currentTabWidth; var currentActiveTabWidth = 0; - var ul = $("#"+options.id); + var ul = options.element || $("#"+options.id); var wrapper = ul.wrap( "
" ).parent(); var scrollContainer = ul.wrap( "
" ).parent(); wrapper.addClass("red-ui-tabs"); diff --git a/editor/js/ui/keyboard.js b/editor/js/ui/keyboard.js index f645b3b55..e7ec433bc 100644 --- a/editor/js/ui/keyboard.js +++ b/editor/js/ui/keyboard.js @@ -85,6 +85,12 @@ RED.keyboard = (function() { } } } + }); + + RED.userSettings.add({ + id:'keyboard', + title: 'Keyboard', + get: getSettingsPane }) } @@ -512,8 +518,7 @@ RED.keyboard = (function() { }, revertToDefault: revertToDefault, formatKey: formatKey, - validateKey: validateKey, - getSettingsPane: getSettingsPane + validateKey: validateKey } })(); diff --git a/editor/js/ui/palette-editor.js b/editor/js/ui/palette-editor.js index f227d0624..aecf54184 100644 --- a/editor/js/ui/palette-editor.js +++ b/editor/js/ui/palette-editor.js @@ -309,20 +309,23 @@ RED.palette.editor = (function() { } initInstallTab(); - $("#header-shade").show(); - $("#editor-shade").show(); - $("#sidebar-shade").show(); - $("#sidebar-separator").hide(); + // $("#header-shade").show(); + // $("#editor-shade").show(); + // $("#sidebar-shade").show(); + // $("#sidebar-separator").hide(); editorTabs.activateTab('nodes'); - $("#main-container").addClass("palette-expanded"); + // $("#main-container").addClass("palette-expanded"); setTimeout(function() { editorTabs.resize(); filterInput.focus(); },250); - RED.events.emit("palette-editor:open"); - RED.keyboard.add("*","escape",function(){hidePaletteEditor()}); + // RED.events.emit("palette-editor:open"); + // RED.keyboard.add("*","escape",function(){hidePaletteEditor()}); + + RED.userSettings.show('palette'); + } function hidePaletteEditor() { RED.keyboard.remove("escape"); @@ -445,22 +448,114 @@ RED.palette.editor = (function() { return -1 * (A.info.timestamp-B.info.timestamp); } + function init() { if (RED.settings.theme('palette.editable') === false) { return; } + createSettingsPane(); - RED.events.on("editor:open",function() { disabled = true; }); - RED.events.on("editor:close",function() { disabled = false; }); - RED.events.on("search:open",function() { disabled = true; }); - RED.events.on("search:close",function() { disabled = false; }); - RED.events.on("type-search:open",function() { disabled = true; }); - RED.events.on("type-search:close",function() { disabled = false; }); + RED.userSettings.add({ + id:'palette', + title: 'Palette', + get: getSettingsPane, + close: function() { + settingsPane.detach(); + } + }) + + // RED.events.on("editor:open",function() { disabled = true; }); + // RED.events.on("editor:close",function() { disabled = false; }); + // RED.events.on("search:open",function() { disabled = true; }); + // RED.events.on("search:close",function() { disabled = false; }); + // RED.events.on("type-search:open",function() { disabled = true; }); + // RED.events.on("type-search:close",function() { disabled = false; }); RED.actions.add("core:manage-palette",RED.palette.editor.show); + RED.events.on('registry:module-updated', function(ns) { + refreshNodeModule(ns.module); + }); + RED.events.on('registry:node-set-enabled', function(ns) { + refreshNodeModule(ns.module); + }); + RED.events.on('registry:node-set-disabled', function(ns) { + refreshNodeModule(ns.module); + }); + RED.events.on('registry:node-type-added', function(nodeType) { + if (!/^subflow:/.test(nodeType)) { + var ns = RED.nodes.registry.getNodeSetForType(nodeType); + refreshNodeModule(ns.module); + } + }); + RED.events.on('registry:node-type-removed', function(nodeType) { + if (!/^subflow:/.test(nodeType)) { + var ns = RED.nodes.registry.getNodeSetForType(nodeType); + refreshNodeModule(ns.module); + } + }); + RED.events.on('registry:node-set-added', function(ns) { + refreshNodeModule(ns.module); + for (var i=0;i
'); + var content = $('
'+ + ''+ + '
').appendTo(settingsPane); + editorTabs = RED.tabs.create({ - id:"palette-editor-tabs", + element: settingsPane.find('#palette-editor-tabs'), onchange:function(tab) { $("#palette-editor .palette-editor-tab").hide(); tab.content.show(); @@ -484,17 +579,7 @@ RED.palette.editor = (function() { }); - $("#editor-shade").click(function() { - if ($("#main-container").hasClass("palette-expanded")) { - hidePaletteEditor(); - } - }); - - $("#palette-editor-close").on("click", function(e) { - hidePaletteEditor(); - }) - - var modulesTab = $('
',{class:"palette-editor-tab"}).appendTo("#palette-editor"); + var modulesTab = $('
',{class:"palette-editor-tab"}).appendTo(content); editorTabs.addTab({ id: 'nodes', @@ -659,7 +744,7 @@ RED.palette.editor = (function() { - var installTab = $('
',{class:"palette-editor-tab hide"}).appendTo("#palette-editor"); + var installTab = $('
',{class:"palette-editor-tab hide"}).appendTo(content); editorTabs.addTab({ id: 'install', @@ -874,79 +959,6 @@ RED.palette.editor = (function() { } ] }) - - - RED.events.on('registry:module-updated', function(ns) { - refreshNodeModule(ns.module); - }); - RED.events.on('registry:node-set-enabled', function(ns) { - refreshNodeModule(ns.module); - }); - RED.events.on('registry:node-set-disabled', function(ns) { - refreshNodeModule(ns.module); - }); - RED.events.on('registry:node-type-added', function(nodeType) { - if (!/^subflow:/.test(nodeType)) { - var ns = RED.nodes.registry.getNodeSetForType(nodeType); - refreshNodeModule(ns.module); - } - }); - RED.events.on('registry:node-type-removed', function(nodeType) { - if (!/^subflow:/.test(nodeType)) { - var ns = RED.nodes.registry.getNodeSetForType(nodeType); - refreshNodeModule(ns.module); - } - }); - RED.events.on('registry:node-set-added', function(ns) { - refreshNodeModule(ns.module); - for (var i=0;i
',{id:"user-settings-tabs-container"}).appendTo(trayBody); + var settingsContent = $('
').appendTo(trayBody); + var tabContainer = $('
',{id:"user-settings-tabs-container"}).appendTo(settingsContent); $('
    ',{id:"user-settings-tabs"}).appendTo(tabContainer); - var tabContents = $('
    ',{id:"user-settings-tabs-content"}).appendTo(trayBody); - - createViewPane().hide().appendTo(tabContents); - RED.keyboard.getSettingsPane().hide().appendTo(tabContents); - - $('
    ').appendTo(tabContents); - - - var tabs = RED.tabs.create({ + var settingsTabs = RED.tabs.create({ id: "user-settings-tabs", vertical: true, onchange: function(tab) { - $("#user-settings-tabs-content").children().hide(); - $("#" + tab.id).show(); + setTimeout(function() { + $("#user-settings-tabs-content").children().hide(); + $("#" + tab.id).show(); + },50); } }); - tabs.addTab({ - id: "user-settings-tab-view", - label: "View" + var tabContents = $('
    ',{id:"user-settings-tabs-content"}).appendTo(settingsContent); + + panes.forEach(function(pane) { + settingsTabs.addTab({ + id: "user-settings-tab-"+pane.id, + label: pane.title + }); + pane.get().hide().appendTo(tabContents); }); - tabs.addTab({ - id: "user-settings-tab-keyboard", - label: "Keyboard" - }); - tabs.addTab({ - id: "user-settings-tab-palette", - label: "Palette" - }); - if (initialTab) { - tabs.activateTab("user-settings-tab-"+initialTab) - } + settingsContent.i18n(); + settingsTabs.activateTab("user-settings-tab-"+(initialTab||'view')) }, close: function() { settingsVisible = false; - - viewSettings.forEach(function(section) { - section.options.forEach(function(opt) { - var input = $("#user-settings-"+opt.setting); - if (opt.toggle) { - setSelected(opt.setting,input.prop('checked')); - } else { - setSelected(opt.setting,input.val()); - } - }); - }) - - + panes.forEach(function(pane) { + if (pane.close) { + pane.close(); + } + }); }, show: function() {} } @@ -171,6 +160,24 @@ RED.userSettings = (function() { RED.actions.add("core:show-user-settings",show); RED.actions.add("core:show-help", function() { show('keyboard')}); + addPane({ + id:'view', + title: 'View', + get: createViewPane, + close: function() { + viewSettings.forEach(function(section) { + section.options.forEach(function(opt) { + var input = $("#user-settings-"+opt.setting); + if (opt.toggle) { + setSelected(opt.setting,input.prop('checked')); + } else { + setSelected(opt.setting,input.val()); + } + }); + }) + } + }) + viewSettings.forEach(function(section) { section.options.forEach(function(opt) { allSettings[opt.setting] = opt; @@ -195,6 +202,8 @@ RED.userSettings = (function() { } return { init: init, - toggle: toggle + toggle: toggle, + show: show, + add: addPane }; })(); diff --git a/editor/sass/palette-editor.scss b/editor/sass/palette-editor.scss index 3f24a3e5c..48e007e10 100644 --- a/editor/sass/palette-editor.scss +++ b/editor/sass/palette-editor.scss @@ -14,13 +14,16 @@ * limitations under the License. **/ +#user-settings-tab-palette { + height: 100%; +} + #palette-editor { text-align: left; - display: none; position: absolute; top: 0px; right: 0; - bottom: 25px; + bottom: 0; left:0; padding: 0; box-sizing:border-box; @@ -51,7 +54,7 @@ } .red-ui-editableList-item-content { - padding: 12px 8px; + padding: 12px 16px; } &:last-child { // border-bottom: 1px solid $primary-border-color; @@ -61,7 +64,7 @@ } .palette-editor-tab { position:absolute; - top:115px; + top:35px; left:0; right:0; bottom:0 diff --git a/editor/templates/index.mst b/editor/templates/index.mst index 4194eda27..0e92457d9 100644 --- a/editor/templates/index.mst +++ b/editor/templates/index.mst @@ -60,10 +60,6 @@ -
    -
    -
      -