mirror of
				https://github.com/node-red/node-red.git
				synced 2025-03-01 10:36:34 +00:00 
			
		
		
		
	Add credential type to TypedInput
This commit is contained in:
		| @@ -757,7 +757,8 @@ | ||||
|             "bin": "buffer", | ||||
|             "date": "timestamp", | ||||
|             "jsonata": "expression", | ||||
|             "env": "env variable" | ||||
|             "env": "env variable", | ||||
|             "cred": "credential" | ||||
|         } | ||||
|     }, | ||||
|     "editableList": { | ||||
|   | ||||
| @@ -164,6 +164,77 @@ | ||||
|                     } | ||||
|                 }) | ||||
|             } | ||||
|         }, | ||||
|         cred:{ | ||||
|             value:"cred", | ||||
|             label:"credential", | ||||
|             icon:"fa fa-lock", | ||||
|             inputType: "password", | ||||
|             valueLabel: function(container,value) { | ||||
|                 var that = this; | ||||
|                 container.css("pointer-events","none"); | ||||
|                 var buttons = $('<div>').css({ | ||||
|                     position: "absolute", | ||||
|                     right:"6px", | ||||
|                     top: "6px", | ||||
|                     "pointer-events":"all" | ||||
|                 }).appendTo(container); | ||||
|                 var eyeButton = $('<button type="button" class="red-ui-button red-ui-button-small"></button>').css({ | ||||
|                     width:"20px" | ||||
|                 }).appendTo(buttons).on("click", function(evt) { | ||||
|                     evt.preventDefault(); | ||||
|                     var currentType = that.input.attr("type"); | ||||
|                     if (currentType === "text") { | ||||
|                         that.input.attr("type","password"); | ||||
|                         eyeCon.removeClass("fa-eye-slash").addClass("fa-eye"); | ||||
|                     } else { | ||||
|                         that.input.attr("type","text"); | ||||
|                         eyeCon.removeClass("fa-eye").addClass("fa-eye-slash"); | ||||
|                     } | ||||
|                 }).hide(); | ||||
|                 var eyeCon = $('<i class="fa fa-eye"></i>').css("margin-left","-1px").appendTo(eyeButton); | ||||
|  | ||||
|                 if (value === "__PWRD__") { | ||||
|                     var innerContainer = $('<div><i class="fa fa-asterisk"></i><i class="fa fa-asterisk"></i><i class="fa fa-asterisk"></i><i class="fa fa-asterisk"></i><i class="fa fa-asterisk"></i></div>').css({ | ||||
|                         padding:"6px 6px", | ||||
|                         borderRadius:"4px" | ||||
|                     }).addClass("red-ui-typedInput-value-label-inactive").appendTo(container); | ||||
|                     var editButton = $('<button type="button" class="red-ui-button red-ui-button-small"><i class="fa fa-pencil"></i></button>').appendTo(buttons).on("click", function(evt) { | ||||
|                         evt.preventDefault(); | ||||
|                         innerContainer.hide(); | ||||
|                         container.css("background","none"); | ||||
|                         container.css("pointer-events","none"); | ||||
|                         that.input.val(""); | ||||
|                         that.element.val(""); | ||||
|                         that.elementDiv.show(); | ||||
|                         editButton.hide(); | ||||
|                         cancelButton.show(); | ||||
|                         eyeButton.show(); | ||||
|                         setTimeout(function() { | ||||
|                             that.input.focus(); | ||||
|                         },50); | ||||
|                     }); | ||||
|                     var cancelButton = $('<button type="button" class="red-ui-button red-ui-button-small"><i class="fa fa-times"></i></button>').css("margin-left","3px").appendTo(buttons).on("click", function(evt) { | ||||
|                         evt.preventDefault(); | ||||
|                         innerContainer.show(); | ||||
|                         container.css("background",""); | ||||
|                         that.input.val("__PWRD__"); | ||||
|                         that.element.val("__PWRD__"); | ||||
|                         that.elementDiv.hide(); | ||||
|                         editButton.show(); | ||||
|                         cancelButton.hide(); | ||||
|                         eyeButton.hide(); | ||||
|                         that.input.attr("type","password"); | ||||
|                         eyeCon.removeClass("fa-eye-slash").addClass("fa-eye"); | ||||
|  | ||||
|                     }).hide(); | ||||
|                 } else { | ||||
|                     container.css("background","none"); | ||||
|                     container.css("pointer-events","none"); | ||||
|                     this.elementDiv.show(); | ||||
|                     eyeButton.show(); | ||||
|                 } | ||||
|             } | ||||
|         } | ||||
|     }; | ||||
|     var nlsd = false; | ||||
| @@ -220,6 +291,8 @@ | ||||
|                 that.input.attr(d,m); | ||||
|             }); | ||||
|  | ||||
|             this.defaultInputType = this.input.attr('type'); | ||||
|  | ||||
|             this.uiSelect.addClass("red-ui-typedInput-container"); | ||||
|  | ||||
|             this.element.attr('type','hidden'); | ||||
| @@ -687,7 +760,7 @@ | ||||
|                             $('<img>',{src:mapDeprecatedIcon(opt.icon),style:"margin-right: 4px;height: 18px;"}).prependTo(this.selectLabel); | ||||
|                         } | ||||
|                         else { | ||||
|                             $('<i>',{class:"red-ui-typedInput-icon "+opt.icon}).prependTo(this.selectLabel); | ||||
|                             $('<i>',{class:"red-ui-typedInput-icon "+opt.icon,style:"min-width: 13px; margin-right: 4px;"}).prependTo(this.selectLabel); | ||||
|                         } | ||||
|                     } | ||||
|                     if (opt.hasValue === false || (opt.showLabel !== false && !opt.icon)) { | ||||
| @@ -822,6 +895,11 @@ | ||||
|                         if (this.optionSelectTrigger) { | ||||
|                             this.optionSelectTrigger.hide(); | ||||
|                         } | ||||
|                         if (opt.inputType) { | ||||
|                             this.input.attr('type',opt.inputType) | ||||
|                         } else { | ||||
|                             this.input.attr('type',this.defaultInputType) | ||||
|                         } | ||||
|                         if (opt.hasValue === false) { | ||||
|                             this.oldValue = this.input.val(); | ||||
|                             this.input.val(""); | ||||
| @@ -830,8 +908,8 @@ | ||||
|                         } else if (opt.valueLabel) { | ||||
|                             this.valueLabelContainer.show(); | ||||
|                             this.valueLabelContainer.empty(); | ||||
|                             opt.valueLabel.call(this,this.valueLabelContainer,this.input.val()); | ||||
|                             this.elementDiv.hide(); | ||||
|                             opt.valueLabel.call(this,this.valueLabelContainer,this.input.val()); | ||||
|                         } else { | ||||
|                             if (this.oldValue !== undefined) { | ||||
|                                 this.input.val(this.oldValue); | ||||
|   | ||||
| @@ -56,7 +56,10 @@ | ||||
|         white-space: nowrap; | ||||
|         overflow: hidden; | ||||
|         text-overflow: ellipsis; | ||||
|  | ||||
|         .red-ui-typedInput-value-label-inactive { | ||||
|             backgroundColor: $secondary-background-disabled; | ||||
|             color: $secondary-text-color-disabled; | ||||
|         } | ||||
|     } | ||||
| } | ||||
| .red-ui-typedInput-options { | ||||
| @@ -123,7 +126,7 @@ button.red-ui-typedInput-option-trigger | ||||
|     } | ||||
|     &.disabled { | ||||
|         cursor: default; | ||||
|         i.red-ui-typedInput-icon { | ||||
|         > i.red-ui-typedInput-icon { | ||||
|             color: $secondary-text-color-disabled; | ||||
|         } | ||||
|     } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user