mirror of
				https://github.com/node-red/node-red.git
				synced 2025-03-01 10:36:34 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			294 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			294 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!--
 | |
|   Copyright JS Foundation and other contributors, http://js.foundation
 | |
| 
 | |
|   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">
 | |
|         <label data-i18n="switch.label.property"></label>
 | |
|         <input type="text" id="node-input-property" style="width: 70%"/>
 | |
|     </div>
 | |
|     <div class="form-row node-input-rule-container-row">
 | |
|         <ol id="node-input-rule-container"></ol>
 | |
|     </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 node to route messages based on property values.</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><b>Note</b>: the <i>otherwise</i> rule applies as a "not any of" the rules preceding it.</p>
 | |
| </script>
 | |
| 
 | |
| <script type="text/javascript">
 | |
| (function() {
 | |
|     var operators = [
 | |
|         {v:"eq",t:"=="},
 | |
|         {v:"neq",t:"!="},
 | |
|         {v:"lt",t:"<"},
 | |
|         {v:"lte",t:"<="},
 | |
|         {v:"gt",t:">"},
 | |
|         {v:"gte",t:">="},
 | |
|         {v:"btwn",t:"switch.rules.btwn"},
 | |
|         {v:"cont",t:"switch.rules.cont"},
 | |
|         {v:"regex",t:"switch.rules.regex"},
 | |
|         {v:"true",t:"switch.rules.true"},
 | |
|         {v:"false",t:"switch.rules.false"},
 | |
|         {v:"null",t:"switch.rules.null"},
 | |
|         {v:"nnull",t:"switch.rules.nnull"},
 | |
|         {v:"else",t:"switch.rules.else"}
 | |
|     ];
 | |
| 
 | |
|     function clipValueLength(v) {
 | |
|         if (v.length > 15) {
 | |
|             return v.substring(0,15)+"...";
 | |
|         }
 | |
|         return v;
 | |
|     }
 | |
|     function getValueLabel(t,v) {
 | |
|         if (t === 'str') {
 | |
|             return '"'+clipValueLength(v)+'"';
 | |
|         } else if (t === 'msg' || t==='flow' || t==='global') {
 | |
|             return t+"."+clipValueLength(v);
 | |
|         }
 | |
|         return clipValueLength(v);
 | |
|     }
 | |
|     RED.nodes.registerType('switch', {
 | |
|         color: "#E2D96E",
 | |
|         category: 'function',
 | |
|         defaults: {
 | |
|             name: {value:""},
 | |
|             property: {value:"payload", required:true, validate: RED.validators.typedInput("propertyType")},
 | |
|             propertyType: { value:"msg" },
 | |
|             rules: {value:[{t:"eq", v:""}]},
 | |
|             checkall: {value:"true", required:true},
 | |
|             outputs: {value:1}
 | |
|         },
 | |
|         inputs: 1,
 | |
|         outputs: 1,
 | |
|         outputLabels: function(index) {
 | |
|             var rule = this.rules[index];
 | |
|             var label = "";
 | |
|             if (rule) {
 | |
|                 for (var i=0;i<operators.length;i++) {
 | |
|                     if (operators[i].v === rule.t) {
 | |
|                         label = /^switch/.test(operators[i].t)?this._(operators[i].t):operators[i].t
 | |
|                         break;
 | |
|                     }
 | |
|                 }
 | |
|                 if (rule.t === 'btwn') {
 | |
|                     label += " "+getValueLabel(rule.vt,rule.v)+" & "+getValueLabel(rule.v2t,rule.v2);
 | |
|                 } else if (rule.t !== 'true' && rule.t !== 'false' && rule.t !== 'null' && rule.t !== 'nnull' && rule.t !== 'else' ) {
 | |
|                     label += " "+getValueLabel(rule.vt,rule.v);
 | |
|                 }
 | |
|                 return label;
 | |
|             }
 | |
|         },
 | |
|         icon: "switch.png",
 | |
|         label: function() {
 | |
|             return this.name||"switch";
 | |
|         },
 | |
|         oneditprepare: function() {
 | |
|             var node = this;
 | |
|             var previousValueType = {value:"prev",label:this._("inject.previous"),hasValue:false};
 | |
| 
 | |
|             $("#node-input-property").typedInput({default:this.propertyType||'msg',types:['msg','flow','global','jsonata']});
 | |
| 
 | |
| 
 | |
|             var andLabel = this._("switch.and");
 | |
|             var caseLabel = this._("switch.ignorecase");
 | |
| 
 | |
|             function resizeRule(rule) {
 | |
|                 var newWidth = rule.width();
 | |
|                 var selectField = rule.find("select");
 | |
|                 var type = selectField.val()||"";
 | |
|                 var valueField = rule.find(".node-input-rule-value");
 | |
|                 var btwnField1 = rule.find(".node-input-rule-btwn-value");
 | |
|                 var btwnField2 = rule.find(".node-input-rule-btwn-value2");
 | |
|                 var selectWidth;
 | |
|                 if (type.length < 4) {
 | |
|                     selectWidth = 60;
 | |
|                 } else if (type === "regex") {
 | |
|                     selectWidth = 147;
 | |
|                 } else {
 | |
|                     selectWidth = 120;
 | |
|                 }
 | |
|                 selectField.width(selectWidth);
 | |
|                 if (type === "btwn") {
 | |
|                     btwnField1.typedInput("width",(newWidth-selectWidth-70));
 | |
|                     btwnField2.typedInput("width",(newWidth-selectWidth-70));
 | |
|                 } else {
 | |
|                     if (type === "true" || type === "false" || type === "null" || type === "nnull" || type === "else") {
 | |
|                         // valueField.hide();
 | |
|                     } else {
 | |
|                         valueField.typedInput("width",(newWidth-selectWidth-70));
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             $("#node-input-rule-container").css('min-height','250px').css('min-width','450px').editableList({
 | |
|                 addItem: function(container,i,opt) {
 | |
|                     if (!opt.hasOwnProperty('r')) {
 | |
|                         opt.r = {};
 | |
|                     }
 | |
|                     var rule = opt.r;
 | |
|                     if (!rule.hasOwnProperty('t')) {
 | |
|                         rule.t = 'eq';
 | |
|                     }
 | |
|                     var row = $('<div/>').appendTo(container);
 | |
|                     var row2 = $('<div/>',{style:"padding-top: 5px; padding-left: 175px;"}).appendTo(container);
 | |
|                     var row3 = $('<div/>',{style:"padding-top: 5px; padding-left: 102px;"}).appendTo(container);
 | |
|                     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(/^switch/.test(operators[d].t)?node._(operators[d].t):operators[d].t));
 | |
|                     }
 | |
|                     var valueField = $('<input/>',{class:"node-input-rule-value",type:"text",style:"margin-left: 5px;"}).appendTo(row).typedInput({default:'str',types:['msg','flow','global','str','num','jsonata',previousValueType]});
 | |
|                     var btwnValueField = $('<input/>',{class:"node-input-rule-btwn-value",type:"text",style:"margin-left: 5px;"}).appendTo(row).typedInput({default:'num',types:['msg','flow','global','str','num','jsonata',previousValueType]});
 | |
|                     var btwnAndLabel = $('<span/>',{class:"node-input-rule-btwn-label"}).text(" "+andLabel+" ").appendTo(row3);
 | |
|                     var btwnValue2Field = $('<input/>',{class:"node-input-rule-btwn-value2",type:"text",style:"margin-left:2px;"}).appendTo(row3).typedInput({default:'num',types:['msg','flow','global','str','num','jsonata',previousValueType]});
 | |
|                     var finalspan = $('<span/>',{style:"float: right;margin-top: 6px;"}).appendTo(row);
 | |
|                     finalspan.append(' → <span class="node-input-rule-index">'+(i+1)+'</span> ');
 | |
|                     var caseSensitive = $('<input/>',{id:"node-input-rule-case-"+i,class:"node-input-rule-case",type:"checkbox",style:"width:auto;vertical-align:top"}).appendTo(row2);
 | |
|                     $('<label/>',{for:"node-input-rule-case-"+i,style:"margin-left: 3px;"}).text(caseLabel).appendTo(row2);
 | |
|                     selectField.change(function() {
 | |
|                         resizeRule(container);
 | |
|                         var type = selectField.val();
 | |
|                         if (type === "btwn") {
 | |
|                             valueField.typedInput('hide');
 | |
|                             btwnValueField.typedInput('show');
 | |
|                         } else {
 | |
|                             btwnValueField.typedInput('hide');
 | |
|                             if (type === "true" || type === "false" || type === "null" || type === "nnull" || type === "else") {
 | |
|                                 valueField.typedInput('hide');
 | |
|                             } else {
 | |
|                                 valueField.typedInput('show');
 | |
|                             }
 | |
|                         }
 | |
|                         if (type === "regex") {
 | |
|                             row2.show();
 | |
|                             row3.hide();
 | |
|                         } else if (type === "btwn"){
 | |
|                             row2.hide();
 | |
|                             row3.show();
 | |
|                         } else {
 | |
|                             row2.hide();
 | |
|                             row3.hide();
 | |
|                         }
 | |
|                     });
 | |
|                     selectField.val(rule.t);
 | |
|                     if (rule.t == "btwn") {
 | |
|                         btwnValueField.typedInput('value',rule.v);
 | |
|                         btwnValueField.typedInput('type',rule.vt||'num');
 | |
|                         btwnValue2Field.typedInput('value',rule.v2);
 | |
|                         btwnValue2Field.typedInput('type',rule.v2t||'num');
 | |
|                     } else if (typeof rule.v != "undefined") {
 | |
|                         valueField.typedInput('value',rule.v);
 | |
|                         valueField.typedInput('type',rule.vt||'str');
 | |
|                     }
 | |
|                     if (rule.case) {
 | |
|                         caseSensitive.prop('checked',true);
 | |
|                     } else {
 | |
|                         caseSensitive.prop('checked',false);
 | |
|                     }
 | |
|                     selectField.change();
 | |
|                 },
 | |
|                 removeItem: function(opt) {
 | |
|                     if (opt.hasOwnProperty('i')) {
 | |
|                         var removedList = $("#node-input-rule-container").data('removedList')||[];
 | |
|                         removedList.push(opt.i);
 | |
|                         $("#node-input-rule-container").data('removedList',removedList);
 | |
|                     }
 | |
| 
 | |
|                     var rules = $("#node-input-rule-container").editableList('items');
 | |
|                     rules.each(function(i) { $(this).find(".node-input-rule-index").html(i+1); });
 | |
|                 },
 | |
|                 resizeItem: resizeRule,
 | |
|                 sortItems: function(rules) {
 | |
|                     var rules = $("#node-input-rule-container").editableList('items');
 | |
|                     rules.each(function(i) { $(this).find(".node-input-rule-index").html(i+1); });
 | |
|                 },
 | |
|                 sortable: true,
 | |
|                 removable: true
 | |
|             });
 | |
| 
 | |
|             for (var i=0;i<this.rules.length;i++) {
 | |
|                 var rule = this.rules[i];
 | |
|                 $("#node-input-rule-container").editableList('addItem',{r:rule,i:i});
 | |
|             }
 | |
|         },
 | |
|         oneditsave: function() {
 | |
|             var rules = $("#node-input-rule-container").editableList('items');
 | |
|             var ruleset;
 | |
|             var node = this;
 | |
|             node.rules = [];
 | |
|             var changedOutputs = {};
 | |
|             var removedList = $("#node-input-rule-container").data('removedList')||[];
 | |
|             removedList.forEach(function(i) {
 | |
|                 changedOutputs[i] = -1;
 | |
|             });
 | |
|             rules.each(function(i) {
 | |
|                 var ruleData = $(this).data('data');
 | |
|                 var rule = $(this);
 | |
|                 var type = rule.find("select").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").typedInput('value');
 | |
|                         r.vt = rule.find(".node-input-rule-btwn-value").typedInput('type');
 | |
|                         r.v2 = rule.find(".node-input-rule-btwn-value2").typedInput('value');
 | |
|                         r.v2t = rule.find(".node-input-rule-btwn-value2").typedInput('type');
 | |
|                     } else {
 | |
|                         r.v = rule.find(".node-input-rule-value").typedInput('value');
 | |
|                         r.vt = rule.find(".node-input-rule-value").typedInput('type');
 | |
|                     }
 | |
|                     if (type === "regex") {
 | |
|                         r.case = rule.find(".node-input-rule-case").prop("checked");
 | |
|                     }
 | |
|                 }
 | |
|                 if (ruleData.hasOwnProperty('i')) {
 | |
|                     if (ruleData.i !== i) {
 | |
|                         changedOutputs[ruleData.i] = i;
 | |
|                     }
 | |
|                 }
 | |
|                 node.rules.push(r);
 | |
|             });
 | |
|             this._outputs = changedOutputs;
 | |
|             this.outputs = node.rules.length;
 | |
|             this.propertyType = $("#node-input-property").typedInput('type');
 | |
|         },
 | |
|         oneditresize: function(size) {
 | |
|             var rows = $("#dialog-form>div:not(.node-input-rule-container-row)");
 | |
|             var height = size.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").editableList('height',height);
 | |
|         }
 | |
|     });
 | |
| })();
 | |
| </script>
 |