Skip to content

Commit 2d98e6d

Browse files
committed
Make inbuilt debug messages navigable
1 parent e18d5a4 commit 2d98e6d

7 files changed

Lines changed: 220 additions & 83 deletions

File tree

editor/js/ui/view.js

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2405,7 +2405,6 @@ RED.view = (function() {
24052405
node.highlighted = true;
24062406
node.dirty = true;
24072407
RED.workspaces.show(node.z);
2408-
RED.view.redraw();
24092408

24102409
var screenSize = [$("#chart").width(),$("#chart").height()];
24112410
var scrollPos = [$("#chart").scrollLeft(),$("#chart").scrollTop()];
@@ -2419,17 +2418,22 @@ RED.view = (function() {
24192418
},200);
24202419
}
24212420

2422-
var flash = 22;
2423-
var flashFunc = function() {
2424-
flash--;
2425-
node.highlighted = !node.highlighted;
2426-
node.dirty = true;
2427-
RED.view.redraw();
2428-
if (flash >= 0) {
2429-
setTimeout(flashFunc,100);
2421+
if (!node._flashing) {
2422+
node._flashing = true;
2423+
var flash = 22;
2424+
var flashFunc = function() {
2425+
flash--;
2426+
node.highlighted = !node.highlighted;
2427+
node.dirty = true;
2428+
RED.view.redraw();
2429+
if (flash >= 0) {
2430+
setTimeout(flashFunc,100);
2431+
} else {
2432+
delete node._flashing;
2433+
}
24302434
}
2435+
flashFunc();
24312436
}
2432-
flashFunc();
24332437
} else if (node._def.category === 'config') {
24342438
RED.sidebar.config.show(id);
24352439
}

nodes/core/core/58-debug.html

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,6 @@
4444
<p>Optionally can show the complete <code>msg</code> object, and send messages to the console log.</p>
4545
<p>In addition any calls to node.warn or node.error will appear here.</p>
4646
</script>
47-
4847
<script type="text/javascript">
4948
(function() {
5049
var subWindow = null;
@@ -175,14 +174,12 @@
175174
}
176175
RED.view.redraw();
177176
};
178-
msg.onclick = function() {
177+
$(msg).click(function() {
179178
var node = RED.nodes.node(o.id) || RED.nodes.node(o.z);
180179
if (node) {
181180
RED.view.reveal(node.id);
182181
}
183-
184-
};
185-
//console.log(o);
182+
});
186183
var name = sanitize(((o.name?o.name:o.id)||"").toString());
187184
var topic = sanitize((o.topic||"").toString());
188185
var property = sanitize(o.property?o.property:'');
@@ -212,7 +209,21 @@
212209

213210
'</span>';
214211
}
215-
msg.innerHTML += '<span class="debug-message-payload">'+ payload+ '</span>';
212+
if (format === 'Object' || /^array/.test(format) || format === 'boolean' || format === 'number' ) {
213+
payload = JSON.parse(payload);
214+
} else if (format === 'null') {
215+
payload = null;
216+
} else if (format === 'undefined') {
217+
payload = undefined;
218+
} else if (/^buffer/.test(format)) {
219+
var buffer = payload;
220+
payload = [];
221+
for (var c = 0; c < buffer.length; c += 2) {
222+
payload.push(parseInt(buffer.substr(c, 2), 16));
223+
}
224+
}
225+
var el = $('<span class="debug-message-payload"></span>').appendTo(msg);
226+
RED.debug.buildMessageElement(payload,true).appendTo(el);
216227
var atBottom = (sbc.scrollHeight-messages.height()-sbc.scrollTop) < 5;
217228
messageCount++;
218229
messages.append(msg);
@@ -297,5 +308,5 @@
297308
});
298309
})();
299310
</script>
300-
311+
<script src="debug/view/debug-utils.js"></script>
301312
<link rel="stylesheet" href="debug/view/style.css">

