mirror of
https://github.com/node-red/node-red.git
synced 2023-10-10 13:36:53 +02:00
224 lines
10 KiB
HTML
224 lines
10 KiB
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="switch">
|
|
<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-row">
|
|
<span data-i18n="switch.label.property"></span> msg.<input type="text" id="node-input-property" style="width: 200px;"/>
|
|
</div>
|
|
<div class="form-row node-input-rule-container-row" style="margin-bottom: 0px;">
|
|
<div id="node-input-rule-container-div" style="box-sizing: border-box; border-radius: 5px; height: 310px; padding: 5px; border: 1px solid #ccc; overflow-y:scroll;">
|
|
<ol id="node-input-rule-container" style=" list-style-type:none; margin: 0;"></ol>
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<a href="#" class="editor-button" id="node-input-add-rule" style="margin-top: 4px;"><i class="fa fa-plus"></i> <span data-i18n="switch.label.rule"></span></a>
|
|
</div>
|
|
<div class="form-row">
|
|
<select id="node-input-checkall" style="width:100%; margin-right:5px;">
|
|
<option value="true" data-i18n="switch.checkall"></option>
|
|
<option value="false" data-i18n="switch.stopfirst"></option>
|
|
</select>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/x-red" data-help-name="switch">
|
|
<p>A simple function node to route messages based on its properties.</p>
|
|
<p>When a message arrives, the selected property is evaluated against each
|
|
of the defined rules. The message is then sent to the output of <i>all</i>
|
|
rules that pass.</p>
|
|
<p>Note: the <i>otherwise</i> rule applies as a "not any of" the rules preceding it.</p>
|
|
</script>
|
|
|
|
<script type="text/javascript">
|
|
RED.nodes.registerType('switch', {
|
|
color: "#E2D96E",
|
|
category: 'function',
|
|
defaults: {
|
|
name: {value:""},
|
|
property: {value:"payload", required:true},
|
|
rules: {value:[{t:"eq", v:""}]},
|
|
checkall: {value:"true", required:true},
|
|
outputs: {value:1}
|
|
},
|
|
inputs: 1,
|
|
outputs: 1,
|
|
icon: "switch.png",
|
|
label: function() {
|
|
return this.name||"switch";
|
|
},
|
|
oneditprepare: function() {
|
|
|
|
var operators = [
|
|
{v:"eq",t:"=="},
|
|
{v:"neq",t:"!="},
|
|
{v:"lt",t:"<"},
|
|
{v:"lte",t:"<="},
|
|
{v:"gt",t:">"},
|
|
{v:"gte",t:">="},
|
|
{v:"btwn",t:this._("switch.rules.btwn")},
|
|
{v:"cont",t:this._("switch.rules.cont")},
|
|
{v:"regex",t:this._("switch.rules.regex")},
|
|
{v:"true",t:this._("switch.rules.true")},
|
|
{v:"false",t:this._("switch.rules.false")},
|
|
{v:"null",t:this._("switch.rules.null")},
|
|
{v:"nnull",t:this._("switch.rules.nnull")},
|
|
{v:"else",t:this._("switch.rules.else")}
|
|
];
|
|
|
|
function generateRule(i,rule) {
|
|
var container = $('<li/>',{style:"background: #fff; margin:0; padding:8px 0px; border-bottom: 1px solid #ccc;"});
|
|
var row = $('<div/>').appendTo(container);
|
|
var row2 = $('<div/>',{style:"padding-top: 5px; text-align: right;"}).appendTo(container);
|
|
$('<i style="color: #eee; cursor: move;" class="node-input-rule-handle fa fa-bars"></i>').appendTo(row);
|
|
|
|
var selectField = $('<select/>',{style:"width:120px; margin-left: 5px; text-align: center;"}).appendTo(row);
|
|
for (var d in operators) {
|
|
selectField.append($("<option></option>").val(operators[d].v).text(operators[d].t));
|
|
}
|
|
|
|
var valueField = $('<input/>',{class:"node-input-rule-value",type:"text",style:"margin-left: 5px; width: 145px;"}).appendTo(row);
|
|
var btwnField = $('<span/>').appendTo(row);
|
|
var btwnValueField = $('<input/>',{class:"node-input-rule-btwn-value",type:"text",style:"margin-left: 5px; width: 50px;"}).appendTo(btwnField);
|
|
btwnField.append(" and ");
|
|
var btwnValue2Field = $('<input/>',{class:"node-input-rule-btwn-value2",type:"text",style:"width: 50px;margin-left:2px;"}).appendTo(btwnField);
|
|
|
|
var finalspan = $('<span/>',{style:"float: right;margin-right: 10px;"}).appendTo(row);
|
|
finalspan.append(' → <span class="node-input-rule-index">'+i+'</span> ');
|
|
|
|
var deleteButton = $('<a/>',{href:"#",class:"editor-button", style:"margin-left: 5px;"}).appendTo(finalspan);
|
|
$('<i/>',{class:"fa fa-remove"}).appendTo(deleteButton);
|
|
|
|
selectField.change(function() {
|
|
var type = selectField.children("option:selected").val();
|
|
if (type.length < 4) {
|
|
selectField.css({"width":"60px"});
|
|
} else if (type === "regex") {
|
|
selectField.css({"width":"147px"});
|
|
} else {
|
|
selectField.css({"width":"120px"});
|
|
}
|
|
if (type === "btwn") {
|
|
valueField.hide();
|
|
btwnField.show();
|
|
} else {
|
|
btwnField.hide();
|
|
if (type === "true" || type === "false" || type === "null" || type === "nnull" || type === "else") {
|
|
valueField.hide();
|
|
} else {
|
|
valueField.show();
|
|
}
|
|
}
|
|
});
|
|
|
|
|
|
deleteButton.click(function() {
|
|
container.css({"background":"#fee"});
|
|
container.fadeOut(300, function() {
|
|
$(this).remove();
|
|
$("#node-input-rule-container").children().each(function(i) {
|
|
$(this).find(".node-input-rule-index").html(i+1);
|
|
});
|
|
|
|
});
|
|
});
|
|
|
|
$("#node-input-rule-container").append(container);
|
|
|
|
selectField.find("option").filter(function() {return $(this).val() == rule.t;}).attr('selected',true);
|
|
if (rule.t == "btwn") {
|
|
btwnValueField.val(rule.v);
|
|
btwnValue2Field.val(rule.v2);
|
|
} else if (typeof rule.v != "undefined") {
|
|
valueField.val(rule.v);
|
|
}
|
|
selectField.change();
|
|
}
|
|
|
|
$("#node-input-add-rule").click(function() {
|
|
generateRule($("#node-input-rule-container").children().length+1,{t:"",v:"",v2:""});
|
|
$("#node-input-rule-container-div").scrollTop($("#node-input-rule-container-div").get(0).scrollHeight);
|
|
});
|
|
|
|
for (var i=0;i<this.rules.length;i++) {
|
|
var rule = this.rules[i];
|
|
generateRule(i+1,rule);
|
|
}
|
|
|
|
function switchDialogResize() {
|
|
var rows = $("#dialog-form>div:not(.node-input-rule-container-row)");
|
|
var height = $("#dialog-form").height();
|
|
for (var i=0;i<rows.size();i++) {
|
|
height -= $(rows[i]).outerHeight(true);
|
|
}
|
|
var editorRow = $("#dialog-form>div.node-input-rule-container-row");
|
|
height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
|
$("#node-input-rule-container-div").css("height",height+"px");
|
|
};
|
|
|
|
$( "#node-input-rule-container" ).sortable({
|
|
axis: "y",
|
|
update: function( event, ui ) {
|
|
var rules = $("#node-input-rule-container").children();
|
|
rules.each(function(i) {
|
|
$(this).find(".node-input-rule-index").html(i+1);
|
|
});
|
|
},
|
|
handle:".node-input-rule-handle",
|
|
cursor: "move"
|
|
});
|
|
$( "#node-input-rule-container .node-input-rule-handle" ).disableSelection();
|
|
|
|
$( "#dialog" ).on("dialogresize", switchDialogResize);
|
|
$( "#dialog" ).one("dialogopen", function(ev) {
|
|
var size = $( "#dialog" ).dialog('option','sizeCache-switch');
|
|
if (size) {
|
|
$("#dialog").dialog('option','width',size.width);
|
|
$("#dialog").dialog('option','height',size.height);
|
|
switchDialogResize();
|
|
}
|
|
});
|
|
$( "#dialog" ).one("dialogclose", function(ev,ui) {
|
|
$( "#dialog" ).off("dialogresize",switchDialogResize);
|
|
});
|
|
},
|
|
oneditsave: function() {
|
|
var rules = $("#node-input-rule-container").children();
|
|
var ruleset;
|
|
var node = this;
|
|
node.rules= [];
|
|
rules.each(function(i) {
|
|
var rule = $(this);
|
|
var type = rule.find("select option:selected").val();
|
|
var r = {t:type};
|
|
if (!(type === "true" || type === "false" || type === "null" || type === "nnull" || type === "else")) {
|
|
if (type === "btwn") {
|
|
r.v = rule.find(".node-input-rule-btwn-value").val();
|
|
r.v2 = rule.find(".node-input-rule-btwn-value2").val();
|
|
} else {
|
|
r.v = rule.find(".node-input-rule-value").val();
|
|
}
|
|
}
|
|
node.rules.push(r);
|
|
});
|
|
node.outputs = node.rules.length;
|
|
}
|
|
});
|
|
</script>
|