Add the changed badge for the config node

This commit is contained in:
GogoVega 2024-06-22 15:24:41 +02:00
parent 71f8de94b0
commit 54e0de64a7
No known key found for this signature in database
GPG Key ID: E1E048B63AC5AC2B
2 changed files with 22 additions and 9 deletions

View File

@ -150,9 +150,6 @@ RED.sidebar.config = (function() {
$('<li class="red-ui-palette-node-config-type">'+node.type+'</li>').appendTo(list); $('<li class="red-ui-palette-node-config-type">'+node.type+'</li>').appendTo(list);
currentType = node.type; currentType = node.type;
} }
if (node.changed) {
labelText += "!!"
}
var entry = $('<li class="red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list); var entry = $('<li class="red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
var nodeDiv = $('<div class="red-ui-palette-node-config red-ui-palette-node"></div>').appendTo(entry); var nodeDiv = $('<div class="red-ui-palette-node-config red-ui-palette-node"></div>').appendTo(entry);
entry.data('node',node.id); entry.data('node',node.id);
@ -181,15 +178,31 @@ RED.sidebar.config = (function() {
} }
} }
if (node.changed) {
const nodeDivAnnotations = $('<svg class="red-ui-palette-node-annotations red-ui-flow-node-changed" width="10" height="10" style="left:calc(100% - 15px);"></svg>').appendTo(nodeDiv);
const changedBadge = document.createElementNS("http://www.w3.org/2000/svg", "circle");
changedBadge.setAttribute("cx", "5");
changedBadge.setAttribute("cy", "5");
changedBadge.setAttribute("r", "5");
nodeDivAnnotations.append($(changedBadge));
}
if (!node.valid) { if (!node.valid) {
nodeDiv.addClass("red-ui-palette-node-config-invalid") nodeDiv.addClass("red-ui-palette-node-config-invalid");
const nodeDivAnnotations = $('<svg class="red-ui-palette-node-annotations red-ui-flow-node-error" width="10" height="10"></svg>').appendTo(nodeDiv) const nodeDivAnnotations = $('<svg class="red-ui-palette-node-annotations red-ui-flow-node-error" width="10" height="10"></svg>').appendTo(nodeDiv);
const errorBadge = document.createElementNS("http://www.w3.org/2000/svg", "path"); const errorBadge = document.createElementNS("http://www.w3.org/2000/svg", "path");
errorBadge.setAttribute("d","M 0,9 l 10,0 -5,-8 z"); errorBadge.setAttribute("d","M 0,9 l 10,0 -5,-8 z");
nodeDivAnnotations.append($(errorBadge)) nodeDivAnnotations.append($(errorBadge));
if (node.changed) {
nodeDivAnnotations.css("left", "calc(100% - 28px)");
} else {
nodeDivAnnotations.css("left", "calc(100% - 15px)");
}
RED.popover.tooltip(nodeDivAnnotations, function () { RED.popover.tooltip(nodeDivAnnotations, function () {
if (node.validationErrors && node.validationErrors.length > 0) { if (node.validationErrors && node.validationErrors.length > 0) {
return RED._("editor.errors.invalidProperties")+"<br> - "+node.validationErrors.join("<br> - ") return RED._("editor.errors.invalidProperties") + "<br> - " + node.validationErrors.join("<br> - ");
} }
}) })
} }

View File

@ -117,7 +117,7 @@ ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
} }
.red-ui-palette-node-annotations { .red-ui-palette-node-annotations {
position: absolute; position: absolute;
left: calc(100% - 15px); //left: calc(100% - 15px);
top: -8px; top: -8px;
display: block; display: block;
} }