mirror of
https://github.com/node-red/node-red.git
synced 2023-10-10 13:36:53 +02:00
e5511ea86d
Closes #1026,#983,#982,#978 PR #1026 contains the full history of the changes made herein. Due to the volume of commits with no meaningful comment, they have been squashed down to this one. Adding bidi Files Tuning code style Adding rest of bidi files and its dependencies Tuning code style editing numeric shaping value Tuning Code style adding bidi support Adding Bidi Support for the rest of files Adding Bidi support Editing Bidi menu adding mirroring enablement handeling code style Addinng Bidi Support Adding Bidi Support Adding locale settings to national calendar support Adding Numeric Shaping Support scss files after adding rtl direction part 1 adding rtl direction at scss files part2 adding right directionality at comman typeInput correcting some comments editing spaces applying code style editing code style editing code style editing code style editing code style adding right directionality adding right directionality adding style in case of right directionality adding style in case of right directionality adding style in case of right directionality create a global variable for ui direction to call it once need Update main.js Update typedInput.js Update 10-switch.html manage palette mirroring adding RTL directionality to Tabs and Manage palette Style Editing Adding mirroring to subflow workspace handle mirroring defects at manage palette Handle Mirroring defects at sidebar seperator Numeric Shaping Updates Editing code style Handling mirroring defects Handling mirroring defects Fixing mirroring defects editing code style fixing mirroring defects at deploy dialog editing code style Updating Bidi Support handling some reviewing comments handling chicks Update base-text-dir.js Update bidi-util.js Update bidi-util.js Handling reviewing comment Fixing Popover mirroring defect Handling namespace structure for bidi features reflecting new namespace structure for bidi features at editorfiles Handling comments that related to css moving bidi.js under js/bidi folder
382 lines
18 KiB
HTML
382 lines
18 KiB
HTML
<!--
|
|
Copyright 2013, 2016 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-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="0">0</option>
|
|
<option value="1">1</option>
|
|
<option value="2">2</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>
|
|
</script>
|
|
|
|
<script type="text/x-red" data-help-name="mqtt in">
|
|
<p>Connects to a broker and subscribes to the specified topic.</p>
|
|
<p>Outputs a message with the properties:</p>
|
|
<ul>
|
|
<li><code>msg.topic</code></li>
|
|
<li><code>msg.payload</code></li>
|
|
<li><code>msg.qos</code></li>
|
|
<li><code>msg.retain</code></li>
|
|
</ul>
|
|
<p><code>msg.payload</code> will be a String, unless it is detected as a binary buffer.</p>
|
|
</script>
|
|
|
|
<script type="text/javascript">
|
|
RED.nodes.registerType('mqtt in',{
|
|
category: 'input',
|
|
defaults: {
|
|
name: {value:""},
|
|
topic: {value:"",required:true,validate: RED.validators.regex(/^(#$|(\+|[^+#]*)(\/(\+|[^+#]*))*(\/(\+|#|[^+#]*))?$)/)},
|
|
qos: {value: "2"},
|
|
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":"";
|
|
},
|
|
oneditprepare: function() {
|
|
if (this.qos === undefined) {
|
|
$("#node-input-qos").val("2");
|
|
}
|
|
}
|
|
});
|
|
</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>
|
|
<i class="fa fa-history"></i> <span data-i18n="mqtt.retain"></span> <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 messages.</p>
|
|
<p><code>msg.payload</code> is used as the payload of the published message.
|
|
If it contains an Object it will be converted to JSON before being sent.
|
|
</p>
|
|
<p>The topic used can be configured in the node or, if left blank, can be set
|
|
by <code>msg.topic</code>.</p>
|
|
<p>Likewise the QoS and retain values can be configured in the node or, if left
|
|
blank, set by <code>msg.qos</code> and <code>msg.retain</code> respectively.
|
|
By default, messages are published at QoS 0 with the retain flag set to false.</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">
|
|
<ul style="background: #fff; min-width: 600px; margin-bottom: 20px;" id="node-config-mqtt-broker-tabs"></ul>
|
|
</div>
|
|
<div id="node-config-mqtt-broker-tabs-content" style="min-height: 170px;">
|
|
<div id="mqtt-broker-tab-connection" style="display:none">
|
|
<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="e.g. localhost" style="width: 40%;" >
|
|
<label for="node-config-input-port" id="node-config-label-port"> <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">
|
|
<input type="checkbox" id="node-config-input-usetls" style="display: inline-block; width: auto; vertical-align: top;">
|
|
<label for="node-config-input-usetls" style="width: auto" data-i18n="mqtt.label.use-tls"></label>
|
|
<div id="node-config-row-tls" class="hide">
|
|
<label style="width: auto; margin-left: 20px; margin-right: 10px;" for="node-config-input-tls"><span data-i18n="mqtt.label.tls-config"></span></label><input style="width: 300px;" type="text" id="node-config-input-tls">
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<label for="node-config-input-clientid"><i class="fa fa-tag"></i> <span data-i18n="mqtt.label.clientid"></span></label>
|
|
<input type="text" id="node-config-input-clientid" data-i18n="[placeholder]mqtt.placeholder.clientid">
|
|
</div>
|
|
<div class="form-row">
|
|
<label for="node-config-input-keepalive" style="width: auto"><i class="fa fa-clock-o"></i> <span data-i18n="mqtt.label.keepalive"></span></label>
|
|
<input type="text" id="node-config-input-keepalive" style="width: 50px">
|
|
<input type="checkbox" id="node-config-input-cleansession">
|
|
<label for="node-config-input-cleansession" style="width: auto;" data-i18n="mqtt.label.cleansession"></label>
|
|
</div>
|
|
<div class="form-row">
|
|
<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: auto;" data-i18n="mqtt.label.compatmode"></label>
|
|
</div>
|
|
</div>
|
|
<div id="mqtt-broker-tab-security" style="display:none">
|
|
<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>
|
|
</div>
|
|
<div id="mqtt-broker-tab-birth" style="display:none">
|
|
<div class="form-row">
|
|
<label for="node-config-input-birthTopic"><i class="fa fa-tasks"></i> <span data-i18n="common.label.topic"></span></label>
|
|
<input type="text" id="node-config-input-birthTopic" data-i18n="[placeholder]mqtt.placeholder.birth-topic">
|
|
</div>
|
|
<div class="form-row">
|
|
<label for="node-config-input-birthQos"><i class="fa fa-empire"></i> <span data-i18n="mqtt.label.qos"></span></label>
|
|
<select id="node-config-input-birthQos" style="width:125px !important">
|
|
<option value="0">0</option>
|
|
<option value="1">1</option>
|
|
<option value="2">2</option>
|
|
</select>
|
|
<i class="fa fa-history"></i> <span data-i18n="mqtt.retain"></span> <select id="node-config-input-birthRetain" style="width:125px !important">
|
|
<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-config-input-birthPayload"><i class="fa fa-envelope"></i> <span data-i18n="common.label.payload"></span></label>
|
|
<input type="text" id="node-config-input-birthPayload" data-i18n="[placeholder]common.label.payload">
|
|
</div>
|
|
</div>
|
|
<div id="mqtt-broker-tab-will" style="display:none">
|
|
<div class="form-row">
|
|
<label for="node-config-input-willTopic"><i class="fa fa-tasks"></i> <span data-i18n="common.label.topic"></span></label>
|
|
<input type="text" id="node-config-input-willTopic" data-i18n="[placeholder]mqtt.placeholder.will-topic">
|
|
</div>
|
|
<div class="form-row">
|
|
<label for="node-config-input-willQos"><i class="fa fa-empire"></i> <span data-i18n="mqtt.label.qos"></span></label>
|
|
<select id="node-config-input-willQos" style="width:125px !important">
|
|
<option value="0">0</option>
|
|
<option value="1">1</option>
|
|
<option value="2">2</option>
|
|
</select>
|
|
<i class="fa fa-history"></i> <span data-i18n="mqtt.retain"></span> <select id="node-config-input-willRetain" style="width:125px !important">
|
|
<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-config-input-willPayload"><i class="fa fa-envelope"></i> <span data-i18n="common.label.payload"></span></label>
|
|
<input type="text" id="node-config-input-willPayload" data-i18n="[placeholder]common.label.payload">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/x-red" data-help-name="mqtt-broker">
|
|
<p>A minimum MQTT broker connection requires only a broker server address to be added to the default configuration.</p>
|
|
<p>To secure the connection with SSL/TLS, a TLS Configuration must also be configured and selected.</p>
|
|
<p>If you create a Client ID it must be unique to the broker you are connecting to.</p>
|
|
<p>For more information about MQTT see the <a href="http://www.eclipse.org/paho/" target="_blank">Eclipse Paho</a> site.</p>
|
|
</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()},
|
|
tls: {type:"tls-config",required: false},
|
|
clientid: {value:"", validate: function(v) {
|
|
if ($("#node-config-input-clientid").length) {
|
|
// Currently editing the node
|
|
return $("#node-config-input-cleansession").is(":checked") || (v||"").length > 0;
|
|
} else {
|
|
return (this.cleansession===undefined || this.cleansession) || (v||"").length > 0;
|
|
}
|
|
}},
|
|
usetls: {value: false},
|
|
verifyservercert: { value: false},
|
|
compatmode: { value: true},
|
|
keepalive: {value:60,validate:RED.validators.number()},
|
|
cleansession: {value: true},
|
|
willTopic: {value:""},
|
|
willQos: {value:"0"},
|
|
willRetain: {value:false},
|
|
willPayload: {value:""},
|
|
birthTopic: {value:""},
|
|
birthQos: {value:"0"},
|
|
birthRetain: {value:false},
|
|
birthPayload: {value:""}
|
|
},
|
|
credentials: {
|
|
user: {type:"text"},
|
|
password: {type: "password"}
|
|
},
|
|
label: function() {
|
|
var b = this.broker;
|
|
if (b === "") { b = "undefined"; }
|
|
return (this.clientid?this.clientid+"@":"")+b+":"+this.port;
|
|
},
|
|
oneditprepare: function () {
|
|
var tabs = RED.tabs.create({
|
|
id: "node-config-mqtt-broker-tabs",
|
|
onchange: function(tab) {
|
|
$("#node-config-mqtt-broker-tabs-content").children().hide();
|
|
$("#" + tab.id).show();
|
|
}
|
|
});
|
|
tabs.addTab({
|
|
id: "mqtt-broker-tab-connection",
|
|
label: this._("mqtt.tabs-label.connection")
|
|
});
|
|
tabs.addTab({
|
|
id: "mqtt-broker-tab-security",
|
|
label: this._("mqtt.tabs-label.security")
|
|
});
|
|
tabs.addTab({
|
|
id: "mqtt-broker-tab-birth",
|
|
label: this._("mqtt.tabs-label.birth")
|
|
});
|
|
tabs.addTab({
|
|
id: "mqtt-broker-tab-will",
|
|
label: this._("mqtt.tabs-label.will")
|
|
});
|
|
setTimeout(function() { tabs.resize()},0);
|
|
if (typeof this.cleansession === 'undefined') {
|
|
this.cleansession = true;
|
|
$("#node-config-input-cleansession").prop("checked",true);
|
|
}
|
|
if (typeof this.usetls === 'undefined') {
|
|
this.usetls = false;
|
|
$("#node-config-input-usetls").prop("checked",false);
|
|
}
|
|
if (typeof this.compatmode === 'undefined') {
|
|
this.compatmode = true;
|
|
$("#node-config-input-compatmode").prop('checked', true);
|
|
}
|
|
if (typeof this.keepalive === 'undefined') {
|
|
this.keepalive = 15;
|
|
$("#node-config-input-keepalive").val(this.keepalive);
|
|
}
|
|
if (typeof this.willQos === 'undefined') {
|
|
this.willQos = "0";
|
|
$("#node-config-input-willQos").val("0");
|
|
}
|
|
if (typeof this.birthQos === 'undefined') {
|
|
this.birthQos = "0";
|
|
$("#node-config-input-birthQos").val("0");
|
|
}
|
|
|
|
function updateTLSOptions() {
|
|
if ($("#node-config-input-usetls").is(':checked')) {
|
|
$("#node-config-row-tls").show();
|
|
} else {
|
|
$("#node-config-row-tls").hide();
|
|
}
|
|
}
|
|
updateTLSOptions();
|
|
$("#node-config-input-usetls").on("click",function() {
|
|
updateTLSOptions();
|
|
});
|
|
var node = this;
|
|
function updateClientId() {
|
|
if ($("#node-config-input-cleansession").is(":checked")) {
|
|
$("#node-config-input-clientid").attr("placeholder",node._("mqtt.placeholder.clientid"));
|
|
} else {
|
|
$("#node-config-input-clientid").attr("placeholder",node._("mqtt.placeholder.clientid-nonclean"));
|
|
}
|
|
$("#node-config-input-clientid").change();
|
|
}
|
|
setTimeout(updateClientId,0);
|
|
$("#node-config-input-cleansession").on("click",function() {
|
|
updateClientId();
|
|
});
|
|
},
|
|
oneditsave: function() {
|
|
if (!$("#node-config-input-usetls").is(':checked')) {
|
|
$("#node-config-input-tls").val("");
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style>
|
|
#node-config-label-port {
|
|
margin-left: 10px;
|
|
width: 35px;
|
|
}
|
|
[dir="rtl"] #node-config-label-port{
|
|
margin-left: 0;
|
|
margin-right: 10px;
|
|
}
|
|
#node-config-input-cleansession {
|
|
margin-left: 30px;
|
|
height: 1em;
|
|
display: inline-block;
|
|
width: auto;
|
|
vertical-align: middle;
|
|
}
|
|
[dir="rtl"] #node-config-input-cleansession {
|
|
margin-left: 0px;
|
|
margin-right: 30px;
|
|
}
|
|
</style>
|