node-red/nodes/core/io/10-mqtt.html

<!--
  Copyright 2013,2015 IBM Corp.
  Licensed under the Apache License, Version 2.0 (the "License");
  you may not use this file except in compliance with the License.
  You may obtain a copy of the License at
  http://www.apache.org/licenses/LICENSE-2.0
  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->

<script type="text/x-red" data-template-name="mqtt in">
    <div class="form-row">
        <label for="node-input-broker"><i class="fa fa-globe"></i> <span data-i18n="mqtt.label.broker"></span></label>
        <input type="text" id="node-input-broker">
    </div>
    <div class="form-row">
        <label for="node-input-topic"><i class="fa fa-tasks"></i> <span data-i18n="common.label.topic"></span></label>
        <input type="text" id="node-input-topic" data-i18n="[placeholder]common.label.topic">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
    </div>
</script>

<script type="text/x-red" data-help-name="mqtt in">
    <p>MQTT input node. Connects to a broker and subscribes to the specified topic. The topic may contain MQTT wildcards.</p>
    <p>Outputs an object called <b>msg</b> containing <b>msg.topic, msg.payload, msg.qos</b> and <b>msg.retain</b>.</p>
    <p><b>msg.payload</b> is usually a string, but can also be a binary buffer.</p>
    <p>If a secure connection is being used, certificate checking can be disabled to allow connections to brokers using a self signed or non-trusted CA certificate.</p>
    <p>Compatibility mode allows connections to brokers which do not support the MQTT V3.1.1 standard.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('mqtt in',{
        category: 'input',
        defaults: {
            name: {value:""},
            topic: {value:"",required:true},
            broker: {type:"mqtt-broker", required:true}
        },
        color:"#d8bfd8",
        inputs:0,
        outputs:1,
        icon: "bridge.png",
        label: function() {
            return this.name||this.topic||"mqtt";
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="mqtt out">
    <div class="form-row">
        <label for="node-input-broker"><i class="fa fa-globe"></i> <span data-i18n="mqtt.label.broker"></span></label>
        <input type="text" id="node-input-broker">
    </div>
    <div class="form-row">
        <label for="node-input-topic"><i class="fa fa-tasks"></i> <span data-i18n="common.label.topic"></span></label>
        <input type="text" id="node-input-topic" data-i18n="[placeholder]common.label.topic">
    </div>
    <div class="form-row">
        <label for="node-input-qos"><i class="fa fa-empire"></i> <span data-i18n="mqtt.label.qos"></span></label>
        <select id="node-input-qos" style="width:125px !important">
            <option value=""></option>
            <option value="0">0</option>
            <option value="1">1</option>
            <option value="2">2</option>
        </select>
        &nbsp;&nbsp;<i class="fa fa-history"></i>&nbsp;<span data-i18n="mqtt.retain"></span> &nbsp;<select id="node-input-retain" style="width:125px !important">
            <option value=""></option>
            <option value="false" data-i18n="mqtt.false"></option>
            <option value="true" data-i18n="mqtt.true"></option>
        </select>
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
    </div>
    <div class="form-tips"><span data-i18n="mqtt.tip"></span></div>
</script>

<script type="text/x-red" data-help-name="mqtt out">
    <p>Connects to a MQTT broker and publishes <b>msg.payload</b> either to the <b>msg.topic</b> or to the topic specified in the edit window. The value in the edit window has precedence.</p>
    <p>Likewise QoS and/or retain values in the edit panel will overwrite any <b>msg.qos</b> and <b>msg.retain</b> properties. If nothing is set they default to <i>0</i> and <i>false</i> respectively.</p>
    <p>If <b>msg.payload</b> contains an object it will be stringified before being sent.</p>
    <p>If a secure connection is being used, certificate checking can be disabled to allow connections to brokers using a self signed or non-trusted CA certificate.</p>
    <p>Compatibility mode allows connections to brokers which do not support the MQTT V3.1.1 standard.</p>

</script>

<script type="text/javascript">
    RED.nodes.registerType('mqtt out',{
        category: 'output',
        defaults: {
            name: {value:""},
            topic: {value:""},
            qos: {value:""},
            retain: {value:""},
            broker: {type:"mqtt-broker", required:true}
        },
        color:"#d8bfd8",
        inputs:1,
        outputs:0,
        icon: "bridge.png",
        align: "right",
        label: function() {
            return this.name||this.topic||"mqtt";
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="mqtt-broker">
    <div class="form-row node-input-broker">
        <label for="node-config-input-broker"><i class="fa fa-globe"></i> <span data-i18n="mqtt.label.broker"></span></label>
        <input class="input-append-left" type="text" id="node-config-input-broker" placeholder="localhost" style="width: 40%;" >
        <label for="node-config-input-port" style="margin-left: 10px; width: 35px; "> <span data-i18n="mqtt.label.port"></span></label>
        <input type="text" id="node-config-input-port" data-i18n="[placeholder]mqtt.label.port" style="width:45px">
    </div>
    <div class="form-row">
        <label>&nbsp;</label>
        <input type="checkbox" id="node-config-input-secureconn" style="display: inline-block; width: auto; vertical-align: top;">
        <label for="node-config-input-secureconn" style="width: 70%;">Enable secure (SSL/TLS) connection</label>
    </div>
    <div class="form-row" id="row-disablecertauth">
        <label>&nbsp;</label>
        <input type="checkbox" id="node-config-input-disablecertauth" style="display: inline-block; width: auto; vertical-align: top;">
        <label for="node-config-input-disablecertauth" style="width: 70%;">Disable certificate authentication (secure connections only)</label>
    </div>
    <div class="form-row">
        <label>&nbsp;</label>
        <input type="checkbox" id="node-config-input-compatmode" style="display: inline-block; width: auto; vertical-align: top;">
        <label for="node-config-input-compatmode" style="width: 70%;">Compatibility for brokers not supporting MQTT v3.1.1</label>
    </div>
    <div class="form-row">
        <label for="node-config-input-clientid"><i class="fa fa-tag"></i> Client ID</label>
        <input type="text" id="node-config-input-clientid" placeholder="Leave blank for auto generated">
    </div>
    <div class="form-row">
        <label for="node-config-input-user"><i class="fa fa-user"></i> <span data-i18n="common.label.username"></span></label>
        <input type="text" id="node-config-input-user">
    </div>
    <div class="form-row">
        <label for="node-config-input-password"><i class="fa fa-lock"></i> <span data-i18n="common.label.password"></span></label>
        <input type="password" id="node-config-input-password">
    </div>
</script>

<script type="text/javascript">
    RED.nodes.registerType('mqtt-broker',{
        category: 'config',
        defaults: {
            broker: {value:"",required:true},
            port: {value:1883,required:true,validate:RED.validators.number()},
            clientid: { value:"" },
            secureconn: {value: false},
            disablecertauth: { value: false},
            compatmode: { value: true},
            mqttkeepalive: {value:15}
        },
        credentials: {
            user: {type:"text"},
            password: {type: "password"}
        },
        label: function() {
            if (this.broker == "") { this.broker = "localhost"; }
            return (this.clientid?this.clientid+"@":"")+this.broker+":"+this.port;
        },
        oneditprepare: function () {
            if (this.broker && typeof this.secureconn  === 'undefined'){
                this.secureconn = false;
            }
            if (this.broker && typeof this.disablecertauth  === 'undefined'){
                this.disablecertauth = false;
            }
            if (this.broker && typeof this.compatmode  === 'undefined'){
                this.compatmode = true;
                $("#node-config-input-compatmode").prop('checked', true);
            }
            if (this.broker && typeof this.mqttkeepalive  === 'undefined'){
                this.mqttkeepalive = 15;
            }

            if (this.secureconn == true) {
                $("#row-disablecertauth").show();
            } else {
                $("#row-disablecertauth").hide();
            }

            $("#node-config-input-secureconn").on("click",function() {
                if($(this).is(':checked')) {
                    $("#row-disablecertauth").show();
                } else {
                    $("#row-disablecertauth").hide();
                }
            });
        }
    });
</script>