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

Style the debug window to match the sidebar

Browse Source
This commit is contained in:
Nick O'Leary 2016-06-20 23:08:37 +01:00
parent ab31f34862
commit 0cd20768f4
5 changed files with 89 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
nodes/core/core/58-debug.html
View File

@ -148,7 +148,7 @@
if (subWindow) { if (subWindow) {
try { try {
subWindow.postMessage(JSON.stringify(o),"*") subWindow.postMessage(o,"*")
} catch(err) { } catch(err) {
console.log(err); console.log(err);
} }

1
nodes/core/core/58-debug.js
View File

@ -160,7 +160,6 @@ module.exports = function(RED) {
root: __dirname + '/lib/debug/', root: __dirname + '/lib/debug/',
dotfiles: 'deny' dotfiles: 'deny'
}; };
console.log("SERVING UP",req.params[0]);
res.sendFile(req.params[0], options); res.sendFile(req.params[0], options);
}); });
}; };

73
nodes/core/core/lib/debug/debug.js
View File

@ -1,6 +1,77 @@
$(function() { $(function() {
function getTimestamp() {
var d = new Date();
return d.toLocaleString();
}
function sanitize(m) {
return m.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");
}
window.addEventListener('message',function(evt) { window.addEventListener('message',function(evt) {
console.log(evt.data); console.log(evt.data);
$('<div>').text(evt.data).appendTo(document.body); var o = evt.data;
var msg = document.createElement("div");
//var sourceNode = RED.nodes.node(o.id) || RED.nodes.node(o.z);
// msg.onmouseover = function() {
// msg.style.borderRightColor = "#999";
// var n = RED.nodes.node(o.id) || RED.nodes.node(o.z);
// if (n) {
// n.highlighted = true;
// n.dirty = true;
// }
// RED.view.redraw();
// };
// msg.onmouseout = function() {
// msg.style.borderRightColor = "";
// var n = RED.nodes.node(o.id) || RED.nodes.node(o.z);
// if (n) {
// n.highlighted = false;
// n.dirty = true;
// }
// RED.view.redraw();
// };
// msg.onclick = function() {
// var node = RED.nodes.node(o.id) || RED.nodes.node(o.z);
// if (node) {
// RED.workspaces.show(node.z);
// }
//
// };
//console.log(o);
var name = sanitize(((o.name?o.name:o.id)||"").toString());
var topic = sanitize((o.topic||"").toString());
var property = sanitize(o.property?o.property:'');
var payload = sanitize((o.msg||"").toString());
var format = sanitize((o.format||"").toString());
msg.className = 'debug-message'+(o.level?(' debug-message-level-'+o.level):'');
msg.innerHTML = '<span class="debug-message-date">'+
getTimestamp()+'</span>'+
(name?'<span class="debug-message-name">'+name:'')+
'</span>';
// NOTE: relying on function error to have a "type" that all other msgs don't
if (o.hasOwnProperty("type") && (o.type === "function")) {
var errorLvlType = 'error';
var errorLvl = 20;
if (o.hasOwnProperty("level") && o.level === 30) {
errorLvl = 30;
errorLvlType = 'warn';
}
msg.className = 'debug-message debug-message-level-' + errorLvl;
msg.innerHTML += '<span class="debug-message-topic">function : (' + errorLvlType + ')</span>';
} else {
msg.innerHTML += '<span class="debug-message-topic">'+
(o.topic?topic+' : ':'')+
(o.property?'msg.'+property:'msg')+" : "+format+
'</span>';
}
msg.innerHTML += '<span class="debug-message-payload">'+ payload+ '</span>';
$("#debug-content").append(msg);
},false) },false)
}); });

5
nodes/core/core/lib/debug/style.css
View File

@ -1,3 +1,8 @@
.debug-window {
padding:0;
margin:0;
background: #fff;
}
#debug-content { #debug-content {
position: absolute; position: absolute;
top: 43px; top: 43px;

12
nodes/core/core/lib/debug/view.html
View File

@ -1,8 +1,18 @@
<html> <html>
<head> <head>
<link rel="stylesheet" href="../../red/style.min.css">
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="../../vendor/font-awesome/css/font-awesome.min.css">
</head> </head>
<body></body> <body class="debug-window">
<div class="sidebar-header">
<span class="button-group">
<a class="sidebar-header-button-toggle selected" id="debug-tab-filter-all" href="#"><span data-i18n="node-red:debug.sidebar.filterAll">all flows</span></a><a class="sidebar-header-button-toggle" id="debug-tab-filter-current" href="#"><span data-i18n="node-red:debug.sidebar.filterCurrent">current flow</span></a>
</span>
<span class="button-group"><a id="debug-tab-open" title="open in new window" class="sidebar-header-button" href="#"><i class="fa fa-desktop"></i></a></span>
<span class="button-group"><a id="debug-tab-clear" title="clear log" class="sidebar-header-button" href="#"><i class="fa fa-trash"></i></a></span></div>
<div id="debug-content"></div>
</body>
<script src="../../vendor/vendor-jquery.js"></script> <script src="../../vendor/vendor-jquery.js"></script>
<script src="debug.js"></script> <script src="debug.js"></script>
</html> </html>