frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2025-03-01 10:36:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update all node icons to SVG

Browse Source 
When listing icons provided by a module, if there is a png and svg
with the same name, only the svg will be listed.

If a node asks for a png icon which is not known, but there is a
corresponding svg, that will be used instead.
This commit is contained in:
Nick O'Leary
2019-06-21 12:36:20 +01:00
parent 92cb57eb7b
commit d623848c87
81 changed files with 127 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -399,7 +399,7 @@ RED.diff = (function() {
diff: localDiff,
def: {
defaults:{},
icon:"subflow.png",
icon:"subflow.svg",
category: "subflows",
color: "#da9"
},
@@ -422,7 +422,7 @@ RED.diff = (function() {
diff: localDiff,
def: {
defaults:{},
icon:"subflow.png",
icon:"subflow.svg",
category: "subflows",
color: "#da9"
},
@@ -443,7 +443,7 @@ RED.diff = (function() {
remoteDiff: remoteDiff,
def: {
defaults:{},
icon:"subflow.png",
icon:"subflow.svg",
category: "subflows",
color: "#da9"
},
@@ -549,7 +549,7 @@ RED.diff = (function() {
if (def === undefined) {
if (/^subflow:/.test(node.type)) {
def = {
icon:"subflow.png",
icon:"subflow.svg",
category: "subflows",
color: "#da9",
defaults:{name:{value:""}}

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

@@ -2156,7 +2156,7 @@ RED.editor = (function() {
changed = true;
}
var icon = $("#red-ui-editor-node-icon").text()||"";
if ((editing_node.icon === undefined && icon !== "node-red/subflow.png") ||
if ((editing_node.icon === undefined && icon !== "node-red/subflow.svg") ||
(editing_node.icon !== undefined && editing_node.icon !== icon)) {
changes.icon = editing_node.icon;
editing_node.icon = icon;

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

@@ -802,13 +802,13 @@ RED.utils = (function() {
function getDefaultNodeIcon(def,node) {
var icon_url;
if (node && node.type === "subflow") {
icon_url = "node-red/subflow.png";
icon_url = "node-red/subflow.svg";
} else 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";
icon_url = "arrow-in.svg";
}
} else {
icon_url = def.icon;
@@ -838,11 +838,11 @@ RED.utils = (function() {
function getNodeIcon(def,node) {
if (def.category === 'config') {
return RED.settings.apiRootUrl+"icons/node-red/cog.png"
return RED.settings.apiRootUrl+"icons/node-red/cog.svg"
} else if (node && node.type === 'tab') {
return RED.settings.apiRootUrl+"icons/node-red/subflow.png"
return RED.settings.apiRootUrl+"icons/node-red/subflow.svg"
} else if (node && node.type === 'unknown') {
return RED.settings.apiRootUrl+"icons/node-red/alert.png"
return RED.settings.apiRootUrl+"icons/node-red/alert.svg"
} else if (node && node.icon) {
var iconPath = separateIconPath(node.icon);
if (isIconExists(iconPath)) {
@@ -851,6 +851,11 @@ RED.utils = (function() {
} else {
return RED.settings.apiRootUrl+"icons/" + node.icon;
}
} else if (iconPath.module !== "font-awesome" && /.png$/i.test(iconPath.file)) {
iconPath.file = iconPath.file.replace(/.png$/,".svg");
if (isIconExists(iconPath)) {
return RED.settings.apiRootUrl+"icons/" + node.icon.replace(/.png$/,".svg");
}
}
}
@@ -867,9 +872,9 @@ RED.utils = (function() {
if (isIconExists(iconPath)) {
return RED.settings.apiRootUrl+"icons/"+iconPath.module+"/"+iconPath.file;
} else if (def.category === 'subflows') {
return RED.settings.apiRootUrl+"icons/node-red/subflow.png";
return RED.settings.apiRootUrl+"icons/node-red/subflow.svg";
} else {
return RED.settings.apiRootUrl+"icons/node-red/arrow-in.png";
return RED.settings.apiRootUrl+"icons/node-red/arrow-in.svg";
}
}
}
@@ -1007,7 +1012,7 @@ RED.utils = (function() {
return;
}
// 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.svg"
}
var imageIconElement = $('<div/>',{class:"red-ui-palette-icon"}).appendTo(iconContainer);
imageIconElement.css("backgroundImage", "url("+iconUrl+")");

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

@@ -2463,14 +2463,22 @@ RED.view = (function() {
.attr("class","red-ui-flow-node-icon")
.attr("x",0)
.attr("width","30")
.attr("height","30");
.attr("height","30")
.style("display","none");
var img = new Image();
img.src = iconUrl;
img.onload = function() {
icon.attr("width",Math.min(img.width,30));
icon.attr("height",Math.min(img.height,30));
icon.attr("x",15-Math.min(img.width,30)/2);
var largestEdge = Math.max(img.width,img.height);
var scaleFactor = 1;
if (largestEdge > 30) {
scaleFactor = 30/largestEdge;
}
var width = img.width * scaleFactor;
var height = img.height * scaleFactor;
icon.attr("width",width);
icon.attr("height",height);
icon.attr("x",15-width/2);
icon.attr("xlink:href",iconUrl);
icon.style("display",null);
//if ("right" == d._def.align) {

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

@@ -439,7 +439,7 @@ RED.workspaces = (function() {
if (!workspace_tabs.contains(id)) {
var sf = RED.nodes.subflow(id);
if (sf) {
addWorkspace({type:"subflow",id:id,icon:"red/images/subflow_tab.png",label:sf.name, closeable: true});
addWorkspace({type:"subflow",id:id,icon:"red/images/subflow_tab.svg",label:sf.name, closeable: true});
} else {
return;
}