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

Include module name in requests for node icons

Browse Source
This commit is contained in:
Nick O'Leary 2017-01-18 13:06:22 +00:00
parent 64daaeb310
commit 11f4ae019c
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
10 changed files with 70 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
editor/js/nodes.js
View File

@ -115,6 +115,7 @@ RED.nodes = (function() {
},
registerNodeType: function(nt,def) {
nodeDefinitions[nt] = def;
def.type = nt;
if (def.category != "subflows") {
def.set = nodeSets[typeToId[nt]];
nodeSets[typeToId[nt]].added = true;

11
editor/js/ui/diff.js
View File

@ -342,21 +342,14 @@ RED.diff = (function() {
function createNodeIcon(node,def) {
var nodeDiv = $("<div>",{class:"node-diff-node-entry-node"});
var colour = def.color;
var icon_url = "arrow-in.png";
var icon_url = RED.utils.getNodeIcon(def,node);
if (node.type === 'tab') {
colour = "#C0DEED";
icon_url = "subflow.png";
} else if (def.category === 'config') {
icon_url = "cog.png";
} else if (node.type === 'unknown') {
icon_url = "alert.png";
} else {
icon_url = def.icon;
}
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
$('<div/>',{class:"palette_icon",style:"background-image: url(icons/"+icon_url+")"}).appendTo(iconContainer);
$('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
return nodeDiv;
}

11
editor/js/ui/palette.js
View File

@ -149,14 +149,9 @@ RED.palette = (function() {
if (def.icon) {
var icon_url = "arrow-in.png";
try {
icon_url = (typeof def.icon === "function" ? def.icon.call({}) : def.icon);
} catch(err) {
console.log("Definition error: "+nt+".icon",err);
}
var icon_url = RED.utils.getNodeIcon(def);
var iconContainer = $('<div/>',{class:"palette_icon_container"+(def.align=="right"?" palette_icon_container_right":"")}).appendTo(d);
$('<div/>',{class:"palette_icon",style:"background-image: url(icons/"+icon_url+")"}).appendTo(iconContainer);
$('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
}
d.style.backgroundColor = def.color;
@ -236,7 +231,7 @@ RED.palette = (function() {
// it here makes me sad
//console.log(ui.helper.position());
ui.position.left += 17.5;
if (def.inputs > 0 && def.outputs > 0) {
mouseX = ui.position.left+(ui.helper.width()/2) - chartOffset.left + chart.scrollLeft();
mouseY = ui.position.top+(ui.helper.height()/2) - chartOffset.top + chart.scrollTop();

15
editor/js/ui/search.js
View File

@ -189,25 +189,14 @@ RED.search = (function() {
var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(div);
var colour = def.color;
var icon_url = "arrow-in.png";
var icon_url = RED.utils.getNodeIcon(def,node);
if (node.type === 'tab') {
colour = "#C0DEED";
icon_url = "subflow.png";
} else if (def.category === 'config') {
icon_url = "cog.png";
} else if (node.type === 'unknown') {
icon_url = "alert.png";
} else {
try {
icon_url = (typeof def.icon === "function" ? def.icon.call({}) : def.icon);
} catch(err) {
console.log("Definition error: "+nt+".icon",err);
}
}
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
$('<div/>',{class:"palette_icon",style:"background-image: url(icons/"+icon_url+")"}).appendTo(iconContainer);
$('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div);
if (node.z) {

13
editor/js/ui/typeSearch.js
View File

@ -110,20 +110,11 @@ RED.typeSearch = (function() {
var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(div);
var colour = def.color;
var icon_url = "arrow-in.png";
if (def.category === 'config') {
icon_url = "cog.png";
} else {
try {
icon_url = (typeof def.icon === "function" ? def.icon.call({}) : def.icon);
} catch(err) {
console.log("Definition error: "+object.type+".icon",err);
}
}
var icon_url = RED.utils.getNodeIcon(def);
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
$('<div/>',{class:"palette_icon",style:"background-image: url(icons/"+icon_url+")"}).appendTo(iconContainer);
$('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
if (def.inputs > 0) {
$('<div/>',{class:"red-ui-search-result-node-port"}).appendTo(nodeDiv);

25
editor/js/ui/utils.js
View File

@ -367,8 +367,31 @@ RED.utils = (function() {
return true;
}
function getNodeIcon(def,node) {
if (def.category === 'config') {
return "icons/node-red/cog.png"
} else if (node && node.type === 'tab') {
return "icons/node-red/subflow.png"
} else if (node && node.type === 'unknown') {
return "icons/node-red/alert.png"
}
var icon_url;
if (typeof def.icon === "function") {
try {
icon_url = def.icon.call(node);
} catch(err) {
console.log("Definition error: "+def.type+".icon",err);
icon_url = "arrow-in.png";
}
} else {
icon_url = def.icon;
}
return "icons/"+def.set.module+"/"+icon_url;
}
return {
createObjectElement: buildMessageElement,
validatePropertyExpression: validatePropertyExpression
validatePropertyExpression: validatePropertyExpression,
getNodeIcon: getNodeIcon
}
})();

30
editor/js/ui/view.js
View File

@ -1832,7 +1832,7 @@ RED.view = (function() {
//node.append("rect").attr("class", "node-gradient-bottom").attr("rx", 6).attr("ry", 6).attr("height",30).attr("stroke","none").attr("fill","url(#gradient-bottom)").style("pointer-events","none");
if (d._def.icon) {
var icon_url = RED.utils.getNodeIcon(d._def,d);
var icon_group = node.append("g")
.attr("class","node_icon_group")
.attr("x",0).attr("y",0);
@ -1847,7 +1847,7 @@ RED.view = (function() {
.attr("height",function(d){return Math.min(50,d.h-4);});
var icon = icon_group.append("image")
.attr("xlink:href","icons/"+d._def.icon)
.attr("xlink:href",icon_url)
.attr("class","node_icon")
.attr("x",0)
.attr("width","30")
@ -1878,7 +1878,7 @@ RED.view = (function() {
//}
var img = new Image();
img.src = "icons/"+d._def.icon;
img.src = icon_url;
img.onload = function() {
icon.attr("width",Math.min(img.width,30));
icon.attr("height",Math.min(img.height,30));
@ -1915,8 +1915,10 @@ RED.view = (function() {
//node.append("circle").attr({"class":"centerDot","cx":0,"cy":0,"r":5});
//node.append("path").attr("class","node_error").attr("d","M 3,-3 l 10,0 l -5,-8 z");
node.append("image").attr("class","node_error hidden").attr("xlink:href","icons/node-error.png").attr("x",0).attr("y",-6).attr("width",10).attr("height",9);
node.append("image").attr("class","node_changed hidden").attr("xlink:href","icons/node-changed.png").attr("x",12).attr("y",-6).attr("width",10).attr("height",10);
//TODO: these ought to be SVG
node.append("image").attr("class","node_error hidden").attr("xlink:href","icons/node-red/node-error.png").attr("x",0).attr("y",-6).attr("width",10).attr("height",9);
node.append("image").attr("class","node_changed hidden").attr("xlink:href","icons/node-red/node-changed.png").attr("x",12).attr("y",-6).attr("width",10).attr("height",10);
});
node.each(function(d,i) {
@ -2032,21 +2034,11 @@ RED.view = (function() {
if (d._def.icon) {
icon = thisNode.select(".node_icon");
var current_url = icon.attr("xlink:href");
var icon_url;
if (typeof d._def.icon == "function") {
try {
icon_url = d._def.icon.call(d);
} catch(err) {
console.log("icon",err);
icon_url = "arrow-in.png";
}
} else {
icon_url = d._def.icon;
}
if ("icons/"+icon_url != current_url) {
icon.attr("xlink:href","icons/"+icon_url);
var new_url = RED.utils.getNodeIcon(d._def,d);
if (new_url !== current_url) {
icon.attr("xlink:href",new_url);
var img = new Image();
img.src = "icons/"+d._def.icon;
img.src = new_url;
img.onload = function() {
icon.attr("width",Math.min(img.width,30));
icon.attr("height",Math.min(img.height,30));

2
red/api/index.js
View File

@ -94,7 +94,7 @@ function init(_server,_runtime) {
});
}
editorApp.get("/",ensureRuntimeStarted,ui.ensureSlash,ui.editor);
editorApp.get("/icons/:icon",ui.icon);
editorApp.get("/icons/:module/:icon",ui.icon);
theme.init(runtime);
if (settings.editorTheme) {
editorApp.use("/theme",theme.app());

35
red/api/ui.js
View File

@ -21,7 +21,9 @@ var theme = require("./theme");
var Mustache = require("mustache");
var icon_paths = [path.resolve(__dirname + '/../../public/icons')];
var icon_paths = {
"node-red":[path.resolve(__dirname + '/../../public/icons')]
};
var iconCache = {};
//TODO: create a default icon
var defaultIcon = path.resolve(__dirname + '/../../public/icons/arrow-in.png');
@ -29,7 +31,8 @@ var templateDir = path.resolve(__dirname+"/../../editor/templates");
var editorTemplate;
function nodeIconDir(dir) {
icon_paths.push(path.resolve(dir));
icon_paths[dir.name] = icon_paths[dir.name] || [];
icon_paths[dir.name].push(path.resolve(dir.path));
}
module.exports = {
@ -54,18 +57,24 @@ module.exports = {
}
},
icon: function(req,res) {
if (iconCache[req.params.icon]) {
res.sendFile(iconCache[req.params.icon]); // if not found, express prints this to the console and serves 404
var icon = req.params.icon;
var module = req.params.module;
var iconName = module+"/"+icon;
if (iconCache[iconName]) {
res.sendFile(iconCache[iconName]); // if not found, express prints this to the console and serves 404
} else {
for (var p=0;p<icon_paths.length;p++) {
var iconPath = path.join(icon_paths[p],req.params.icon);
try {
fs.statSync(iconPath);
res.sendFile(iconPath);
iconCache[req.params.icon] = iconPath;
return;
} catch(err) {
// iconPath doesn't exist
var paths = icon_paths[module];
if (paths) {
for (var p=0;p<paths.length;p++) {
var iconPath = path.join(paths[p],icon);
try {
fs.statSync(iconPath);
res.sendFile(iconPath);
iconCache[iconName] = iconPath;
return;
} catch(err) {
// iconPath doesn't exist
}
}
}
res.sendFile(defaultIcon);

4
red/runtime/nodes/registry/localfilesystem.js
View File

@ -89,7 +89,7 @@ function getLocalNodeFiles(dir) {
if (!/^(\..*|lib|icons|node_modules|test|locales)$/.test(fn)) {
result = result.concat(getLocalNodeFiles(path.join(dir,fn)));
} else if (fn === "icons") {
events.emit("node-icon-dir",path.join(dir,fn));
events.emit("node-icon-dir",{name:'node-red',path:path.join(dir,fn)});
}
}
});
@ -182,7 +182,7 @@ function getModuleNodeFiles(module) {
if (iconDirs.indexOf(iconDir) == -1) {
try {
fs.statSync(iconDir);
events.emit("node-icon-dir",iconDir);
events.emit("node-icon-dir",{name:pkg.name,path:iconDir});
iconDirs.push(iconDir);
} catch(err) {
}