frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Namespace all palette css

Browse Source
This commit is contained in:
Nick O'Leary 2019-04-29 22:38:14 +01:00
parent 10c818474c
commit a2632fdcc8
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
27 changed files with 192 additions and 202 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/node_modules/@node-red/editor-client/src/js/red.js vendored
View File

@ -115,9 +115,9 @@ var RED = (function() {
var stepConfig = function() { var stepConfig = function() {
if (configs.length === 0) { if (configs.length === 0) {
$("body").i18n(); $("body").i18n();
$("#palette > .palette-spinner").hide(); $("#red-ui-palette > .red-ui-palette-spinner").hide();
$(".palette-scroll").removeClass("hide"); $(".red-ui-palette-scroll").removeClass("hide");
$("#palette-search").removeClass("hide"); $("#red-ui-palette-search").removeClass("hide");
loadFlows(function() { loadFlows(function() {
if (RED.settings.theme("projects.enabled",false)) { if (RED.settings.theme("projects.enabled",false)) {
RED.projects.refresh(function(activeProject) { RED.projects.refresh(function(activeProject) {

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

@ -45,11 +45,11 @@ RED.stack = (function() {
return { return {
add: function(entry) { add: function(entry) {
entries.push(entry); entries.push(entry);
entry.container = $('<div class="palette-category">').appendTo(container); entry.container = $('<div class="red-ui-palette-category">').appendTo(container);
if (!visible) { if (!visible) {
entry.container.hide(); entry.container.hide();
} }
var header = $('<div class="palette-header"></div>').appendTo(entry.container); var header = $('<div class="red-ui-palette-header"></div>').appendTo(entry.container);
entry.header = header; entry.header = header;
entry.contentWrap = $('<div></div>',{style:"position:relative"}).appendTo(entry.container); entry.contentWrap = $('<div></div>',{style:"position:relative"}).appendTo(entry.container);
if (options.fill) { if (options.fill) {

8
packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js vendored
View File

@ -273,7 +273,7 @@ RED.deploy = (function() {
deployInflight = true; deployInflight = true;
$("#header-shade").show(); $("#header-shade").show();
$("#editor-shade").show(); $("#editor-shade").show();
$("#palette-shade").show(); $("#red-ui-palette-shade").show();
$("#sidebar-shade").show(); $("#sidebar-shade").show();
$.ajax({ $.ajax({
@ -308,7 +308,7 @@ RED.deploy = (function() {
$(".deploy-button-spinner").hide(); $(".deploy-button-spinner").hide();
$("#header-shade").hide(); $("#header-shade").hide();
$("#editor-shade").hide(); $("#editor-shade").hide();
$("#palette-shade").hide(); $("#red-ui-palette-shade").hide();
$("#sidebar-shade").hide(); $("#sidebar-shade").hide();
},delta); },delta);
}); });
@ -424,7 +424,7 @@ RED.deploy = (function() {
deployInflight = true; deployInflight = true;
$("#header-shade").show(); $("#header-shade").show();
$("#editor-shade").show(); $("#editor-shade").show();
$("#palette-shade").show(); $("#red-ui-palette-shade").show();
$("#sidebar-shade").show(); $("#sidebar-shade").show();
$.ajax({ $.ajax({
url:"flows", url:"flows",
@ -494,7 +494,7 @@ RED.deploy = (function() {
$(".deploy-button-spinner").hide(); $(".deploy-button-spinner").hide();
$("#header-shade").hide(); $("#header-shade").hide();
$("#editor-shade").hide(); $("#editor-shade").hide();
$("#palette-shade").hide(); $("#red-ui-palette-shade").hide();
$("#sidebar-shade").hide(); $("#sidebar-shade").hide();
},delta); },delta);
}); });

2
packages/node_modules/@node-red/editor-client/src/js/ui/diff.js vendored
View File

@ -497,7 +497,7 @@ RED.diff = (function() {
} }
nodeDiv.css('backgroundColor',colour); nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, false); RED.utils.createIconElement(icon_url, iconContainer, false);
return nodeDiv; return nodeDiv;

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

@ -913,7 +913,7 @@ RED.editor = (function() {
var icon_url = RED.settings.apiRootUrl+"icons/"+moduleName+"/"+icon; var icon_url = RED.settings.apiRootUrl+"icons/"+moduleName+"/"+icon;
iconDiv.data('icon',icon_url); iconDiv.data('icon',icon_url);
nodeDiv.css('backgroundColor',colour); nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true); RED.utils.createIconElement(icon_url, iconContainer, true);
if (iconPath.module === moduleName && iconPath.file === icon) { if (iconPath.module === moduleName && iconPath.file === icon) {
@ -983,7 +983,7 @@ RED.editor = (function() {
var colour = RED.utils.getNodeColor(node.type, node._def); var colour = RED.utils.getNodeColor(node.type, node._def);
var icon_url = RED.utils.getNodeIcon(node._def,node); var icon_url = RED.utils.getNodeIcon(node._def,node);
nodeDiv.css('backgroundColor',colour); nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true); RED.utils.createIconElement(icon_url, iconContainer, true);
iconButton.on("click", function(e) { iconButton.on("click", function(e) {

8
packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js vendored
View File

@ -580,7 +580,7 @@ RED.palette.editor = (function() {
content: modulesTab content: modulesTab
}) })
var filterDiv = $('<div>',{class:"palette-search"}).appendTo(modulesTab); var filterDiv = $('<div>',{class:"red-ui-palette-search"}).appendTo(modulesTab);
filterInput = $('<input type="text" data-i18n="[placeholder]palette.filter"></input>') filterInput = $('<input type="text" data-i18n="[placeholder]palette.filter"></input>')
.appendTo(filterDiv) .appendTo(filterDiv)
.searchBox({ .searchBox({
@ -643,7 +643,7 @@ RED.palette.editor = (function() {
var enableButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.disableall')).appendTo(buttonGroup); var enableButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.disableall')).appendTo(buttonGroup);
var contentRow = $('<div>',{class:"palette-module-content"}).appendTo(container); var contentRow = $('<div>',{class:"palette-module-content"}).appendTo(container);
var shade = $('<div class="palette-module-shade hide"><img src="red/images/spin.svg" class="palette-spinner"/></div>').appendTo(container); var shade = $('<div class="palette-module-shade hide"><img src="red/images/spin.svg" class="red-ui-palette-spinner"/></div>').appendTo(container);
object.elements = { object.elements = {
updateButton: updateButton, updateButton: updateButton,
@ -736,7 +736,7 @@ RED.palette.editor = (function() {
var toolBar = $('<div>',{class:"palette-editor-toolbar"}).appendTo(installTab); var toolBar = $('<div>',{class:"palette-editor-toolbar"}).appendTo(installTab);
var searchDiv = $('<div>',{class:"palette-search"}).appendTo(installTab); var searchDiv = $('<div>',{class:"red-ui-palette-search"}).appendTo(installTab);
searchInput = $('<input type="text" data-i18n="[placeholder]palette.search"></input>') searchInput = $('<input type="text" data-i18n="[placeholder]palette.search"></input>')
.appendTo(searchDiv) .appendTo(searchDiv)
.searchBox({ .searchBox({
@ -875,7 +875,7 @@ RED.palette.editor = (function() {
} }
}); });
$('<div id="palette-module-install-shade" class="palette-module-shade hide"><div class="palette-module-shade-status"></div><img src="red/images/spin.svg" class="palette-spinner"/></div>').appendTo(installTab); $('<div id="palette-module-install-shade" class="palette-module-shade hide"><div class="palette-module-shade-status"></div><img src="red/images/spin.svg" class="red-ui-palette-spinner"/></div>').appendTo(installTab);
} }
function update(entry,version,container,done) { function update(entry,version,container,done) {
if (RED.settings.theme('palette.editable') === false) { if (RED.settings.theme('palette.editable') === false) {

172
packages/node_modules/@node-red/editor-client/src/js/ui/palette.js vendored
View File

@ -23,43 +23,43 @@ RED.palette = (function() {
var sidebarControls; var sidebarControls;
function createCategory(originalCategory,rootCategory,category,ns) { function createCategory(originalCategory,rootCategory,category,ns) {
if ($("#palette-base-category-"+rootCategory).length === 0) { if ($("#red-ui-palette-base-category-"+rootCategory).length === 0) {
createCategoryContainer(originalCategory,rootCategory, ns+":palette.label."+rootCategory); createCategoryContainer(originalCategory,rootCategory, ns+":palette.label."+rootCategory);
} }
$("#palette-container-"+rootCategory).show(); $("#red-ui-palette-container-"+rootCategory).show();
if ($("#palette-"+category).length === 0) { if ($("#red-ui-palette-"+category).length === 0) {
$("#palette-base-category-"+rootCategory).append('<div id="palette-'+category+'"></div>'); $("#red-ui-palette-base-category-"+rootCategory).append('<div id="red-ui-palette-'+category+'"></div>');
} }
} }
function createCategoryContainer(originalCategory,category, labelId) { function createCategoryContainer(originalCategory,category, labelId) {
var label = RED._(labelId, {defaultValue:category}); var label = RED._(labelId, {defaultValue:category});
label = (label || category).replace(/_/g, " "); label = (label || category).replace(/_/g, " ");
var catDiv = $('<div id="palette-container-'+category+'" class="palette-category palette-close hide">'+ var catDiv = $('<div id="red-ui-palette-container-'+category+'" class="red-ui-palette-category palette-close hide">'+
'<div id="palette-header-'+category+'" class="palette-header"><i class="expanded fa fa-angle-down"></i><span>'+label+'</span></div>'+ '<div id="red-ui-palette-header-'+category+'" class="red-ui-palette-header"><i class="expanded fa fa-angle-down"></i><span>'+label+'</span></div>'+
'<div class="palette-content" id="palette-base-category-'+category+'">'+ '<div class="red-ui-palette-content" id="red-ui-palette-base-category-'+category+'">'+
'<div id="palette-'+category+'-input"></div>'+ '<div id="red-ui-palette-'+category+'-input"></div>'+
'<div id="palette-'+category+'-output"></div>'+ '<div id="red-ui-palette-'+category+'-output"></div>'+
'<div id="palette-'+category+'-function"></div>'+ '<div id="red-ui-palette-'+category+'-function"></div>'+
'</div>'+ '</div>'+
'</div>').appendTo("#palette-container"); '</div>').appendTo("#red-ui-palette-container");
catDiv.data('category',originalCategory); catDiv.data('category',originalCategory);
catDiv.data('label',label); catDiv.data('label',label);
categoryContainers[category] = { categoryContainers[category] = {
container: catDiv, container: catDiv,
close: function() { close: function() {
catDiv.removeClass("palette-open"); catDiv.removeClass("red-ui-palette-open");
catDiv.addClass("palette-closed"); catDiv.addClass("red-ui-palette-closed");
$("#palette-base-category-"+category).slideUp(); $("#red-ui-palette-base-category-"+category).slideUp();
$("#palette-header-"+category+" i").removeClass("expanded"); $("#red-ui-palette-header-"+category+" i").removeClass("expanded");
}, },
open: function() { open: function() {
catDiv.addClass("palette-open"); catDiv.addClass("red-ui-palette-open");
catDiv.removeClass("palette-closed"); catDiv.removeClass("red-ui-palette-closed");
$("#palette-base-category-"+category).slideDown(); $("#red-ui-palette-base-category-"+category).slideDown();
$("#palette-header-"+category+" i").addClass("expanded"); $("#red-ui-palette-header-"+category+" i").addClass("expanded");
}, },
toggle: function() { toggle: function() {
if (catDiv.hasClass("palette-open")) { if (catDiv.hasClass("red-ui-palette-open")) {
categoryContainers[category].close(); categoryContainers[category].close();
} else { } else {
categoryContainers[category].open(); categoryContainers[category].open();
@ -67,7 +67,7 @@ RED.palette = (function() {
} }
}; };
$("#palette-header-"+category).on('click', function(e) { $("#red-ui-palette-header-"+category).on('click', function(e) {
categoryContainers[category].toggle(); categoryContainers[category].toggle();
}); });
} }
@ -85,17 +85,17 @@ RED.palette = (function() {
var displayLines = []; var displayLines = [];
var currentLine = words[0]; var currentLine = words[0];
var currentLineWidth = RED.view.calculateTextWidth(currentLine, "palette_label", 0); var currentLineWidth = RED.view.calculateTextWidth(currentLine, "red-ui-palette-label", 0);
for (var i=1;i<words.length;i++) { for (var i=1;i<words.length;i++) {
var newWidth = RED.view.calculateTextWidth(currentLine+" "+words[i], "palette_label", 0); var newWidth = RED.view.calculateTextWidth(currentLine+" "+words[i], "red-ui-palette-label", 0);
if (newWidth < nodeWidth) { if (newWidth < nodeWidth) {
currentLine += " "+words[i]; currentLine += " "+words[i];
currentLineWidth = newWidth; currentLineWidth = newWidth;
} else { } else {
displayLines.push(currentLine); displayLines.push(currentLine);
currentLine = words[i]; currentLine = words[i];
currentLineWidth = RED.view.calculateTextWidth(currentLine, "palette_label", 0); currentLineWidth = RED.view.calculateTextWidth(currentLine, "red-ui-palette-label", 0);
} }
} }
displayLines.push(currentLine); displayLines.push(currentLine);
@ -104,10 +104,10 @@ RED.palette = (function() {
var multiLineNodeHeight = 8+(lineHeight*displayLines.length); var multiLineNodeHeight = 8+(lineHeight*displayLines.length);
el.css({height:multiLineNodeHeight+"px"}); el.css({height:multiLineNodeHeight+"px"});
var labelElement = el.find(".palette_label"); var labelElement = el.find(".red-ui-palette-label");
labelElement.html(lines).attr('dir', RED.text.bidi.resolveBaseTextDir(lines)); labelElement.html(lines).attr('dir', RED.text.bidi.resolveBaseTextDir(lines));
el.find(".palette_port").css({top:(multiLineNodeHeight/2-5)+"px"}); el.find(".red-ui-palette-port").css({top:(multiLineNodeHeight/2-5)+"px"});
var popOverContent; var popOverContent;
try { try {
@ -145,7 +145,7 @@ RED.palette = (function() {
function setIcon(element,sf) { function setIcon(element,sf) {
var icon_url = RED.utils.getNodeIcon(sf._def); var icon_url = RED.utils.getNodeIcon(sf._def);
var iconContainer = element.find(".palette_icon_container"); var iconContainer = element.find(".red-ui-palette-icon-container");
RED.utils.createIconElement(icon_url, iconContainer, true); RED.utils.createIconElement(icon_url, iconContainer, true);
} }
@ -155,7 +155,7 @@ RED.palette = (function() {
function addNodeType(nt,def) { function addNodeType(nt,def) {
var nodeTypeId = escapeNodeType(nt); var nodeTypeId = escapeNodeType(nt);
if ($("#palette_node_"+nodeTypeId).length) { if ($("#red-ui-palette-node_"+nodeTypeId).length) {
return; return;
} }
if (exclusion.indexOf(def.category)===-1) { if (exclusion.indexOf(def.category)===-1) {
@ -165,7 +165,7 @@ RED.palette = (function() {
var rootCategory = category.split("-")[0]; var rootCategory = category.split("-")[0];
var d = document.createElement("div"); var d = document.createElement("div");
d.id = "palette_node_"+nodeTypeId; d.id = "red-ui-palette-node_"+nodeTypeId;
d.type = nt; d.type = nt;
var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1]; var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1];
@ -178,17 +178,17 @@ RED.palette = (function() {
} }
$('<div/>', { $('<div/>', {
class: "palette_label" class: "red-ui-palette-label"
+ (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " palette_label_right" : "") + (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " red-ui-palette-label-right" : "")
}).appendTo(d); }).appendTo(d);
d.className="palette_node"; d.className="red-ui-palette-node";
if (def.icon) { if (def.icon) {
var icon_url = RED.utils.getNodeIcon(def); var icon_url = RED.utils.getNodeIcon(def);
var iconContainer = $('<div/>', { var iconContainer = $('<div/>', {
class: "palette_icon_container" class: "red-ui-palette-icon-container"
+ (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " palette_icon_container_right" : "") + (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " red-ui-palette-icon-container-right" : "")
}).appendTo(d); }).appendTo(d);
RED.utils.createIconElement(icon_url, iconContainer, true); RED.utils.createIconElement(icon_url, iconContainer, true);
} }
@ -197,19 +197,19 @@ RED.palette = (function() {
if (def.outputs > 0) { if (def.outputs > 0) {
var portOut = document.createElement("div"); var portOut = document.createElement("div");
portOut.className = "palette_port palette_port_output"; portOut.className = "red-ui-palette-port red-ui-palette-port-output";
d.appendChild(portOut); d.appendChild(portOut);
} }
if (def.inputs > 0) { if (def.inputs > 0) {
var portIn = document.createElement("div"); var portIn = document.createElement("div");
portIn.className = "palette_port palette_port_input"; portIn.className = "red-ui-palette-port red-ui-palette-port-input";
d.appendChild(portIn); d.appendChild(portIn);
} }
createCategory(def.category,rootCategory,category,(coreCategories.indexOf(rootCategory) !== -1)?"node-red":def.set.id); createCategory(def.category,rootCategory,category,(coreCategories.indexOf(rootCategory) !== -1)?"node-red":def.set.id);
$("#palette-"+category).append(d); $("#red-ui-palette-"+category).append(d);
$(d).data('category',rootCategory); $(d).data('category',rootCategory);
@ -258,8 +258,8 @@ RED.palette = (function() {
revertDuration: 300, revertDuration: 300,
containment:'#main-container', containment:'#main-container',
start: function() { start: function() {
paletteWidth = $("#palette").width(); paletteWidth = $("#red-ui-palette").width();
paletteTop = $("#palette").parent().position().top + $("#palette-container").position().top; paletteTop = $("#red-ui-palette").parent().position().top + $("#red-ui-palette-container").position().top;
RED.view.focus(); RED.view.focus();
}, },
stop: function() { d3.select('.link_splice').classed('link_splice',false); if (spliceTimer) { clearTimeout(spliceTimer); spliceTimer = null;}}, stop: function() { d3.select('.link_splice').classed('link_splice',false); if (spliceTimer) { clearTimeout(spliceTimer); spliceTimer = null;}},
@ -338,8 +338,8 @@ RED.palette = (function() {
} }
setLabel(nt,$(d),label,nodeInfo); setLabel(nt,$(d),label,nodeInfo);
var categoryNode = $("#palette-container-"+rootCategory); var categoryNode = $("#red-ui-palette-container-"+rootCategory);
if (categoryNode.find(".palette_node").length === 1) { if (categoryNode.find(".red-ui-palette-node").length === 1) {
categoryContainers[rootCategory].open(); categoryContainers[rootCategory].open();
} }
@ -348,12 +348,12 @@ RED.palette = (function() {
function removeNodeType(nt) { function removeNodeType(nt) {
var nodeTypeId = escapeNodeType(nt); var nodeTypeId = escapeNodeType(nt);
var paletteNode = $("#palette_node_"+nodeTypeId); var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
var categoryNode = paletteNode.closest(".palette-category"); var categoryNode = paletteNode.closest(".red-ui-palette-category");
paletteNode.remove(); paletteNode.remove();
if (categoryNode.find(".palette_node").length === 0) { if (categoryNode.find(".red-ui-palette-node").length === 0) {
if (categoryNode.find("i").hasClass("expanded")) { if (categoryNode.find("i").hasClass("expanded")) {
categoryNode.find(".palette-content").slideToggle(); categoryNode.find(".red-ui-palette-content").slideToggle();
categoryNode.find("i").toggleClass("expanded"); categoryNode.find("i").toggleClass("expanded");
} }
} }
@ -361,10 +361,10 @@ RED.palette = (function() {
function hideNodeType(nt) { function hideNodeType(nt) {
var nodeTypeId = escapeNodeType(nt); var nodeTypeId = escapeNodeType(nt);
var paletteNode = $("#palette_node_"+nodeTypeId); var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
paletteNode.hide(); paletteNode.hide();
var categoryNode = paletteNode.closest(".palette-category"); var categoryNode = paletteNode.closest(".red-ui-palette-category");
var cl = categoryNode.find(".palette_node"); var cl = categoryNode.find(".red-ui-palette-node");
var c = 0; var c = 0;
for (var i = 0; i < cl.length; i++) { for (var i = 0; i < cl.length; i++) {
if ($(cl[i]).css('display') === 'none') { c += 1; } if ($(cl[i]).css('display') === 'none') { c += 1; }
@ -374,32 +374,32 @@ RED.palette = (function() {
function showNodeType(nt) { function showNodeType(nt) {
var nodeTypeId = escapeNodeType(nt); var nodeTypeId = escapeNodeType(nt);
var paletteNode = $("#palette_node_"+nodeTypeId); var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
var categoryNode = paletteNode.closest(".palette-category"); var categoryNode = paletteNode.closest(".red-ui-palette-category");
categoryNode.show(); categoryNode.show();
paletteNode.show(); paletteNode.show();
} }
function refreshNodeTypes() { function refreshNodeTypes() {
RED.nodes.eachSubflow(function(sf) { RED.nodes.eachSubflow(function(sf) {
var paletteNode = $("#palette_node_subflow_"+sf.id.replace(".","_")); var paletteNode = $("#red-ui-palette-node_subflow_"+sf.id.replace(".","_"));
var portInput = paletteNode.find(".palette_port_input"); var portInput = paletteNode.find(".red-ui-palette-port-input");
var portOutput = paletteNode.find(".palette_port_output"); var portOutput = paletteNode.find(".red-ui-palette-port-output");
var paletteLabel = paletteNode.find(".palette_label"); var paletteLabel = paletteNode.find(".red-ui-palette-label");
paletteLabel.attr("class","palette_label" paletteLabel.attr("class","red-ui-palette-label"
+ (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " palette_label_right" : "") + (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " red-ui-palette-label-right" : "")
); );
var paletteIconContainer = paletteNode.find(".palette_icon_container"); var paletteIconContainer = paletteNode.find(".red-ui-palette-icon-container");
paletteIconContainer.attr("class","palette_icon_container" paletteIconContainer.attr("class","red-ui-palette-icon-container"
+ (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " palette_icon_container_right" : "") + (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " red-ui-palette-icon-container-right" : "")
); );
if (portInput.length === 0 && sf.in.length > 0) { if (portInput.length === 0 && sf.in.length > 0) {
var portIn = document.createElement("div"); var portIn = document.createElement("div");
portIn.className = "palette_port palette_port_input"; portIn.className = "red-ui-palette-port red-ui-palette-port-input";
paletteNode.append(portIn); paletteNode.append(portIn);
} else if (portInput.length !== 0 && sf.in.length === 0) { } else if (portInput.length !== 0 && sf.in.length === 0) {
portInput.remove(); portInput.remove();
@ -407,7 +407,7 @@ RED.palette = (function() {
if (portOutput.length === 0 && sf.out.length > 0) { if (portOutput.length === 0 && sf.out.length > 0) {
var portOut = document.createElement("div"); var portOut = document.createElement("div");
portOut.className = "palette_port palette_port_output"; portOut.className = "red-ui-palette-port red-ui-palette-port-output";
paletteNode.append(portOut); paletteNode.append(portOut);
} else if (portOutput.length !== 0 && sf.out.length === 0) { } else if (portOutput.length !== 0 && sf.out.length === 0) {
portOutput.remove(); portOutput.remove();
@ -421,17 +421,17 @@ RED.palette = (function() {
var category = newCategory.replace(/ /g,"_"); var category = newCategory.replace(/ /g,"_");
createCategory(newCategory,category,category,"node-red"); createCategory(newCategory,category,category,"node-red");
var currentCategoryNode = paletteNode.closest(".palette-category"); var currentCategoryNode = paletteNode.closest(".red-ui-palette-category");
var newCategoryNode = $("#palette-"+category); var newCategoryNode = $("#palette-"+category);
newCategoryNode.append(paletteNode); newCategoryNode.append(paletteNode);
if (newCategoryNode.find(".palette_node").length === 1) { if (newCategoryNode.find(".red-ui-palette-node").length === 1) {
categoryContainers[category].open(); categoryContainers[category].open();
} }
paletteNode.data('category',newCategory); paletteNode.data('category',newCategory);
if (currentCategoryNode.find(".palette_node").length === 0) { if (currentCategoryNode.find(".red-ui-palette-node").length === 0) {
if (currentCategoryNode.find("i").hasClass("expanded")) { if (currentCategoryNode.find("i").hasClass("expanded")) {
currentCategoryNode.find(".palette-content").slideToggle(); currentCategoryNode.find(".red-ui-palette-content").slideToggle();
currentCategoryNode.find("i").toggleClass("expanded"); currentCategoryNode.find("i").toggleClass("expanded");
} }
} }
@ -444,8 +444,8 @@ RED.palette = (function() {
function filterChange(val) { function filterChange(val) {
var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),'i'); var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),'i');
$("#palette-container .palette_node").each(function(i,el) { $("#red-ui-palette-container .red-ui-palette-node").each(function(i,el) {
var currentLabel = $(el).find(".palette_label").text(); var currentLabel = $(el).find(".red-ui-palette-label").text();
if (val === "" || re.test(el.id) || re.test(currentLabel)) { if (val === "" || re.test(el.id) || re.test(currentLabel)) {
$(this).show(); $(this).show();
} else { } else {
@ -456,7 +456,7 @@ RED.palette = (function() {
for (var category in categoryContainers) { for (var category in categoryContainers) {
if (categoryContainers.hasOwnProperty(category)) { if (categoryContainers.hasOwnProperty(category)) {
if (categoryContainers[category].container if (categoryContainers[category].container
.find(".palette_node") .find(".red-ui-palette-node")
.filter(function() { return $(this).css('display') !== 'none'}).length === 0) { .filter(function() { return $(this).css('display') !== 'none'}).length === 0) {
categoryContainers[category].close(); categoryContainers[category].close();
} else { } else {
@ -468,6 +468,13 @@ RED.palette = (function() {
function init() { function init() {
$('<img src="red/images/spin.svg" class="red-ui-palette-spinner hide"/>').appendTo("#red-ui-palette");
$('<div id="red-ui-palette-search" class="red-ui-palette-search hide"><input type="text" data-i18n="[placeholder]palette.filter"></input></div>').appendTo("#red-ui-palette");
$('<div id="red-ui-palette-container" class="red-ui-palette-scroll hide"></div>').appendTo("#red-ui-palette");
$('<div class="red-ui-component-footer"></div>').appendTo("#red-ui-palette");
$('<div id="red-ui-palette-shade" class="hide"></div>').appendTo("#red-ui-palette");
RED.events.on('registry:node-type-added', function(nodeType) { RED.events.on('registry:node-type-added', function(nodeType) {
var def = RED.nodes.getType(nodeType); var def = RED.nodes.getType(nodeType);
addNodeType(nodeType,def); addNodeType(nodeType,def);
@ -508,25 +515,26 @@ RED.palette = (function() {
} }
}); });
$("#palette > .palette-spinner").show(); $("#red-ui-palette > .red-ui-palette-spinner").show();
$("#palette-search input").searchBox({
$("#red-ui-palette-search input").searchBox({
delay: 100, delay: 100,
change: function() { change: function() {
filterChange($(this).val()); filterChange($(this).val());
} }
}) })
sidebarControls = $('<div class="sidebar-control-left"><i class="fa fa-chevron-left"</div>').appendTo($("#palette")); sidebarControls = $('<div class="sidebar-control-left"><i class="fa fa-chevron-left"</div>').appendTo($("#red-ui-palette"));
RED.popover.tooltip(sidebarControls,RED._("keyboard.togglePalette"),"core:toggle-palette"); RED.popover.tooltip(sidebarControls,RED._("keyboard.togglePalette"),"core:toggle-palette");
sidebarControls.on("click", function() { sidebarControls.on("click", function() {
RED.menu.toggleSelected("menu-item-palette"); RED.menu.toggleSelected("menu-item-palette");
}) })
$("#palette").on("mouseenter", function() { $("#red-ui-palette").on("mouseenter", function() {
sidebarControls.toggle("slide", { direction: "left" }, 200); sidebarControls.toggle("slide", { direction: "left" }, 200);
}) })
$("#palette").on("mouseleave", function() { $("#red-ui-palette").on("mouseleave", function() {
sidebarControls.hide(); sidebarControls.hide();
}) })
@ -546,7 +554,10 @@ RED.palette = (function() {
createCategoryContainer(category, category, "palette.label."+category); createCategoryContainer(category, category, "palette.label."+category);
}); });
$("#palette-collapse-all").on("click", function(e) {
var paletteFooterButtons = $('<span class="button-group"></span>').appendTo("#red-ui-palette .red-ui-component-footer");
var paletteCollapseAll = $('<button type="button" class="red-ui-footer-button"><i class="fa fa-angle-double-up"></i></button>').appendTo(paletteFooterButtons);
paletteCollapseAll.on("click", function(e) {
e.preventDefault(); e.preventDefault();
for (var cat in categoryContainers) { for (var cat in categoryContainers) {
if (categoryContainers.hasOwnProperty(cat)) { if (categoryContainers.hasOwnProperty(cat)) {
@ -554,9 +565,10 @@ RED.palette = (function() {
} }
} }
}); });
RED.popover.tooltip($("#palette-collapse-all"),RED._('palette.actions.collapse-all')); RED.popover.tooltip(paletteCollapseAll,RED._('palette.actions.collapse-all'));
$("#palette-expand-all").on("click", function(e) { var paletteExpandAll = $('<button type="button" class="red-ui-footer-button"><i class="fa fa-angle-double-down"></i></button>').appendTo(paletteFooterButtons);
paletteExpandAll.on("click", function(e) {
e.preventDefault(); e.preventDefault();
for (var cat in categoryContainers) { for (var cat in categoryContainers) {
if (categoryContainers.hasOwnProperty(cat)) { if (categoryContainers.hasOwnProperty(cat)) {
@ -564,7 +576,7 @@ RED.palette = (function() {
} }
} }
}); });
RED.popover.tooltip($("#palette-expand-all"),RED._('palette.actions.expand-all')); RED.popover.tooltip(paletteExpandAll,RED._('palette.actions.expand-all'));
RED.actions.add("core:toggle-palette", function(state) { RED.actions.add("core:toggle-palette", function(state) {
if (state === undefined) { if (state === undefined) {
@ -576,11 +588,11 @@ RED.palette = (function() {
} }
function togglePalette(state) { function togglePalette(state) {
if (!state) { if (!state) {
$("#main-container").addClass("palette-closed"); $("#main-container").addClass("red-ui-palette-closed");
sidebarControls.hide(); sidebarControls.hide();
sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left"); sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
} else { } else {
$("#main-container").removeClass("palette-closed"); $("#main-container").removeClass("red-ui-palette-closed");
sidebarControls.find("i").removeClass("fa-chevron-right").addClass("fa-chevron-left"); sidebarControls.find("i").removeClass("fa-chevron-right").addClass("fa-chevron-left");
} }
setTimeout(function() { $(window).trigger("resize"); } ,200); setTimeout(function() { $(window).trigger("resize"); } ,200);
@ -589,7 +601,7 @@ RED.palette = (function() {
function getCategories() { function getCategories() {
var categories = []; var categories = [];
$("#palette-container .palette-category").each(function(i,d) { $("#red-ui-palette-container .red-ui-palette-category").each(function(i,d) {
categories.push({id:$(d).data('category'),label:$(d).data('label')}); categories.push({id:$(d).data('category'),label:$(d).data('label')});
}) })
return categories; return categories;

4
packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js vendored
View File

@ -2228,13 +2228,13 @@ RED.projects = (function() {
$(this).parent().find(".ui-dialog-titlebar-close").hide(); $(this).parent().find(".ui-dialog-titlebar-close").hide();
// $("#header-shade").show(); // $("#header-shade").show();
// $("#editor-shade").show(); // $("#editor-shade").show();
// $("#palette-shade").show(); // $("#red-ui-palette-shade").show();
// $("#sidebar-shade").show(); // $("#sidebar-shade").show();
}, },
close: function(e) { close: function(e) {
// $("#header-shade").hide(); // $("#header-shade").hide();
// $("#editor-shade").hide(); // $("#editor-shade").hide();
// $("#palette-shade").hide(); // $("#red-ui-palette-shade").hide();
// $("#sidebar-shade").hide(); // $("#sidebar-shade").hide();
} }
}); });

8
packages/node_modules/@node-red/editor-client/src/js/ui/search.js vendored
View File

@ -213,7 +213,7 @@ RED.search = (function() {
} }
nodeDiv.css('backgroundColor',colour); nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true); RED.utils.createIconElement(icon_url, iconContainer, true);
var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div); var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div);
@ -256,7 +256,7 @@ RED.search = (function() {
RED.keyboard.add("*","escape",function(){hide()}); RED.keyboard.add("*","escape",function(){hide()});
$("#header-shade").show(); $("#header-shade").show();
$("#editor-shade").show(); $("#editor-shade").show();
$("#palette-shade").show(); $("#red-ui-palette-shade").show();
$("#sidebar-shade").show(); $("#sidebar-shade").show();
$("#sidebar-separator").hide(); $("#sidebar-separator").hide();
indexWorkspace(); indexWorkspace();
@ -277,7 +277,7 @@ RED.search = (function() {
visible = false; visible = false;
$("#header-shade").hide(); $("#header-shade").hide();
$("#editor-shade").hide(); $("#editor-shade").hide();
$("#palette-shade").hide(); $("#red-ui-palette-shade").hide();
$("#sidebar-shade").hide(); $("#sidebar-shade").hide();
$("#sidebar-separator").show(); $("#sidebar-separator").show();
if (dialog !== null) { if (dialog !== null) {
@ -301,7 +301,7 @@ RED.search = (function() {
$("#header-shade").on('mousedown',hide); $("#header-shade").on('mousedown',hide);
$("#editor-shade").on('mousedown',hide); $("#editor-shade").on('mousedown',hide);
$("#palette-shade").on('mousedown',hide); $("#red-ui-palette-shade").on('mousedown',hide);
$("#sidebar-shade").on('mousedown',hide); $("#sidebar-shade").on('mousedown',hide);
} }

20
packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js vendored
View File

@ -44,7 +44,7 @@ RED.sidebar.config = (function() {
function getOrCreateCategory(name,parent,label) { function getOrCreateCategory(name,parent,label) {
name = name.replace(/\./i,"-"); name = name.replace(/\./i,"-");
if (!categories[name]) { if (!categories[name]) {
var container = $('<div class="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 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);
@ -52,7 +52,7 @@ RED.sidebar.config = (function() {
$('<span class="config-node-label" data-i18n="sidebar.config.'+name+'">').appendTo(header); $('<span class="config-node-label" data-i18n="sidebar.config.'+name+'">').appendTo(header);
} }
$('<span class="config-node-filter-info"></span>').appendTo(header); $('<span class="config-node-filter-info"></span>').appendTo(header);
category = $('<ul class="palette-content config-node-list"></ul>').appendTo(container); category = $('<ul class="red-ui-palette-content config-node-list"></ul>').appendTo(container);
container.i18n(); container.i18n();
var icon = header.find("i"); var icon = header.find("i");
var result = { var result = {
@ -139,11 +139,11 @@ RED.sidebar.config = (function() {
currentType = node.type; currentType = node.type;
} }
var entry = $('<li class="palette_node config_node palette_node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list); var entry = $('<li class="red-ui-palette-node config_node red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
entry.data('node',node.id); entry.data('node',node.id);
$('<div class="palette_label"></div>').text(label).appendTo(entry); $('<div class="red-ui-palette-label"></div>').text(label).appendTo(entry);
if (node._def.hasUsers !== false) { if (node._def.hasUsers !== false) {
var iconContainer = $('<div/>',{class:"palette_icon_container palette_icon_container_right"}).appendTo(entry); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container red-ui-palette-icon-container-right"}).appendTo(entry);
if (node.users.length === 0) { if (node.users.length === 0) {
iconContainer.text(0); iconContainer.text(0);
} else { } else {
@ -163,7 +163,7 @@ RED.sidebar.config = (function() {
if (e.metaKey) { if (e.metaKey) {
$(this).toggleClass("selected"); $(this).toggleClass("selected");
} else { } else {
$(content).find(".palette_node").removeClass("selected"); $(content).find(".red-ui-palette-node").removeClass("selected");
$(this).addClass("selected"); $(this).addClass("selected");
} }
RED.sidebar.info.refresh(node); RED.sidebar.info.refresh(node);
@ -246,11 +246,11 @@ RED.sidebar.config = (function() {
}); });
RED.actions.add("core:show-config-tab", function() {RED.sidebar.show('config')}); RED.actions.add("core:show-config-tab", function() {RED.sidebar.show('config')});
RED.actions.add("core:select-all-config-nodes", function() { RED.actions.add("core:select-all-config-nodes", function() {
$(content).find(".palette_node").addClass("selected"); $(content).find(".red-ui-palette-node").addClass("selected");
}) })
RED.actions.add("core:delete-config-selection", function() { RED.actions.add("core:delete-config-selection", function() {
var selectedNodes = []; var selectedNodes = [];
$(content).find(".palette_node.selected").each(function() { $(content).find(".red-ui-palette-node.selected").each(function() {
selectedNodes.push($(this).data('node')); selectedNodes.push($(this).data('node'));
}); });
if (selectedNodes.length > 0) { if (selectedNodes.length > 0) {
@ -296,7 +296,7 @@ RED.sidebar.config = (function() {
RED.events.on("view:selection-changed",function() { RED.events.on("view:selection-changed",function() {
$(content).find(".palette_node").removeClass("selected"); $(content).find(".red-ui-palette-node").removeClass("selected");
}); });
$("#workspace-config-node-collapse-all").on("click", function(e) { $("#workspace-config-node-collapse-all").on("click", function(e) {
@ -352,7 +352,7 @@ RED.sidebar.config = (function() {
$('#workspace-config-node-filter-all').trigger("click"); $('#workspace-config-node-filter-all').trigger("click");
id = id.replace(/\./g,"-"); id = id.replace(/\./g,"-");
setTimeout(function() { setTimeout(function() {
var node = $(".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 = $(".sidebar-node-config");

6
packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js vendored
View File

@ -268,12 +268,12 @@ RED.sidebar.info = (function() {
var container = propRow.children()[1]; var container = propRow.children()[1];
var div = $('<span>',{class:""}).appendTo(container); var div = $('<span>',{class:""}).appendTo(container);
var nodeDiv = $('<div>',{class:"palette_node palette_node_small"}).appendTo(div); var nodeDiv = $('<div>',{class:"red-ui-palette-node red-ui-palette-node-small"}).appendTo(div);
var colour = RED.utils.getNodeColor(configNode.type,configNode._def); var colour = RED.utils.getNodeColor(configNode.type,configNode._def);
var icon_url = RED.utils.getNodeIcon(configNode._def); var icon_url = RED.utils.getNodeIcon(configNode._def);
nodeDiv.css({'backgroundColor':colour, "cursor":"pointer"}); nodeDiv.css({'backgroundColor':colour, "cursor":"pointer"});
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
$('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer); $('<div/>',{class:"red-ui-palette-icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
var nodeContainer = $('<span></span>').css({"verticalAlign":"top","marginLeft":"6px"}).text(configLabel).appendTo(container); var nodeContainer = $('<span></span>').css({"verticalAlign":"top","marginLeft":"6px"}).text(configLabel).appendTo(container);
nodeDiv.on('dblclick',function() { nodeDiv.on('dblclick',function() {

4
packages/node_modules/@node-red/editor-client/src/js/ui/tray.js vendored
View File

@ -117,7 +117,7 @@ RED.tray = (function() {
function finishBuild() { function finishBuild() {
$("#header-shade").show(); $("#header-shade").show();
$("#editor-shade").show(); $("#editor-shade").show();
$("#palette-shade").show(); $("#red-ui-palette-shade").show();
$(".sidebar-shade").show(); $(".sidebar-shade").show();
tray.preferredWidth = Math.max(el.width(),500); tray.preferredWidth = Math.max(el.width(),500);
if (!options.maximized) { if (!options.maximized) {
@ -269,7 +269,7 @@ RED.tray = (function() {
if (stack.length === 0) { if (stack.length === 0) {
$("#header-shade").hide(); $("#header-shade").hide();
$("#editor-shade").hide(); $("#editor-shade").hide();
$("#palette-shade").hide(); $("#red-ui-palette-shade").hide();
$(".sidebar-shade").hide(); $(".sidebar-shade").hide();
RED.events.emit("editor:close"); RED.events.emit("editor:close");
RED.view.focus(); RED.view.focus();

2
packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js vendored
View File

@ -145,7 +145,7 @@ RED.typeSearch = (function() {
var icon_url = RED.utils.getNodeIcon(def); var icon_url = RED.utils.getNodeIcon(def);
nodeDiv.css('backgroundColor',colour); nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv); var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, false); RED.utils.createIconElement(icon_url, iconContainer, false);
if (def.inputs > 0) { if (def.inputs > 0) {

8
packages/node_modules/@node-red/editor-client/src/js/ui/utils.js vendored
View File

@ -923,12 +923,12 @@ RED.utils = (function() {
/** /**
* Create or update an icon element and append it to iconContainer. * Create or update an icon element and append it to iconContainer.
* @param iconUrl - Url of icon. * @param iconUrl - Url of icon.
* @param iconContainer - Icon container element with palette_icon_container class. * @param iconContainer - Icon container element with red-ui-palette-icon-container class.
* @param isLarge - Whether the icon size is large. * @param isLarge - Whether the icon size is large.
*/ */
function createIconElement(iconUrl, iconContainer, isLarge) { function createIconElement(iconUrl, iconContainer, isLarge) {
// Removes the previous icon when icon was changed. // Removes the previous icon when icon was changed.
var iconElement = iconContainer.find(".palette_icon"); var iconElement = iconContainer.find(".red-ui-palette-icon");
if (iconElement.length !== 0) { if (iconElement.length !== 0) {
iconElement.remove(); iconElement.remove();
} }
@ -944,13 +944,13 @@ RED.utils = (function() {
if (fontAwesomeUnicode) { if (fontAwesomeUnicode) {
var faIconElement = $('<i/>').appendTo(iconContainer); var faIconElement = $('<i/>').appendTo(iconContainer);
var faLarge = isLarge ? "fa-lg " : ""; var faLarge = isLarge ? "fa-lg " : "";
faIconElement.addClass("palette_icon_fa fa fa-fw " + faLarge + iconPath.file); faIconElement.addClass("red-ui-palette-icon-fa fa fa-fw " + faLarge + iconPath.file);
return; return;
} }
// If the specified name is not defined in font-awesome, show arrow-in icon. // If the specified name is not defined in font-awesome, show arrow-in icon.
iconUrl = RED.settings.apiRootUrl+"icons/node-red/arrow-in.png" iconUrl = RED.settings.apiRootUrl+"icons/node-red/arrow-in.png"
} }
var imageIconElement = $('<div/>',{class:"palette_icon"}).appendTo(iconContainer); var imageIconElement = $('<div/>',{class:"red-ui-palette-icon"}).appendTo(iconContainer);
imageIconElement.css("backgroundImage", "url("+iconUrl+")"); imageIconElement.css("backgroundImage", "url("+iconUrl+")");
} }

2
packages/node_modules/@node-red/editor-client/src/js/ui/view.js vendored
View File

@ -393,7 +393,7 @@ RED.view = (function() {
// Handle nodes dragged from the palette // Handle nodes dragged from the palette
$("#chart").droppable({ $("#chart").droppable({
accept:".palette_node", accept:".red-ui-palette-node",
drop: function( event, ui ) { drop: function( event, ui ) {
d3.event = event; d3.event = event;
var selected_tool = ui.draggable[0].type; var selected_tool = ui.draggable[0].type;

4
packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js vendored
View File

@ -296,13 +296,13 @@ RED.workspaces = (function() {
if (selectedTabs.length === 0) { if (selectedTabs.length === 0) {
$("#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"})
$("#palette-container").css({"pointer-events":"auto",filter:"none"}) $("#red-ui-palette-container").css({"pointer-events":"auto",filter:"none"})
$(".sidebar-shade").hide(); $(".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%)"})
$("#palette-container").css({"pointer-events":"none",filter:"opacity(60%)"}) $("#red-ui-palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
$(".sidebar-shade").show(); $(".sidebar-shade").show();
} }
}, },

10
packages/node_modules/@node-red/editor-client/src/sass/diff.scss vendored
View File

@ -253,16 +253,16 @@
background-size: contain; background-size: contain;
position: relative; position: relative;
.palette_icon { .red-ui-palette-icon {
background-position: 49% 50%; background-position: 49% 50%;
width: 15px; width: 15px;
} }
.palette_icon_fa { .red-ui-palette-icon-fa {
position: relative; position: relative;
top: -2.5px; top: -2.5px;
left: 0px; left: 0px;
} }
.palette_icon_container { .red-ui-palette-icon-container {
width: 18px; width: 18px;
} }
} }
@ -410,10 +410,10 @@
width: 18px; width: 18px;
height: 15px; height: 15px;
} }
.palette_icon_container { .red-ui-palette-icon-container {
width: 18px; width: 18px;
} }
.palette_icon { .red-ui-palette-icon {
width: 15px; width: 15px;
} }
ul,li,ol { ul,li,ol {

6
packages/node_modules/@node-red/editor-client/src/sass/editor.scss vendored
View File

@ -57,7 +57,7 @@
.editor-tray-content { .editor-tray-content {
overflow: auto; overflow: auto;
position: relative; position: relative;
.palette_icon_fa { .red-ui-palette-icon-fa {
top: 6px; top: 6px;
left: 4px; left: 4px;
} }
@ -154,7 +154,7 @@
background: $background-color; background: $background-color;
color: $workspace-button-color; color: $workspace-button-color;
} }
#palette-shade, #editor-shade, #header-shade, #sidebar-shade { #red-ui-palette-shade, #editor-shade, #header-shade, #sidebar-shade {
@include shade; @include shade;
z-index: 2; z-index: 2;
} }
@ -443,7 +443,7 @@
border-color: white; border-color: white;
} }
} }
.palette_icon_fa { .red-ui-palette-icon-fa {
top: 6px; top: 6px;
left: 3px; left: 3px;
} }

77
packages/node_modules/@node-red/editor-client/src/sass/palette.scss vendored
View File

@ -15,7 +15,7 @@
**/ **/
#palette { #red-ui-palette{
position: absolute; position: absolute;
top: 0px; top: 0px;
bottom: 0px; bottom: 0px;
@ -28,29 +28,18 @@
transition: width 0.2s ease-in-out; transition: width 0.2s ease-in-out;
} }
.palette-closed { .red-ui-palette-closed {
#palette { width: 8px; } #red-ui-palette {
#palette-search { display: none; } width: 8px;
#palette-container { display: none; } .red-ui-component-footer {
#palette-footer { display: none; } display: none;
} }
.palette-expanded {
& #palette {
width: 380px;
box-shadow: 1px 0 6px rgba(0,0,0,0.1);
} }
& #workspace { left: 379px !important; } #red-ui-palette-search { display: none; }
& #palette-collapse-all { display: none; } #red-ui-palette-container { display: none; }
& #palette-expand-all { display: none; }
& #palette-container { display: none !important; }
& #palette-search { display: none !important; }
& #palette-edit { background: $workspace-button-background-active }
& #palette-editor { display: block !important }
} }
.red-ui-palette-scroll {
.palette-scroll {
position: absolute; position: absolute;
top: 35px; top: 35px;
right: 0; right: 0;
@ -60,10 +49,10 @@
overflow-y: auto; overflow-y: auto;
box-sizing:border-box; box-sizing:border-box;
} }
#palette > .palette-spinner { #red-ui-palette> .red-ui-palette-spinner {
padding-top: 80px; padding-top: 80px;
} }
.palette-search { .red-ui-palette-search {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
background: #ffffff; background: #ffffff;
@ -74,15 +63,15 @@
box-sizing:border-box; box-sizing:border-box;
} }
.palette-category { .red-ui-palette-category {
border-bottom: 1px solid #ccc; border-bottom: 1px solid #ccc;
} }
.palette-content { .red-ui-palette-content {
background: #fff; background: #fff;
padding: 3px; padding: 3px;
} }
.palette-header { .red-ui-palette-header {
position: relative; position: relative;
background: $palette-header-background; background: $palette-header-background;
cursor: pointer; cursor: pointer;
@ -96,7 +85,7 @@
background: $palette-header-background !important; background: $palette-header-background !important;
} }
} }
.palette-header > i { .red-ui-palette-header > i {
position: absolute; position: absolute;
left: 11px; left: 11px;
top: 12px; top: 12px;
@ -107,15 +96,15 @@
-moz-transform: rotate(-90deg); -moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg); -o-transform: rotate(-90deg);
} }
.palette-header i.expanded { .red-ui-palette-header i.expanded {
-webkit-transform: rotate(0deg); -webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg); -moz-transform: rotate(0deg);
-o-transform: rotate(0deg); -o-transform: rotate(0deg);
} }
.palette-header span { .red-ui-palette-header span {
clear: both; clear: both;
} }
.palette_label { .red-ui-palette-label {
font-size: 13px; font-size: 13px;
margin: 4px 0 4px 32px; margin: 4px 0 4px 32px;
line-height: 20px; line-height: 20px;
@ -123,11 +112,11 @@
text-align: center; text-align: center;
@include disable-selection; @include disable-selection;
} }
.palette_label_right { .red-ui-palette-label-right {
margin: 4px 32px 4px 0; margin: 4px 32px 4px 0;
} }
.palette_node { .red-ui-palette-node {
display: block; display: block;
cursor:move; cursor:move;
background: #ddd; background: #ddd;
@ -141,11 +130,11 @@
background-size: contain; background-size: contain;
position: relative; position: relative;
} }
.palette_node:hover { .red-ui-palette-node:hover {
border-color: $node-selected-color; border-color: $node-selected-color;
background-color: #eee; background-color: #eee;
} }
.palette_port { .red-ui-palette-port {
position: absolute; position: absolute;
top:8px; top:8px;
left: -5px; left: -5px;
@ -157,16 +146,16 @@
height: 10px; height: 10px;
border: 1px solid #999; border: 1px solid #999;
} }
.palette_port_output { .red-ui-palette-port-output {
left:auto; left:auto;
right: -6px; right: -6px;
} }
.palette_node:hover .palette_port { .red-ui-palette-node:hover .red-ui-palette-port {
border-color: #999; border-color: #999;
background-color: #eee; background-color: #eee;
} }
.palette_icon_container { .red-ui-palette-icon-container {
position: absolute; position: absolute;
text-align: center; text-align: center;
top:0; top:0;
@ -176,13 +165,13 @@
border-right: 1px solid rgba(0,0,0,0.1); border-right: 1px solid rgba(0,0,0,0.1);
background-color: rgba(0,0,0,0.05); background-color: rgba(0,0,0,0.05);
} }
.palette_icon_container_right { .red-ui-palette-icon-container-right {
left: auto; left: auto;
right: 0; right: 0;
border-right: none; border-right: none;
border-left: 1px solid rgba(0,0,0,0.1); border-left: 1px solid rgba(0,0,0,0.1);
} }
.palette_icon { .red-ui-palette-icon {
display: inline-block; display: inline-block;
width: 20px; width: 20px;
height: 100%; height: 100%;
@ -190,13 +179,13 @@
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.palette_icon_fa { .red-ui-palette-icon-fa {
color: white; color: white;
position: absolute; position: absolute;
top: 7px; top: 7px;
left: 3px; left: 3px;
} }
.palette_node_small { .red-ui-palette-node-small {
display: inline-block; display: inline-block;
position: relative; position: relative;
width: 18px; width: 18px;
@ -205,15 +194,15 @@
vertical-align: middle; vertical-align: middle;
cursor: default; cursor: default;
.palette_icon_container { .red-ui-palette-icon-container {
width: 18px; width: 18px;
border-right: none; border-right: none;
} }
.palette_icon { .red-ui-palette-icon {
margin-left: -1px; margin-left: -1px;
width: 15px; width: 15px;
} }
.palette_icon_fa { .red-ui-palette-icon-fa {
top: 2px; top: 2px;
left: 1px; left: 1px;
} }

2
packages/node_modules/@node-red/editor-client/src/sass/projects.scss vendored
View File

@ -283,7 +283,7 @@
right: 0; right: 0;
overflow: hidden; overflow: hidden;
.palette-category { .red-ui-palette-category {
&:not(.palette-category-expanded) button { &:not(.palette-category-expanded) button {
display: none; display: none;
} }

10
packages/node_modules/@node-red/editor-client/src/sass/search.scss vendored
View File

@ -62,7 +62,7 @@
font-size: 13px; font-size: 13px;
border-left-width: 3px; border-left-width: 3px;
border-right-width: 3px; border-right-width: 3px;
.palette_icon_fa { .red-ui-palette-icon-fa {
position: relative; position: relative;
top: -2.5px; top: -2.5px;
left: 0px; left: 0px;
@ -91,10 +91,10 @@
.red-ui-search-result-node-output{ .red-ui-search-result-node-output{
left: 16px; left: 16px;
} }
.palette_icon_container { .red-ui-palette-icon-container {
width: 18px; width: 18px;
} }
.palette_icon { .red-ui-palette-icon {
width: 15px; width: 15px;
} }
.red-ui-search-result-description { .red-ui-search-result-description {
@ -150,7 +150,7 @@
display: table; display: table;
clear: both; clear: both;
} }
.palette_icon_fa { .red-ui-palette-icon-fa {
top: 6px; top: 6px;
left: 3px; left: 3px;
} }
@ -169,7 +169,7 @@
background-size: contain; background-size: contain;
position: relative; position: relative;
.palette_icon_container { .red-ui-palette-icon-container {
border-right: none; border-right: none;
} }

4
packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss vendored
View File

@ -25,7 +25,7 @@
.config-node-list { .config-node-list {
margin: 0; margin: 0;
list-style-type: none; list-style-type: none;
.palette_node { .red-ui-palette-node {
overflow: hidden; overflow: hidden;
&.selected { &.selected {
border-color: $node-selected-color; border-color: $node-selected-color;
@ -40,7 +40,7 @@
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.palette_icon_container { .red-ui-palette-icon-container {
font-size: 12px; font-size: 12px;
line-height: 30px; line-height: 30px;
background-color: #e8e8e8; background-color: #e8e8e8;

2
packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss vendored
View File

@ -22,7 +22,7 @@
right: 0; right: 0;
overflow-y: scroll; overflow-y: scroll;
.palette-category { .red-ui-palette-category {
&:not(.palette-category-expanded) button { &:not(.palette-category-expanded) button {
display: none; display: none;
} }

2
packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss vendored
View File

@ -16,7 +16,7 @@
.red-ui-stack { .red-ui-stack {
background: white; background: white;
.palette-category { .red-ui-palette-category {
background: white; background: white;
&:last-child { &:last-child {

2
packages/node_modules/@node-red/editor-client/src/sass/workspace.scss vendored
View File

@ -44,7 +44,7 @@
} }
.palette-closed #workspace { .red-ui-palette-closed #workspace {
left: 7px; left: 7px;
} }

13
packages/node_modules/@node-red/editor-client/templates/index.mst vendored
View File

@ -51,18 +51,7 @@
<div id="editor-shade" class="hide"></div> <div id="editor-shade" class="hide"></div>
</div> </div>
<div id="editor-stack"></div> <div id="editor-stack"></div>
<div id="palette"> <div id="red-ui-palette"></div>
<img src="red/images/spin.svg" class="palette-spinner hide"/>
<div id="palette-search" class="palette-search hide">
<input type="text" data-i18n="[placeholder]palette.filter"></input>
</div>
<div id="palette-container" class="palette-scroll hide"></div>
<div id="palette-footer" class="red-ui-component-footer">
<a class="red-ui-footer-button" id="palette-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a>
<a class="red-ui-footer-button" id="palette-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>
</div>
<div id="palette-shade" class="hide"></div>
</div><!-- /palette -->
<div id="sidebar"> <div id="sidebar">
<ul id="sidebar-tabs"></ul> <ul id="sidebar-tabs"></ul>
<div id="sidebar-content"></div> <div id="sidebar-content"></div>

4
packages/node_modules/@node-red/nodes/core/core/60-link.html vendored
View File

@ -53,7 +53,7 @@
if (activeSubflow) { if (activeSubflow) {
flowMap[activeSubflow.id] = { flowMap[activeSubflow.id] = {
id: activeSubflow.id, id: activeSubflow.id,
class: 'palette-header', class: 'red-ui-palette-header',
label: "Subflow : "+(activeSubflow.name || activeSubflow.id), label: "Subflow : "+(activeSubflow.name || activeSubflow.id),
expanded: true, expanded: true,
children: [] children: []
@ -63,7 +63,7 @@
RED.nodes.eachWorkspace(function(ws) { RED.nodes.eachWorkspace(function(ws) {
flowMap[ws.id] = { flowMap[ws.id] = {
id: ws.id, id: ws.id,
class: 'palette-header', class: 'red-ui-palette-header',
label: (ws.label || ws.id)+(node.z===ws.id ? " *":""), label: (ws.label || ws.id)+(node.z===ws.id ? " *":""),
expanded: true, expanded: true,
children: [] children: []