mirror of https://github.com/node-red/node-red.git
Namespace all sidebar css
This commit is contained in:
parent
d251a30cb8
commit
9dac679b72
|
@ -23,7 +23,7 @@
|
||||||
"ctrl-g v": "core:show-version-control-tab",
|
"ctrl-g v": "core:show-version-control-tab",
|
||||||
"ctrl-shift-l": "core:show-event-log"
|
"ctrl-shift-l": "core:show-event-log"
|
||||||
},
|
},
|
||||||
"sidebar-node-config": {
|
"red-ui-sidebar-node-config": {
|
||||||
"backspace": "core:delete-config-selection",
|
"backspace": "core:delete-config-selection",
|
||||||
"delete": "core:delete-config-selection",
|
"delete": "core:delete-config-selection",
|
||||||
"ctrl-a": "core:select-all-config-nodes",
|
"ctrl-a": "core:select-all-config-nodes",
|
||||||
|
|
|
@ -104,7 +104,7 @@ RED.text.bidi = (function() {
|
||||||
$("#workspace").find('span.bidiAware').each(function() {
|
$("#workspace").find('span.bidiAware').each(function() {
|
||||||
$(this).attr("dir", resolveBaseTextDir($(this).html()));
|
$(this).attr("dir", resolveBaseTextDir($(this).html()));
|
||||||
});
|
});
|
||||||
$("#sidebar").find('span.bidiAware').each(function() {
|
$("#red-ui-sidebar").find('span.bidiAware').each(function() {
|
||||||
$(this).attr("dir", resolveBaseTextDir($(this).text()));
|
$(this).attr("dir", resolveBaseTextDir($(this).text()));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -274,7 +274,7 @@ RED.deploy = (function() {
|
||||||
$("#header-shade").show();
|
$("#header-shade").show();
|
||||||
$("#editor-shade").show();
|
$("#editor-shade").show();
|
||||||
$("#red-ui-palette-shade").show();
|
$("#red-ui-palette-shade").show();
|
||||||
$("#sidebar-shade").show();
|
$("#red-ui-sidebar-shade").show();
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url:"flows",
|
url:"flows",
|
||||||
|
@ -309,7 +309,7 @@ RED.deploy = (function() {
|
||||||
$("#header-shade").hide();
|
$("#header-shade").hide();
|
||||||
$("#editor-shade").hide();
|
$("#editor-shade").hide();
|
||||||
$("#red-ui-palette-shade").hide();
|
$("#red-ui-palette-shade").hide();
|
||||||
$("#sidebar-shade").hide();
|
$("#red-ui-sidebar-shade").hide();
|
||||||
},delta);
|
},delta);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -425,7 +425,7 @@ RED.deploy = (function() {
|
||||||
$("#header-shade").show();
|
$("#header-shade").show();
|
||||||
$("#editor-shade").show();
|
$("#editor-shade").show();
|
||||||
$("#red-ui-palette-shade").show();
|
$("#red-ui-palette-shade").show();
|
||||||
$("#sidebar-shade").show();
|
$("#red-ui-sidebar-shade").show();
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url:"flows",
|
url:"flows",
|
||||||
type: "POST",
|
type: "POST",
|
||||||
|
@ -495,7 +495,7 @@ RED.deploy = (function() {
|
||||||
$("#header-shade").hide();
|
$("#header-shade").hide();
|
||||||
$("#editor-shade").hide();
|
$("#editor-shade").hide();
|
||||||
$("#red-ui-palette-shade").hide();
|
$("#red-ui-palette-shade").hide();
|
||||||
$("#sidebar-shade").hide();
|
$("#red-ui-sidebar-shade").hide();
|
||||||
},delta);
|
},delta);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -1283,11 +1283,11 @@ RED.diff = (function() {
|
||||||
diffTable.finish();
|
diffTable.finish();
|
||||||
diffTable.list.show();
|
diffTable.list.show();
|
||||||
},300);
|
},300);
|
||||||
$("#sidebar-shade").show();
|
$("#red-ui-sidebar-shade").show();
|
||||||
},
|
},
|
||||||
close: function() {
|
close: function() {
|
||||||
diffVisible = false;
|
diffVisible = false;
|
||||||
$("#sidebar-shade").hide();
|
$("#red-ui-sidebar-shade").hide();
|
||||||
|
|
||||||
},
|
},
|
||||||
show: function() {
|
show: function() {
|
||||||
|
|
|
@ -761,9 +761,9 @@ RED.palette.editor = (function() {
|
||||||
|
|
||||||
$('<span>').text(RED._("palette.editor.sort")+' ').appendTo(toolBar);
|
$('<span>').text(RED._("palette.editor.sort")+' ').appendTo(toolBar);
|
||||||
var sortGroup = $('<span class="button-group"></span>').appendTo(toolBar);
|
var sortGroup = $('<span class="button-group"></span>').appendTo(toolBar);
|
||||||
var sortRelevance = $('<a href="#" class="palette-editor-install-sort-option sidebar-header-button-toggle selected"><i class="fa fa-sort-amount-desc"></i></a>').appendTo(sortGroup);
|
var sortRelevance = $('<a href="#" class="palette-editor-install-sort-option red-ui-sidebar-header-button-toggle selected"><i class="fa fa-sort-amount-desc"></i></a>').appendTo(sortGroup);
|
||||||
var sortAZ = $('<a href="#" class="palette-editor-install-sort-option sidebar-header-button-toggle" data-i18n="palette.editor.sortAZ"></a>').appendTo(sortGroup);
|
var sortAZ = $('<a href="#" class="palette-editor-install-sort-option red-ui-sidebar-header-button-toggle" data-i18n="palette.editor.sortAZ"></a>').appendTo(sortGroup);
|
||||||
var sortRecent = $('<a href="#" class="palette-editor-install-sort-option sidebar-header-button-toggle" data-i18n="palette.editor.sortRecent"></a>').appendTo(sortGroup);
|
var sortRecent = $('<a href="#" class="palette-editor-install-sort-option red-ui-sidebar-header-button-toggle" data-i18n="palette.editor.sortRecent"></a>').appendTo(sortGroup);
|
||||||
|
|
||||||
|
|
||||||
var sortOpts = [
|
var sortOpts = [
|
||||||
|
@ -785,7 +785,7 @@ RED.palette.editor = (function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
var refreshSpan = $('<span>').appendTo(toolBar);
|
var refreshSpan = $('<span>').appendTo(toolBar);
|
||||||
var refreshButton = $('<a href="#" class="sidebar-header-button"><i class="fa fa-refresh"></i></a>').appendTo(refreshSpan);
|
var refreshButton = $('<a href="#" class="red-ui-sidebar-header-button"><i class="fa fa-refresh"></i></a>').appendTo(refreshSpan);
|
||||||
refreshButton.on("click", function(e) {
|
refreshButton.on("click", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
loadedList = [];
|
loadedList = [];
|
||||||
|
|
|
@ -96,7 +96,7 @@ RED.projects.settings = (function() {
|
||||||
});
|
});
|
||||||
settingsContent.i18n();
|
settingsContent.i18n();
|
||||||
settingsTabs.activateTab("project-settings-tab-"+(initialTab||'main'))
|
settingsTabs.activateTab("project-settings-tab-"+(initialTab||'main'))
|
||||||
$("#sidebar-shade").show();
|
$("#red-ui-sidebar-shade").show();
|
||||||
},
|
},
|
||||||
close: function() {
|
close: function() {
|
||||||
settingsVisible = false;
|
settingsVisible = false;
|
||||||
|
@ -105,7 +105,7 @@ RED.projects.settings = (function() {
|
||||||
pane.close();
|
pane.close();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$("#sidebar-shade").hide();
|
$("#red-ui-sidebar-shade").hide();
|
||||||
|
|
||||||
},
|
},
|
||||||
show: function() {}
|
show: function() {}
|
||||||
|
|
|
@ -2229,13 +2229,13 @@ RED.projects = (function() {
|
||||||
// $("#header-shade").show();
|
// $("#header-shade").show();
|
||||||
// $("#editor-shade").show();
|
// $("#editor-shade").show();
|
||||||
// $("#red-ui-palette-shade").show();
|
// $("#red-ui-palette-shade").show();
|
||||||
// $("#sidebar-shade").show();
|
// $("#red-ui-sidebar-shade").show();
|
||||||
},
|
},
|
||||||
close: function(e) {
|
close: function(e) {
|
||||||
// $("#header-shade").hide();
|
// $("#header-shade").hide();
|
||||||
// $("#editor-shade").hide();
|
// $("#editor-shade").hide();
|
||||||
// $("#red-ui-palette-shade").hide();
|
// $("#red-ui-palette-shade").hide();
|
||||||
// $("#sidebar-shade").hide();
|
// $("#red-ui-sidebar-shade").hide();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
dialogBody = dialog.find("form");
|
dialogBody = dialog.find("form");
|
||||||
|
|
|
@ -257,8 +257,8 @@ RED.search = (function() {
|
||||||
$("#header-shade").show();
|
$("#header-shade").show();
|
||||||
$("#editor-shade").show();
|
$("#editor-shade").show();
|
||||||
$("#red-ui-palette-shade").show();
|
$("#red-ui-palette-shade").show();
|
||||||
$("#sidebar-shade").show();
|
$("#red-ui-sidebar-shade").show();
|
||||||
$("#sidebar-separator").hide();
|
$("#red-ui-sidebar-separator").hide();
|
||||||
indexWorkspace();
|
indexWorkspace();
|
||||||
if (dialog === null) {
|
if (dialog === null) {
|
||||||
createDialog();
|
createDialog();
|
||||||
|
@ -278,8 +278,8 @@ RED.search = (function() {
|
||||||
$("#header-shade").hide();
|
$("#header-shade").hide();
|
||||||
$("#editor-shade").hide();
|
$("#editor-shade").hide();
|
||||||
$("#red-ui-palette-shade").hide();
|
$("#red-ui-palette-shade").hide();
|
||||||
$("#sidebar-shade").hide();
|
$("#red-ui-sidebar-shade").hide();
|
||||||
$("#sidebar-separator").show();
|
$("#red-ui-sidebar-separator").show();
|
||||||
if (dialog !== null) {
|
if (dialog !== null) {
|
||||||
dialog.slideUp(200,function() {
|
dialog.slideUp(200,function() {
|
||||||
searchInput.searchBox('value','');
|
searchInput.searchBox('value','');
|
||||||
|
@ -302,7 +302,7 @@ RED.search = (function() {
|
||||||
$("#header-shade").on('mousedown',hide);
|
$("#header-shade").on('mousedown',hide);
|
||||||
$("#editor-shade").on('mousedown',hide);
|
$("#editor-shade").on('mousedown',hide);
|
||||||
$("#red-ui-palette-shade").on('mousedown',hide);
|
$("#red-ui-palette-shade").on('mousedown',hide);
|
||||||
$("#sidebar-shade").on('mousedown',hide);
|
$("#red-ui-sidebar-shade").on('mousedown',hide);
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -16,33 +16,8 @@
|
||||||
RED.sidebar = (function() {
|
RED.sidebar = (function() {
|
||||||
|
|
||||||
//$('#sidebar').tabs();
|
//$('#sidebar').tabs();
|
||||||
var sidebar_tabs = RED.tabs.create({
|
var sidebar_tabs;
|
||||||
id:"sidebar-tabs",
|
var knownTabs = {};
|
||||||
onchange:function(tab) {
|
|
||||||
$("#sidebar-content").children().hide();
|
|
||||||
$("#sidebar-footer").children().hide();
|
|
||||||
if (tab.onchange) {
|
|
||||||
tab.onchange.call(tab);
|
|
||||||
}
|
|
||||||
$(tab.wrapper).show();
|
|
||||||
if (tab.toolbar) {
|
|
||||||
$(tab.toolbar).show();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
onremove: function(tab) {
|
|
||||||
$(tab.wrapper).hide();
|
|
||||||
if (tab.onremove) {
|
|
||||||
tab.onremove.call(tab);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// minimumActiveTabWidth: 70,
|
|
||||||
collapsible: true
|
|
||||||
// scrollable: true
|
|
||||||
});
|
|
||||||
|
|
||||||
var knownTabs = {
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
function addTab(title,content,closeable,visible) {
|
function addTab(title,content,closeable,visible) {
|
||||||
var options;
|
var options;
|
||||||
|
@ -62,16 +37,16 @@ RED.sidebar = (function() {
|
||||||
|
|
||||||
delete options.closeable;
|
delete options.closeable;
|
||||||
|
|
||||||
options.wrapper = $('<div>',{style:"height:100%"}).appendTo("#sidebar-content")
|
options.wrapper = $('<div>',{style:"height:100%"}).appendTo("#red-ui-sidebar-content")
|
||||||
options.wrapper.append(options.content);
|
options.wrapper.append(options.content);
|
||||||
options.wrapper.hide();
|
options.wrapper.hide();
|
||||||
|
|
||||||
if (!options.enableOnEdit) {
|
if (!options.enableOnEdit) {
|
||||||
options.shade = $('<div>',{class:"sidebar-shade hide"}).appendTo(options.wrapper);
|
options.shade = $('<div>',{class:"red-ui-sidebar-shade hide"}).appendTo(options.wrapper);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (options.toolbar) {
|
if (options.toolbar) {
|
||||||
$("#sidebar-footer").append(options.toolbar);
|
$("#red-ui-sidebar-footer").append(options.toolbar);
|
||||||
$(options.toolbar).hide();
|
$(options.toolbar).hide();
|
||||||
}
|
}
|
||||||
var id = options.id;
|
var id = options.id;
|
||||||
|
@ -107,7 +82,7 @@ RED.sidebar = (function() {
|
||||||
var sidebarSeparator = {};
|
var sidebarSeparator = {};
|
||||||
sidebarSeparator.dragging = false;
|
sidebarSeparator.dragging = false;
|
||||||
|
|
||||||
$("#sidebar-separator").draggable({
|
$("#red-ui-sidebar-separator").draggable({
|
||||||
axis: "x",
|
axis: "x",
|
||||||
start:function(event,ui) {
|
start:function(event,ui) {
|
||||||
sidebarSeparator.closing = false;
|
sidebarSeparator.closing = false;
|
||||||
|
@ -121,14 +96,14 @@ RED.sidebar = (function() {
|
||||||
if (!RED.menu.isSelected("menu-item-sidebar")) {
|
if (!RED.menu.isSelected("menu-item-sidebar")) {
|
||||||
sidebarSeparator.opening = true;
|
sidebarSeparator.opening = true;
|
||||||
var newChartRight = 7;
|
var newChartRight = 7;
|
||||||
$("#sidebar").addClass("closing");
|
$("#red-ui-sidebar").addClass("closing");
|
||||||
$("#workspace").css("right",newChartRight);
|
$("#workspace").css("right",newChartRight);
|
||||||
$("#editor-stack").css("right",newChartRight+1);
|
$("#editor-stack").css("right",newChartRight+1);
|
||||||
$("#sidebar").width(0);
|
$("#red-ui-sidebar").width(0);
|
||||||
RED.menu.setSelected("menu-item-sidebar",true);
|
RED.menu.setSelected("menu-item-sidebar",true);
|
||||||
RED.events.emit("sidebar:resize");
|
RED.events.emit("sidebar:resize");
|
||||||
}
|
}
|
||||||
sidebarSeparator.width = $("#sidebar").width();
|
sidebarSeparator.width = $("#red-ui-sidebar").width();
|
||||||
},
|
},
|
||||||
drag: function(event,ui) {
|
drag: function(event,ui) {
|
||||||
var d = ui.position.left-sidebarSeparator.start;
|
var d = ui.position.left-sidebarSeparator.start;
|
||||||
|
@ -147,7 +122,7 @@ RED.sidebar = (function() {
|
||||||
|
|
||||||
if (newSidebarWidth < 150) {
|
if (newSidebarWidth < 150) {
|
||||||
if (!sidebarSeparator.closing) {
|
if (!sidebarSeparator.closing) {
|
||||||
$("#sidebar").addClass("closing");
|
$("#red-ui-sidebar").addClass("closing");
|
||||||
sidebarSeparator.closing = true;
|
sidebarSeparator.closing = true;
|
||||||
}
|
}
|
||||||
if (!sidebarSeparator.opening) {
|
if (!sidebarSeparator.opening) {
|
||||||
|
@ -157,13 +132,13 @@ RED.sidebar = (function() {
|
||||||
}
|
}
|
||||||
} else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) {
|
} else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) {
|
||||||
sidebarSeparator.closing = false;
|
sidebarSeparator.closing = false;
|
||||||
$("#sidebar").removeClass("closing");
|
$("#red-ui-sidebar").removeClass("closing");
|
||||||
}
|
}
|
||||||
|
|
||||||
var newChartRight = sidebarSeparator.chartRight-d;
|
var newChartRight = sidebarSeparator.chartRight-d;
|
||||||
$("#workspace").css("right",newChartRight);
|
$("#workspace").css("right",newChartRight);
|
||||||
$("#editor-stack").css("right",newChartRight+1);
|
$("#editor-stack").css("right",newChartRight+1);
|
||||||
$("#sidebar").width(newSidebarWidth);
|
$("#red-ui-sidebar").width(newSidebarWidth);
|
||||||
|
|
||||||
sidebar_tabs.resize();
|
sidebar_tabs.resize();
|
||||||
RED.events.emit("sidebar:resize");
|
RED.events.emit("sidebar:resize");
|
||||||
|
@ -171,26 +146,26 @@ RED.sidebar = (function() {
|
||||||
stop:function(event,ui) {
|
stop:function(event,ui) {
|
||||||
sidebarSeparator.dragging = false;
|
sidebarSeparator.dragging = false;
|
||||||
if (sidebarSeparator.closing) {
|
if (sidebarSeparator.closing) {
|
||||||
$("#sidebar").removeClass("closing");
|
$("#red-ui-sidebar").removeClass("closing");
|
||||||
RED.menu.setSelected("menu-item-sidebar",false);
|
RED.menu.setSelected("menu-item-sidebar",false);
|
||||||
if ($("#sidebar").width() < 180) {
|
if ($("#red-ui-sidebar").width() < 180) {
|
||||||
$("#sidebar").width(180);
|
$("#red-ui-sidebar").width(180);
|
||||||
$("#workspace").css("right",187);
|
$("#workspace").css("right",187);
|
||||||
$("#editor-stack").css("right",188);
|
$("#editor-stack").css("right",188);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$("#sidebar-separator").css("left","auto");
|
$("#red-ui-sidebar-separator").css("left","auto");
|
||||||
$("#sidebar-separator").css("right",($("#sidebar").width()+2)+"px");
|
$("#red-ui-sidebar-separator").css("right",($("#red-ui-sidebar").width()+2)+"px");
|
||||||
RED.events.emit("sidebar:resize");
|
RED.events.emit("sidebar:resize");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
var sidebarControls = $('<div class="sidebar-control-right"><i class="fa fa-chevron-right"</div>').appendTo($("#sidebar-separator"));
|
var sidebarControls = $('<div class="red-ui-sidebar-control-right"><i class="fa fa-chevron-right"</div>').appendTo($("#red-ui-sidebar-separator"));
|
||||||
sidebarControls.on("click", function() {
|
sidebarControls.on("click", function() {
|
||||||
sidebarControls.hide();
|
sidebarControls.hide();
|
||||||
RED.menu.toggleSelected("menu-item-sidebar");
|
RED.menu.toggleSelected("menu-item-sidebar");
|
||||||
})
|
})
|
||||||
$("#sidebar-separator").on("mouseenter", function() {
|
$("#red-ui-sidebar-separator").on("mouseenter", function() {
|
||||||
if (!sidebarSeparator.dragging) {
|
if (!sidebarSeparator.dragging) {
|
||||||
if (RED.menu.isSelected("menu-item-sidebar")) {
|
if (RED.menu.isSelected("menu-item-sidebar")) {
|
||||||
sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
|
sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
|
||||||
|
@ -200,7 +175,7 @@ RED.sidebar = (function() {
|
||||||
sidebarControls.toggle("slide", { direction: "right" }, 200);
|
sidebarControls.toggle("slide", { direction: "right" }, 200);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
$("#sidebar-separator").on("mouseleave", function() {
|
$("#red-ui-sidebar-separator").on("mouseleave", function() {
|
||||||
if (!sidebarSeparator.dragging) {
|
if (!sidebarSeparator.dragging) {
|
||||||
sidebarControls.hide();
|
sidebarControls.hide();
|
||||||
}
|
}
|
||||||
|
@ -208,9 +183,9 @@ RED.sidebar = (function() {
|
||||||
|
|
||||||
function toggleSidebar(state) {
|
function toggleSidebar(state) {
|
||||||
if (!state) {
|
if (!state) {
|
||||||
$("#main-container").addClass("sidebar-closed");
|
$("#main-container").addClass("red-ui-sidebar-closed");
|
||||||
} else {
|
} else {
|
||||||
$("#main-container").removeClass("sidebar-closed");
|
$("#main-container").removeClass("red-ui-sidebar-closed");
|
||||||
sidebar_tabs.resize();
|
sidebar_tabs.resize();
|
||||||
}
|
}
|
||||||
RED.events.emit("sidebar:resize");
|
RED.events.emit("sidebar:resize");
|
||||||
|
@ -233,6 +208,34 @@ RED.sidebar = (function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function init () {
|
function init () {
|
||||||
|
sidebar_tabs = RED.tabs.create({
|
||||||
|
element: $('<ul id="red-ui-sidebar-tabs"></ul>').appendTo("#red-ui-sidebar"),
|
||||||
|
onchange:function(tab) {
|
||||||
|
$("#red-ui-sidebar-content").children().hide();
|
||||||
|
$("#red-ui-sidebar-footer").children().hide();
|
||||||
|
if (tab.onchange) {
|
||||||
|
tab.onchange.call(tab);
|
||||||
|
}
|
||||||
|
$(tab.wrapper).show();
|
||||||
|
if (tab.toolbar) {
|
||||||
|
$(tab.toolbar).show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onremove: function(tab) {
|
||||||
|
$(tab.wrapper).hide();
|
||||||
|
if (tab.onremove) {
|
||||||
|
tab.onremove.call(tab);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// minimumActiveTabWidth: 70,
|
||||||
|
collapsible: true
|
||||||
|
// scrollable: true
|
||||||
|
});
|
||||||
|
|
||||||
|
$('<div id="red-ui-sidebar-content"></div>').appendTo("#red-ui-sidebar");
|
||||||
|
$('<div id="red-ui-sidebar-footer" class="red-ui-component-footer"></div>').appendTo("#red-ui-sidebar");
|
||||||
|
$('<div id="red-ui-sidebar-shade" class="hide"></div>').appendTo("#red-ui-sidebar");
|
||||||
|
|
||||||
RED.actions.add("core:toggle-sidebar",function(state){
|
RED.actions.add("core:toggle-sidebar",function(state){
|
||||||
if (state === undefined) {
|
if (state === undefined) {
|
||||||
RED.menu.toggleSelected("menu-item-sidebar");
|
RED.menu.toggleSelected("menu-item-sidebar");
|
||||||
|
@ -240,7 +243,7 @@ RED.sidebar = (function() {
|
||||||
toggleSidebar(state);
|
toggleSidebar(state);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
RED.popover.tooltip($("#sidebar-separator").find(".sidebar-control-right"),RED._("keyboard.toggleSidebar"),"core:toggle-sidebar");
|
RED.popover.tooltip($("#red-ui-sidebar-separator").find(".red-ui-sidebar-control-right"),RED._("keyboard.toggleSidebar"),"core:toggle-sidebar");
|
||||||
showSidebar();
|
showSidebar();
|
||||||
RED.sidebar.info.init();
|
RED.sidebar.info.init();
|
||||||
RED.sidebar.config.init();
|
RED.sidebar.config.init();
|
||||||
|
|
|
@ -17,20 +17,20 @@ RED.sidebar.config = (function() {
|
||||||
|
|
||||||
|
|
||||||
var content = document.createElement("div");
|
var content = document.createElement("div");
|
||||||
content.className = "sidebar-node-config";
|
content.className = "red-ui-sidebar-node-config";
|
||||||
content.id = "sidebar-node-config";
|
content.id = "red-ui-sidebar-node-config";
|
||||||
content.tabIndex = 0;
|
content.tabIndex = 0;
|
||||||
|
|
||||||
$('<div class="sidebar-header"><span class="button-group">'+
|
$('<div class="red-ui-sidebar-header"><span class="button-group">'+
|
||||||
'<a class="sidebar-header-button-toggle selected" id="workspace-config-node-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
|
'<a class="red-ui-sidebar-header-button-toggle selected" id="workspace-config-node-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
|
||||||
'<a class="sidebar-header-button-toggle" id="workspace-config-node-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+
|
'<a class="red-ui-sidebar-header-button-toggle" id="workspace-config-node-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+
|
||||||
'</span></div>'
|
'</span></div>'
|
||||||
).appendTo(content);
|
).appendTo(content);
|
||||||
|
|
||||||
|
|
||||||
var toolbar = $('<div>'+
|
var toolbar = $('<div>'+
|
||||||
'<a class="sidebar-footer-button" id="workspace-config-node-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+
|
'<a class="red-ui-footer-button" id="workspace-config-node-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+
|
||||||
'<a class="sidebar-footer-button" id="workspace-config-node-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+
|
'<a class="red-ui-footer-button" id="workspace-config-node-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+
|
||||||
'</div>');
|
'</div>');
|
||||||
|
|
||||||
var globalCategories = $("<div>").appendTo(content);
|
var globalCategories = $("<div>").appendTo(content);
|
||||||
|
@ -45,7 +45,7 @@ RED.sidebar.config = (function() {
|
||||||
name = name.replace(/\./i,"-");
|
name = name.replace(/\./i,"-");
|
||||||
if (!categories[name]) {
|
if (!categories[name]) {
|
||||||
var container = $('<div class="red-ui-palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent);
|
var container = $('<div class="red-ui-palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent);
|
||||||
var header = $('<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
|
var header = $('<div class="workspace-config-node-tray-header red-ui-palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
|
||||||
if (label) {
|
if (label) {
|
||||||
$('<span class="config-node-label"/>').text(label).appendTo(header);
|
$('<span class="config-node-label"/>').text(label).appendTo(header);
|
||||||
} else {
|
} else {
|
||||||
|
@ -355,7 +355,7 @@ RED.sidebar.config = (function() {
|
||||||
var node = $(".red-ui-palette-node_id_"+id);
|
var node = $(".red-ui-palette-node_id_"+id);
|
||||||
var y = node.position().top;
|
var y = node.position().top;
|
||||||
var h = node.height();
|
var h = node.height();
|
||||||
var scrollWindow = $(".sidebar-node-config");
|
var scrollWindow = $(".red-ui-sidebar-node-config");
|
||||||
var scrollHeight = scrollWindow.height();
|
var scrollHeight = scrollWindow.height();
|
||||||
|
|
||||||
if (y+h > scrollHeight) {
|
if (y+h > scrollHeight) {
|
||||||
|
|
|
@ -33,12 +33,8 @@ RED.sidebar.context = (function() {
|
||||||
|
|
||||||
content = $("<div>").css({"position":"relative","height":"100%"});
|
content = $("<div>").css({"position":"relative","height":"100%"});
|
||||||
content.className = "sidebar-context"
|
content.className = "sidebar-context"
|
||||||
// var toolbar = $('<div class="sidebar-header">'+
|
|
||||||
// '</div>').appendTo(content);
|
|
||||||
|
|
||||||
var footerToolbar = $('<div>'+
|
var footerToolbar = $('<div></div>');
|
||||||
// '<span class="button-group"><a class="sidebar-footer-button" href="#" data-i18n="[title]node-red:debug.sidebar.openWindow"><i class="fa fa-desktop"></i></a></span> ' +
|
|
||||||
'</div>');
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -118,7 +118,7 @@ RED.tray = (function() {
|
||||||
$("#header-shade").show();
|
$("#header-shade").show();
|
||||||
$("#editor-shade").show();
|
$("#editor-shade").show();
|
||||||
$("#red-ui-palette-shade").show();
|
$("#red-ui-palette-shade").show();
|
||||||
$(".sidebar-shade").show();
|
$(".red-ui-sidebar-shade").show();
|
||||||
tray.preferredWidth = Math.max(el.width(),500);
|
tray.preferredWidth = Math.max(el.width(),500);
|
||||||
if (!options.maximized) {
|
if (!options.maximized) {
|
||||||
body.css({"minWidth":tray.preferredWidth-40});
|
body.css({"minWidth":tray.preferredWidth-40});
|
||||||
|
@ -270,7 +270,7 @@ RED.tray = (function() {
|
||||||
$("#header-shade").hide();
|
$("#header-shade").hide();
|
||||||
$("#editor-shade").hide();
|
$("#editor-shade").hide();
|
||||||
$("#red-ui-palette-shade").hide();
|
$("#red-ui-palette-shade").hide();
|
||||||
$(".sidebar-shade").hide();
|
$(".red-ui-sidebar-shade").hide();
|
||||||
RED.events.emit("editor:close");
|
RED.events.emit("editor:close");
|
||||||
RED.view.focus();
|
RED.view.focus();
|
||||||
}
|
}
|
||||||
|
|
|
@ -82,7 +82,7 @@ RED.userSettings = (function() {
|
||||||
});
|
});
|
||||||
settingsContent.i18n();
|
settingsContent.i18n();
|
||||||
settingsTabs.activateTab("user-settings-tab-"+(initialTab||'view'))
|
settingsTabs.activateTab("user-settings-tab-"+(initialTab||'view'))
|
||||||
$("#sidebar-shade").show();
|
$("#red-ui-sidebar-shade").show();
|
||||||
},
|
},
|
||||||
close: function() {
|
close: function() {
|
||||||
settingsVisible = false;
|
settingsVisible = false;
|
||||||
|
@ -91,7 +91,7 @@ RED.userSettings = (function() {
|
||||||
pane.close();
|
pane.close();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$("#sidebar-shade").hide();
|
$("#red-ui-sidebar-shade").hide();
|
||||||
|
|
||||||
},
|
},
|
||||||
show: function() {}
|
show: function() {}
|
||||||
|
|
|
@ -297,13 +297,13 @@ RED.workspaces = (function() {
|
||||||
$("#chart svg").css({"pointer-events":"auto",filter:"none"})
|
$("#chart svg").css({"pointer-events":"auto",filter:"none"})
|
||||||
$("#workspace-toolbar").css({"pointer-events":"auto",filter:"none"})
|
$("#workspace-toolbar").css({"pointer-events":"auto",filter:"none"})
|
||||||
$("#red-ui-palette-container").css({"pointer-events":"auto",filter:"none"})
|
$("#red-ui-palette-container").css({"pointer-events":"auto",filter:"none"})
|
||||||
$(".sidebar-shade").hide();
|
$(".red-ui-sidebar-shade").hide();
|
||||||
} else {
|
} else {
|
||||||
RED.view.select(false)
|
RED.view.select(false)
|
||||||
$("#chart svg").css({"pointer-events":"none",filter:"opacity(60%)"})
|
$("#chart svg").css({"pointer-events":"none",filter:"opacity(60%)"})
|
||||||
$("#workspace-toolbar").css({"pointer-events":"none",filter:"opacity(60%)"})
|
$("#workspace-toolbar").css({"pointer-events":"none",filter:"opacity(60%)"})
|
||||||
$("#red-ui-palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
|
$("#red-ui-palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
|
||||||
$(".sidebar-shade").show();
|
$(".red-ui-sidebar-shade").show();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
minimumActiveTabWidth: 150,
|
minimumActiveTabWidth: 150,
|
||||||
|
|
|
@ -154,11 +154,11 @@
|
||||||
background: $background-color;
|
background: $background-color;
|
||||||
color: $workspace-button-color;
|
color: $workspace-button-color;
|
||||||
}
|
}
|
||||||
#red-ui-palette-shade, #editor-shade, #header-shade, #sidebar-shade {
|
#red-ui-palette-shade, #editor-shade, #header-shade, #red-ui-sidebar-shade {
|
||||||
@include shade;
|
@include shade;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
#sidebar-shade {
|
#red-ui-sidebar-shade {
|
||||||
left: -8px;
|
left: -8px;
|
||||||
top: -1px;
|
top: -1px;
|
||||||
bottom: -1px;
|
bottom: -1px;
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
**/
|
**/
|
||||||
|
|
||||||
#sidebar {
|
#red-ui-sidebar {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
@ -26,13 +26,13 @@
|
||||||
@include component-border;
|
@include component-border;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar.closing {
|
#red-ui-sidebar.closing {
|
||||||
background: #eee;
|
background: #eee;
|
||||||
border-color: #900;
|
border-color: #900;
|
||||||
border-style: dashed;
|
border-style: dashed;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar-content {
|
#red-ui-sidebar-content {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 35px;
|
top: 35px;
|
||||||
right: 0;
|
right: 0;
|
||||||
|
@ -41,7 +41,7 @@
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar-separator {
|
#red-ui-sidebar-separator {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 5px;
|
top: 5px;
|
||||||
right: 315px;
|
right: 315px;
|
||||||
|
@ -52,12 +52,12 @@
|
||||||
cursor: col-resize;
|
cursor: col-resize;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-closed > #sidebar { display: none; }
|
.red-ui-sidebar-closed > #red-ui-sidebar { display: none; }
|
||||||
.sidebar-closed > #sidebar-separator { right: 0px !important; }
|
.red-ui-sidebar-closed > #red-ui-sidebar-separator { right: 0px !important; }
|
||||||
.sidebar-closed > #workspace { right: 7px !important; }
|
.red-ui-sidebar-closed > #workspace { right: 7px !important; }
|
||||||
.sidebar-closed > #editor-stack { right: 8px !important; }
|
.red-ui-sidebar-closed > #editor-stack { right: 8px !important; }
|
||||||
|
|
||||||
#sidebar .button {
|
#red-ui-sidebar .button {
|
||||||
@include workspace-button;
|
@include workspace-button;
|
||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
@ -65,7 +65,8 @@
|
||||||
padding: 2px 8px;
|
padding: 2px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-header {
|
.sidebar-header, /* Deprecated -> red-ui-sidebar-header */
|
||||||
|
.red-ui-sidebar-header {
|
||||||
color: #666;
|
color: #666;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding: 8px 10px;
|
padding: 8px 10px;
|
||||||
|
@ -74,34 +75,42 @@
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Deprecated -> red-ui-footer-button */
|
||||||
.sidebar-footer-button {
|
.sidebar-footer-button {
|
||||||
@include component-footer-button;
|
@include component-footer-button;
|
||||||
}
|
}
|
||||||
|
/* Deprecated -> red-ui-footer-button-toggle */
|
||||||
.sidebar-footer-button-toggle {
|
.sidebar-footer-button-toggle {
|
||||||
@include component-footer-button-toggle;
|
@include component-footer-button-toggle;
|
||||||
}
|
}
|
||||||
.sidebar-header-button {
|
|
||||||
|
.sidebar-header-button, /* Deprecated -> red-ui-sidebar-header-button */
|
||||||
|
.red-ui-sidebar-header-button {
|
||||||
@include workspace-button;
|
@include workspace-button;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
line-height: 13px;
|
line-height: 13px;
|
||||||
padding: 5px 8px;
|
padding: 5px 8px;
|
||||||
}
|
}
|
||||||
.sidebar-header-button-toggle {
|
|
||||||
|
.sidebar-header-button-toggle, /* Deprecated -> red-ui-sidebar-header-button-toggle */
|
||||||
|
.red-ui-sidebar-header-button-toggle {
|
||||||
@include workspace-button-toggle;
|
@include workspace-button-toggle;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
line-height: 13px;
|
line-height: 13px;
|
||||||
padding: 5px 8px;
|
padding: 5px 8px;
|
||||||
}
|
}
|
||||||
.sidebar-header-button:not(:first-child) {
|
|
||||||
|
.sidebar-header-button, /* Deprecated -> red-ui-sidebar-header-button */
|
||||||
|
.red-ui-sidebar-header-button:not(:first-child) {
|
||||||
border-left: none;
|
border-left: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-shade {
|
.red-ui-sidebar-shade {
|
||||||
@include shade;
|
@include shade;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@mixin sidebar-control {
|
@mixin red-ui-sidebar-control {
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: calc(50% - 26px);
|
top: calc(50% - 26px);
|
||||||
|
@ -114,14 +123,14 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-control-right {
|
.red-ui-sidebar-control-right {
|
||||||
@include sidebar-control;
|
@include red-ui-sidebar-control;
|
||||||
right: calc(100%);
|
right: calc(100%);
|
||||||
border-top-left-radius: 5px;
|
border-top-left-radius: 5px;
|
||||||
border-bottom-left-radius: 5px;
|
border-bottom-left-radius: 5px;
|
||||||
}
|
}
|
||||||
.sidebar-control-left {
|
.red-ui-sidebar-control-left {
|
||||||
@include sidebar-control;
|
@include red-ui-sidebar-control;
|
||||||
left: calc(100%);
|
left: calc(100%);
|
||||||
border-top-right-radius: 5px;
|
border-top-right-radius: 5px;
|
||||||
border-bottom-right-radius: 5px;
|
border-bottom-right-radius: 5px;
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
**/
|
**/
|
||||||
|
|
||||||
.sidebar-node-config {
|
.red-ui-sidebar-node-config {
|
||||||
position: relative;
|
position: relative;
|
||||||
background: #f3f3f3;
|
background: #f3f3f3;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
|
@ -52,14 +52,9 @@
|
||||||
</div>
|
</div>
|
||||||
<div id="editor-stack"></div>
|
<div id="editor-stack"></div>
|
||||||
<div id="red-ui-palette"></div>
|
<div id="red-ui-palette"></div>
|
||||||
<div id="sidebar">
|
<div id="red-ui-sidebar"></div>
|
||||||
<ul id="sidebar-tabs"></ul>
|
|
||||||
<div id="sidebar-content"></div>
|
|
||||||
<div id="sidebar-footer" class="red-ui-component-footer"></div>
|
|
||||||
<div id="sidebar-shade" class="hide"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="sidebar-separator"></div>
|
<div id="red-ui-sidebar-separator"></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div id="full-shade" class="hide"></div>
|
<div id="full-shade" class="hide"></div>
|
||||||
|
|
|
@ -40,16 +40,16 @@ RED.debug = (function() {
|
||||||
config = _config;
|
config = _config;
|
||||||
|
|
||||||
var content = $("<div>").css({"position":"relative","height":"100%"});
|
var content = $("<div>").css({"position":"relative","height":"100%"});
|
||||||
var toolbar = $('<div class="sidebar-header">'+
|
var toolbar = $('<div class="red-ui-sidebar-header">'+
|
||||||
'<span class="button-group"><a id="debug-tab-filter" class="sidebar-header-button" href="#"><i class="fa fa-filter"></i> <span></span></a></span>'+
|
'<span class="button-group"><a id="debug-tab-filter" class="red-ui-sidebar-header-button" href="#"><i class="fa fa-filter"></i> <span></span></a></span>'+
|
||||||
'<span class="button-group"><a id="debug-tab-clear" class="sidebar-header-button" href="#" data-i18n="[title]node-red:debug.sidebar.clearLog"><i class="fa fa-trash"></i></a></span></div>').appendTo(content);
|
'<span class="button-group"><a id="debug-tab-clear" class="red-ui-sidebar-header-button" href="#" data-i18n="[title]node-red:debug.sidebar.clearLog"><i class="fa fa-trash"></i></a></span></div>').appendTo(content);
|
||||||
|
|
||||||
var footerToolbar = $('<div>'+
|
var footerToolbar = $('<div>'+
|
||||||
// '<span class="button-group">'+
|
// '<span class="button-group">'+
|
||||||
// '<a class="sidebar-footer-button-toggle text-button selected" id="debug-tab-view-list" href="#"><span data-i18n="">list</span></a>'+
|
// '<a class="red-ui-footer-button-toggle text-button selected" id="debug-tab-view-list" href="#"><span data-i18n="">list</span></a>'+
|
||||||
// '<a class="sidebar-footer-button-toggle text-button" id="debug-tab-view-table" href="#"><span data-i18n="">table</span></a> '+
|
// '<a class="red-ui-footer-button-toggle text-button" id="debug-tab-view-table" href="#"><span data-i18n="">table</span></a> '+
|
||||||
// '</span>'+
|
// '</span>'+
|
||||||
'<span class="button-group"><a id="debug-tab-open" class="sidebar-footer-button" href="#" data-i18n="[title]node-red:debug.sidebar.openWindow"><i class="fa fa-desktop"></i></a></span> ' +
|
'<span class="button-group"><a id="debug-tab-open" class="red-ui-footer-button" href="#" data-i18n="[title]node-red:debug.sidebar.openWindow"><i class="fa fa-desktop"></i></a></span> ' +
|
||||||
'</div>');
|
'</div>');
|
||||||
|
|
||||||
messageList = $('<div class="debug-content debug-content-list"/>').appendTo(content);
|
messageList = $('<div class="debug-content debug-content-list"/>').appendTo(content);
|
||||||
|
@ -59,9 +59,9 @@ RED.debug = (function() {
|
||||||
var filterDialog = $('<div class="debug-filter-box hide">'+
|
var filterDialog = $('<div class="debug-filter-box hide">'+
|
||||||
'<div class="debug-filter-row">'+
|
'<div class="debug-filter-row">'+
|
||||||
'<span class="button-group">'+
|
'<span class="button-group">'+
|
||||||
'<a class="sidebar-header-button-toggle debug-tab-filter-option selected" id="debug-tab-filterAll" href="#"><span data-i18n="node-red:debug.sidebar.filterAll"></span></a>'+
|
'<a class="red-ui-sidebar-header-button-toggle debug-tab-filter-option selected" id="debug-tab-filterAll" href="#"><span data-i18n="node-red:debug.sidebar.filterAll"></span></a>'+
|
||||||
'<a class="sidebar-header-button-toggle debug-tab-filter-option" id="debug-tab-filterSelected" href="#"><span data-i18n="node-red:debug.sidebar.filterSelected"></span></a>'+
|
'<a class="red-ui-sidebar-header-button-toggle debug-tab-filter-option" id="debug-tab-filterSelected" href="#"><span data-i18n="node-red:debug.sidebar.filterSelected"></span></a>'+
|
||||||
'<a class="sidebar-header-button-toggle debug-tab-filter-option" id="debug-tab-filterCurrent" href="#"><span data-i18n="node-red:debug.sidebar.filterCurrent"></span></a> '+
|
'<a class="red-ui-sidebar-header-button-toggle debug-tab-filter-option" id="debug-tab-filterCurrent" href="#"><span data-i18n="node-red:debug.sidebar.filterCurrent"></span></a> '+
|
||||||
'</span>'+
|
'</span>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'</div>').appendTo(toolbar);//content);
|
'</div>').appendTo(toolbar);//content);
|
||||||
|
|
Loading…
Reference in New Issue