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:
parent
1f8ed9dcb9
commit
d08e77cf36
@ -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": {
|
||||||
|
@ -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);
|
||||||
|
@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user