nodes/core/core/58-debug.js

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,9 @@ module.exports = function(RED) {
8282
} else if (msg.msg instanceof Buffer) {
8383
msg.format = "buffer ["+msg.msg.length+"]";
8484
msg.msg = msg.msg.toString('hex');
85+
if (msg.msg.length > debuglength) {
86+
msg.msg = msg.msg.substring(0,debuglength);
87+
}
8588
} else if (msg.msg && typeof msg.msg === 'object') {
8689
var seen = [];
8790
try {
@@ -95,6 +98,12 @@ module.exports = function(RED) {
9598
}
9699
if (isArray || (msg.format === "Object")) {
97100
msg.msg = JSON.stringify(msg.msg, function(key, value) {
101+
if (key[0] === '_' && key !== "_msgid") {
102+
return undefined;
103+
}
104+
if (key === '_req' || key === '_res') {
105+
return "[internal]"
106+
}
98107
if (typeof value === 'object' && value !== null) {
99108
if (seen.indexOf(value) !== -1) { return "[circular]"; }
100109
seen.push(value);
@@ -123,9 +132,9 @@ module.exports = function(RED) {
123132
msg.msg = msg.msg;
124133
}
125134

126-
if (msg.msg.length > debuglength) {
127-
msg.msg = msg.msg.substr(0,debuglength) +" ....";
128-
}
135+
// if (msg.msg.length > debuglength) {
136+
// msg.msg = msg.msg.substr(0,debuglength) +" ....";
137+
// }
129138
RED.comms.publish("debug",msg);
130139
}
131140

Lines changed: 157 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,157 @@
1+
2+
RED.debug = (function() {
3+
function buildMessageElement(obj,topLevel) {
4+
var i;
5+
var e;
6+
var entryObj;
7+
var header;
8+
var headerHead;
9+
var value;
10+
var element = $('<span class="debug-message-element"></span>').toggleClass('collapsed',topLevel);
11+
if (Array.isArray(obj)) {
12+
var length = Math.min(obj.length,10);
13+
if (!topLevel) {
14+
header = $('<span class="debug-message-type-meta"></span>').html('array['+obj.length+']').appendTo(element);
15+
} else {
16+
header = $('<span>').appendTo(element);
17+
if (length > 0) {
18+
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
19+
header.addClass("debug-message-expandable");
20+
header.click(function(e) {
21+
$(this).parent().toggleClass('collapsed');
22+
e.preventDefault();
23+
});
24+
}
25+
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html('array['+obj.length+']').appendTo(header);
26+
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(header);
27+
$('<span>[ </span>').appendTo(headerHead);
28+
}
29+
30+
31+
for (i=0;i<length;i++) {
32+
if (topLevel) {
33+
value = obj[i];
34+
if (Array.isArray(value)) {
35+
$('<span class="debug-message-object-value debug-message-type-meta"></span>').html('array['+value.length+']').appendTo(headerHead);
36+
} else if (value === null) {
37+
$('<span class="debug-message-object-value debug-message-type-null">null</span>').appendTo(headerHead);
38+
} else if (typeof value === 'object') {
39+
$('<span class="debug-message-object-value debug-message-type-meta">object</span>').appendTo(headerHead);
40+
} else if (typeof value === 'string') {
41+
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+value+'"').appendTo(headerHead);
42+
} else {
43+
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+value).appendTo(headerHead);
44+
}
45+
if (i < length -1) {
46+
$('<span>, </span>').appendTo(headerHead);
47+
}
48+
}
49+
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
50+
header = $('<span></span>').appendTo(entryObj);
51+
if (typeof obj[i] === 'object' && obj[i] !== null) {
52+
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
53+
header.addClass("debug-message-expandable");
54+
header.click(function(e) {
55+
$(this).parent().toggleClass('collapsed');
56+
e.preventDefault();
57+
});
58+
}
59+
$('<span class="debug-message-object-key"></span>').text(i).appendTo(header);
60+
$('<span>: </span>').appendTo(entryObj);
61+
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
62+
buildMessageElement(obj[i],false).appendTo(e);
63+
}
64+
if (length < obj.length) {
65+
if (topLevel) {
66+
$('<span> ...</span>').appendTo(headerHead);
67+
}
68+
$('<div class="debug-message-object-entry"><span class="debug-message-object-key">...</span></div>').appendTo(element);
69+
}
70+
if (topLevel) {
71+
if (length === 0) {
72+
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
73+
}
74+
$('<span> ]</span>').appendTo(headerHead);
75+
}
76+
} else if (obj === null || obj === undefined) {
77+
$('<span class="debug-message-object-value debug-message-type-null">'+obj+'</span>').appendTo(element);
78+
} else if (typeof obj === 'object') {
79+
var keys = Object.keys(obj);
80+
if (topLevel) {
81+
header = $('<span>').appendTo(element);
82+
if (keys.length > 0) {
83+
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
84+
header.addClass("debug-message-expandable");
85+
header.click(function(e) {
86+
$(this).parent().toggleClass('collapsed');
87+
e.preventDefault();
88+
});
89+
}
90+
} else {
91+
header = $('<span class="debug-message-type-meta"></span>').html('object').appendTo(element);
92+
}
93+
if (topLevel) {
94+
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html('object').appendTo(header);
95+
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(header);
96+
$('<span>{ </span>').appendTo(headerHead);
97+
}
98+
for (i=0;i<keys.length;i++) {
99+
if (topLevel) {
100+
if (i < 5) {
101+
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(headerHead);
102+
$('<span>: </span>').appendTo(headerHead);
103+
value = obj[keys[i]];
104+
if (Array.isArray(value)) {
105+
$('<span class="debug-message-object-value debug-message-type-meta"></span>').html('array['+value.length+']').appendTo(headerHead);
106+
} else if (value === null) {
107+
$('<span class="debug-message-object-value debug-message-type-null">null</span>').appendTo(headerHead);
108+
} else if (typeof value === 'object') {
109+
$('<span class="debug-message-object-value debug-message-type-meta">object</span>').appendTo(headerHead);
110+
} else if (typeof value === 'string') {
111+
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+value+'"').appendTo(headerHead);
112+
} else {
113+
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+value).appendTo(headerHead);
114+
}
115+
if (i < keys.length -1) {
116+
$('<span>, </span>').appendTo(headerHead);
117+
}
118+
}
119+
if (i === 5) {
120+
$('<span> ...</span>').appendTo(headerHead);
121+
}
122+
}
123+
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
124+
var entryHeader = $('<span></span>').appendTo(entryObj);
125+
if (typeof obj[keys[i]] === 'object' && obj[keys[i]] !== null) {
126+
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(entryHeader);
127+
entryHeader.addClass("debug-message-expandable");
128+
entryHeader.click(function(e) {
129+
$(this).parent().toggleClass('collapsed');
130+
e.preventDefault();
131+
});
132+
}
133+
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(entryHeader);
134+
$('<span>: </span>').appendTo(entryHeader);
135+
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
136+
buildMessageElement(obj[keys[i]],false).appendTo(e);
137+
}
138+
if (keys.length === 0) {
139+
$('<div class="debug-message-object-entry debug-message-type-meta collapsed"></div>').text("empty").appendTo(element);
140+
}
141+
if (topLevel) {
142+
if (keys.length === 0) {
143+
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
144+
}
145+
$('<span> }</span>').appendTo(headerHead);
146+
}
147+
} else if (typeof obj === 'string') {
148+
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+obj+'"').appendTo(element);
149+
} else {
150+
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+obj).appendTo(element);
151+
}
152+
return element;
153+
}
154+
return {
155+
buildMessageElement: buildMessageElement
156+
}
157+
})();

