1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Add credential type to TypedInput

This commit is contained in:
Nick O'Leary 2019-11-01 14:13:36 +00:00
parent 1f8ed9dcb9
commit d08e77cf36
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
3 changed files with 87 additions and 5 deletions

View File

@ -757,7 +757,8 @@
"bin": "buffer", "bin": "buffer",
"date": "timestamp", "date": "timestamp",
"jsonata": "expression", "jsonata": "expression",
"env": "env variable" "env": "env variable",
"cred": "credential"
} }
}, },
"editableList": { "editableList": {

View File

@ -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; var nlsd = false;
@ -220,6 +291,8 @@
that.input.attr(d,m); that.input.attr(d,m);
}); });
this.defaultInputType = this.input.attr('type');
this.uiSelect.addClass("red-ui-typedInput-container"); this.uiSelect.addClass("red-ui-typedInput-container");
this.element.attr('type','hidden'); this.element.attr('type','hidden');
@ -687,7 +760,7 @@
$('<img>',{src:mapDeprecatedIcon(opt.icon),style:"margin-right: 4px;height: 18px;"}).prependTo(this.selectLabel); $('<img>',{src:mapDeprecatedIcon(opt.icon),style:"margin-right: 4px;height: 18px;"}).prependTo(this.selectLabel);
} }
else { 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)) { if (opt.hasValue === false || (opt.showLabel !== false && !opt.icon)) {
@ -822,6 +895,11 @@
if (this.optionSelectTrigger) { if (this.optionSelectTrigger) {
this.optionSelectTrigger.hide(); this.optionSelectTrigger.hide();
} }
if (opt.inputType) {
this.input.attr('type',opt.inputType)
} else {
this.input.attr('type',this.defaultInputType)
}
if (opt.hasValue === false) { if (opt.hasValue === false) {
this.oldValue = this.input.val(); this.oldValue = this.input.val();
this.input.val(""); this.input.val("");
@ -830,8 +908,8 @@
} else if (opt.valueLabel) { } else if (opt.valueLabel) {
this.valueLabelContainer.show(); this.valueLabelContainer.show();
this.valueLabelContainer.empty(); this.valueLabelContainer.empty();
opt.valueLabel.call(this,this.valueLabelContainer,this.input.val());
this.elementDiv.hide(); this.elementDiv.hide();
opt.valueLabel.call(this,this.valueLabelContainer,this.input.val());
} else { } else {
if (this.oldValue !== undefined) { if (this.oldValue !== undefined) {
this.input.val(this.oldValue); this.input.val(this.oldValue);

View File

@ -56,7 +56,10 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
.red-ui-typedInput-value-label-inactive {
backgroundColor: $secondary-background-disabled;
color: $secondary-text-color-disabled;
}
} }
} }
.red-ui-typedInput-options { .red-ui-typedInput-options {
@ -123,7 +126,7 @@ button.red-ui-typedInput-option-trigger
} }
&.disabled { &.disabled {
cursor: default; cursor: default;
i.red-ui-typedInput-icon { > i.red-ui-typedInput-icon {
color: $secondary-text-color-disabled; color: $secondary-text-color-disabled;
} }
} }