keeweb/app/scripts/views/details/details-auto-type-view.js

75 lines
2.3 KiB
JavaScript

import { View } from 'framework/views/view';
import { AutoType } from 'auto-type';
import { Shortcuts } from 'comp/app/shortcuts';
import { Locale } from 'util/locale';
import { AutoTypeHintView } from 'views/auto-type/auto-type-hint-view';
import template from 'templates/details/details-auto-type.hbs';
class DetailsAutoTypeView extends View {
parent = '.details__body-after';
template = template;
events = {
'focus #details__auto-type-sequence': 'seqFocus',
'input #details__auto-type-sequence': 'seqInput',
'keypress #details__auto-type-sequence': 'seqKeyPress',
'keydown #details__auto-type-sequence': 'seqKeyDown',
'change #details__auto-type-enabled': 'enabledChange',
'change #details__auto-type-obfuscation': 'obfuscationChange'
};
render() {
const detAutoTypeShortcutsDesc = Locale.detAutoTypeShortcutsDesc
.replace('{}', Shortcuts.actionShortcutSymbol() + 'T')
.replace('{}', Shortcuts.globalShortcutText('autoType'));
super.render({
enabled: this.model.getEffectiveEnableAutoType(),
obfuscation: this.model.autoTypeObfuscation,
sequence: this.model.autoTypeSequence,
windows: this.model.autoTypeWindows,
defaultSequence: this.model.group.getEffectiveAutoTypeSeq(),
detAutoTypeShortcutsDesc
});
}
seqInput(e) {
const el = e.target;
const seq = el.value.trim();
AutoType.validate(this.model, seq, (err) => {
$(el).toggleClass('input--error', !!err);
if (!err) {
this.model.setAutoTypeSeq(seq);
}
});
}
seqKeyPress(e) {
e.stopPropagation();
}
seqKeyDown(e) {
e.stopPropagation();
}
seqFocus(e) {
if (!this.views.hint) {
this.views.hint = new AutoTypeHintView({ input: e.target });
this.views.hint.render();
this.views.hint.on('remove', () => {
delete this.views.hint;
});
}
}
enabledChange(e) {
this.model.setEnableAutoType(e.target.checked);
}
obfuscationChange(e) {
this.model.setAutoTypeObfuscation(e.target.checked);
}
}
export { DetailsAutoTypeView };