nodes/core/core/lib/debug/debug.js

Lines changed: 0 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -89,67 +89,4 @@ $(function() {
8989
$("#debug-content").append(msg);
9090
$("#debug-content").scrollTop($("#debug-content")[0].scrollHeight);
9191
},false);
92-
93-
function buildMessageElement(obj,topLevel) {
94-
var i;
95-
var e;
96-
var entryObj;
97-
var header;
98-
var element = $('<span class="debug-message-element"></span>').toggleClass('collapsed',topLevel);
99-
if (Array.isArray(obj)) {
100-
$('<span>').html('Array['+obj.length+']').appendTo(element);
101-
var length = Math.min(obj.length,10);
102-
for (i=0;i<length;i++) {
103-
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
104-
header = $('<span></span>').appendTo(entryObj);
105-
if (typeof obj[i] === 'object' && obj[i] !== null) {
106-
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
107-
header.addClass("debug-message-expandable");
108-
header.click(function(e) {
109-
$(this).parent().toggleClass('collapsed');
110-
});
111-
}
112-
$('<span class="debug-message-object-key"></span>').text(i).appendTo(header);
113-
$('<span>: </span>').appendTo(entryObj);
114-
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
115-
buildMessageElement(obj[i],false).appendTo(e);
116-
}
117-
if (length < obj.length) {
118-
$('<div class="debug-message-object-entry"><span class="debug-message-object-key">...</span></div>').appendTo(element);
119-
}
120-
} else if (obj === null) {
121-
$('<span class="debug-message-object-value debug-message-type-null">null</span>').appendTo(element);
122-
} else if (typeof obj === 'object') {
123-
124-
header = $('<span>').html((topLevel?(JSON.stringify(obj,2).substring(0,200)):'Object')).appendTo(element);
125-
if (topLevel) {
126-
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
127-
header.addClass("debug-message-expandable");
128-
header.click(function(e) {
129-
$(this).parent().toggleClass('collapsed');
130-
});
131-
}
132-
var keys = Object.keys(obj);
133-
for (i=0;i<keys.length;i++) {
134-
entryObj = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
135-
header = $('<span></span>').appendTo(entryObj);
136-
if (typeof obj[keys[i]] === 'object' && obj[keys[i]] !== null) {
137-
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
138-
header.addClass("debug-message-expandable");
139-
header.click(function(e) {
140-
$(this).parent().toggleClass('collapsed');
141-
});
142-
}
143-
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(header);
144-
$('<span>: </span>').appendTo(header);
145-
e = $('<span class="debug-message-object-value"></span>').appendTo(entryObj);
146-
buildMessageElement(obj[keys[i]],false).appendTo(e);
147-
}
148-
} else if (typeof obj === 'string') {
149-
$('<span class="debug-message-object-value debug-message-type-string"></span>').text('"'+obj+'"').appendTo(element);
150-
} else {
151-
$('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+obj).appendTo(element);
152-
}
153-
return element;
154-
}
15592
});

nodes/core/core/lib/debug/style.css

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,9 @@
6363
}
6464
.debug-message-element {
6565
color: #333;
66+
font-family: Menlo, monospace;
67+
font-size: 12px !important;
68+
line-height: 1.3em;
6669
}
6770
.debug-message-object-key {
6871
color: #792e90;
@@ -95,11 +98,26 @@
9598
.debug-message-element.collapsed .debug-message-object-entry {
9699
display:none;
97100
}
101+
.debug-message-element:not(.collapsed) .debug-message-object-header {
102+
display:none;
103+
}
104+
105+
.debug-message-element.collapsed .debug-message-object-type-header {
106+
display:none;
107+
}
108+
98109

99110
.debug-message-type-other { color: #2033d6; }
100111
.debug-message-type-string { color: #b72828; }
101112
.debug-message-type-null { color: #666; font-style: italic;}
113+
.debug-message-type-meta { color: #666; font-style: italic;}
102114

103115
.debug-message-expandable {
104116
cursor: pointer;
105117
}
118+
.debug-message-expandable:hover {
119+
background: #fefefe;
120+
}
121+
.debug-message-expandable:hover .debug-message-object-handle {
122+
color: #b72828 !important;
123+
}

0 commit comments

Comments
 (0)