1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Make status display toggleable and add to MQTT nodes

This commit is contained in:
Nick O'Leary 2014-05-10 23:33:02 +01:00
parent ec5985eaa3
commit 7e85eb297d
4 changed files with 47 additions and 7 deletions

View File

@ -77,7 +77,9 @@ module.exports = function(RED) {
this.topic = n.topic;
this.broker = n.broker;
this.brokerConfig = RED.nodes.getNode(this.broker);
var node = this;
if (this.brokerConfig) {
this.status({fill:"red",shape:"ring",text:"disconnected"},true);
this.client = connectionPool.get(this.brokerConfig.broker,this.brokerConfig.port,this.brokerConfig.clientid,this.brokerConfig.username,this.brokerConfig.password);
var node = this;
this.client.subscribe(this.topic,2,function(topic,payload,qos,retain) {
@ -87,6 +89,12 @@ module.exports = function(RED) {
}
node.send(msg);
});
this.client.on("connectionlost",function() {
node.status({fill:"red",shape:"ring",text:"disconnected"},true);
});
this.client.on("connect",function() {
node.status({fill:"green",shape:"dot",text:"connected"},true);
});
this.client.connect();
} else {
this.error("missing broker configuration");
@ -109,8 +117,10 @@ module.exports = function(RED) {
this.broker = n.broker;
this.brokerConfig = RED.nodes.getNode(this.broker);
var node = this;
if (this.brokerConfig) {
this.status({fill:"red",shape:"ring",text:"disconnected"},true);
this.client = connectionPool.get(this.brokerConfig.broker,this.brokerConfig.port,this.brokerConfig.clientid,this.brokerConfig.username,this.brokerConfig.password);
this.on("input",function(msg) {
if (msg != null) {
@ -120,6 +130,13 @@ module.exports = function(RED) {
this.client.publish(msg);
}
});
this.client.on("connectionlost",function() {
node.status({fill:"red",shape:"ring",text:"disconnected"},true);
});
this.client.on("connect",function() {
node.status({fill:"green",shape:"dot",text:"connected"},true);
});
this.client.connect();
} else {
this.error("missing broker configuration");

View File

@ -34,6 +34,8 @@
<ul class="dropdown-menu">
<li><a id="btn-sidebar" tabindex="-1" href="#"><i class="icon-ok pull-right"></i><i class="icon-list-alt"></i> Sidebar</a></li>
<li class="divider"></li>
<li><a id="btn-node-status" tabindex="-1" href="#"><i class="icon-ok pull-right"></i><i class="icon-info-sign"></i> Node Status</a></li>
<li class="divider"></li>
<li class="dropdown-submenu pull-left"><a tabindex="-1" href="#"><i class="icon-edit"></i> Import from...</a>
<ul class="dropdown-menu">
<li><a id="btn-import" tabindex="-1" href="#"><i class="icon-edit"></i> Clipboard...</a></li>

View File

@ -161,13 +161,24 @@ var RED = function() {
var node = RED.nodes.node(parts[1]);
if (node) {
node.status = msg;
if (statusEnabled) {
node.dirty = true;
RED.view.redraw();
}
}
});
});
}
$('#btn-node-status').click(function() {toggleStatus();});
var statusEnabled = false;
function toggleStatus() {
var btnStatus = $("#btn-node-status");
statusEnabled = btnStatus.toggleClass("active").hasClass("active");
RED.view.status(statusEnabled);
}
function showHelp() {
var dialog = $('#node-help');

View File

@ -38,6 +38,7 @@ RED.view = function() {
moving_set = [],
dirty = false,
lasso = null,
showStatus = false,
clickTime = 0,
clickElapsed = 0;
@ -45,8 +46,11 @@ RED.view = function() {
var status_colours = {
"red" : "#c00",
"green": "#5a8"
"red": "#c00",
"green": "#5a8",
"yellow": "#F9DF31",
"blue": "#53A3F3",
"grey": "#d3d3d3"
}
var outer = d3.select("#chart")
@ -810,7 +814,7 @@ RED.view = function() {
var nodeEnter = node.enter().insert("svg:g").attr("class", "node nodegroup");
nodeEnter.each(function(d,i) {
var node = d3.select(this);
node.attr("id",d.id);
var l = d._def.label;
l = (typeof l === "function" ? l.call(d) : l)||"";
d.w = Math.max(node_width,calculateTextWidth(l)+(d._def.inputs>0?7:0) );
@ -1048,7 +1052,7 @@ RED.view = function() {
}
return "";
});
if (!d.status) {
if (!showStatus || !d.status) {
thisNode.selectAll('.node_status_group').style("display","none");
} else {
thisNode.selectAll('.node_status_group').style("display","inline").attr("transform","translate(3,"+(d.h+3)+")");
@ -1399,6 +1403,12 @@ RED.view = function() {
importNodes: importNodes,
resize: function() {
workspace_tabs.resize();
},
status: function(s) {
showStatus = s;
RED.nodes.eachNode(function(n) { n.dirty = true;});
//TODO: subscribe/unsubscribe here
redraw();
}
};
}();