open-vault/ui/app/components/masked-input.js
madalynrose 9fb8be5a72
Masked input (#4759)
* create masked-input component
2018-06-14 14:52:00 -04:00

52 lines
1.1 KiB
JavaScript

import Ember from 'ember';
const { computed } = Ember;
import autosize from 'autosize';
export default Ember.Component.extend({
value: null,
didInsertElement(){
this._super(...arguments);
autosize(this.element.querySelector('textarea'));
},
didUpdate(){
this._super(...arguments);
autosize.update(this.element.querySelector('textarea'));
},
willDestroyElement(){
this._super(...arguments);
autosize.destroy(this.element.querySelector('textarea'));
},
shouldObscure: computed("isMasked", "isFocused", "value", function(){
if(this.get('value') === "" ){
return false;
}
if(this.get('isFocused') === true){
return false;
}
return this.get('isMasked');
}),
displayValue: computed("shouldObscure", function(){
if(this.get("shouldObscure")){
return "■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■";
}
else{
return this.get('value');
}
}),
isMasked: true,
isFocused: false,
displayOnly: false,
onKeyDown(){},
onChange(){},
actions: {
toggleMask(){
this.toggleProperty('isMasked');
},
updateValue(e){
this.set('value', e.target.value);
this.onChange();
},
}
});