Files
node-red-contrib-ui-cocktail/button-group.js
T

60 lines
2.4 KiB
JavaScript

module.exports = function (RED) {
function ButtonGroupNode(config) {
var ui = undefined;
try {
var node = this;
if (ui === undefined) {
ui = RED.require("node-red-dashboard")(RED);
}
RED.nodes.createNode(this, config);
var sizes = ui.getSizes();
var widthPx = config.buttonwidth * sizes.sx - sizes.gx;
var heightPx = config.buttonheight * sizes.sy - sizes.gy;
var html = `<div style="width=100%; height=100%">
<md-button id="{{$index}}" style="width:${widthPx}px; height:${heightPx}px; margin: ${sizes.gx}px ${sizes.gy}px; background-color: {{button.color}}; white-space: pre-wrap; word-break: break-word;" ng-click="buttonClick($event)" ng-repeat="button in msg.buttons">{{button.label}}</md-button>
</div>`;
var done = ui.addWidget({
node: node,
order: config.order,
group: config.group,
width: config.width,
height: config.height,
format: html,
templateScope: 'local',
emitOnlyNewValues: false,
forwardInputMessages: false,
storeFrontEndInputAsState: false,
convertBack: function (value) {
return value;
},
beforeEmit: function (msg, value) {
return { msg: { buttons: value, socketid: msg.socketid } };
},
beforeSend: function (msg, orig) {
if (orig) {
orig.msg.topic = config.topic;
return orig.msg;
}
},
initController: function ($scope, events) {
$scope.buttonClick = function (e) {
e.preventDefault();
var buttonId = e.target.id;
if ($scope.msg.buttons[buttonId].payload) {
$scope.send({ "payload": $scope.msg.buttons[buttonId].payload });
}
};
}
});
} catch (e) {
console.log(e)
}
node.on('close', done);
}
RED.nodes.registerType("ui_button_group", ButtonGroupNode);
}