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:
parent
ec5985eaa3
commit
7e85eb297d
@ -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");
|
||||
|
@ -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>
|
||||
|
@ -161,13 +161,24 @@ var RED = function() {
|
||||
var node = RED.nodes.node(parts[1]);
|
||||
if (node) {
|
||||
node.status = msg;
|
||||
node.dirty = true;
|
||||
RED.view.redraw();
|
||||
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');
|
||||
|
@ -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();
|
||||
}
|
||||
};
|
||||
}();
|
||||
|
Loading…
Reference in New Issue
Block a user