Ghost/ghost/admin/app/mixins/text-input.js
Kevin Ansfield 245f4ea80e auto-expanding editor title input (#699)
closes https://github.com/TryGhost/Ghost/issues/8463
- move generic text input handling into `text-input` mixin so it applies to text inputs and textareas
- adds `autoExpand` property to `gh-textarea` that accepts a selector to watch for resize changes, if the property is set then auto-expanding behaviour is triggered any time the textarea value is changed or when the selector element is resized (this prevents change in textarea width from toggling nav or split screen mode resulting in textarea content being hidden or the textarea being taller than it's contents)
- adds `ember-element-resize-detector` addon to allow watching of element resizes rather than window resizes (this was already included as a sub-dependency via `ember-light-table`->`ember-scrollable`->`ember-element-resize-detector`)
2017-05-18 17:01:30 +09:00

66 lines
1.7 KiB
JavaScript

/* global device */
import Mixin from 'ember-metal/mixin';
import computed from 'ember-computed';
export default Mixin.create({
attributeBindings: ['autofocus'],
selectOnClick: false,
shouldFocus: false,
stopEnterKeyDownPropagation: false,
autofocus: computed(function () {
if (this.get('shouldFocus')) {
return (device.ios()) ? false : 'autofocus';
}
return false;
}),
didInsertElement() {
this._super(...arguments);
this._focus();
},
click(event) {
if (this.get('selectOnClick')) {
event.currentTarget.select();
}
},
keyDown(event) {
// stop event propagation when pressing "enter"
// most useful in the case when undesired (global) keyboard shortcuts
// are getting triggered while interacting with this particular input element.
if (this.get('stopEnterKeyDownPropagation') && event.keyCode === 13) {
event.stopPropagation();
return true;
}
// prevent default TAB behaviour if we have a keyEvent for it
if (event.keyCode === 9 && this.get('keyEvents.9')) {
event.preventDefault();
}
this._super(...arguments);
},
keyPress(event) {
// prevent default ENTER behaviour if we have a keyEvent for it
if (event.keyCode === 13 && this.get('keyEvents.13')) {
event.preventDefault();
}
this._super(...arguments);
},
_focus() {
// Until mobile safari has better support
// for focusing, we just ignore it
if (this.get('shouldFocus') && !device.ios()) {
this.element.focus();
}
}
});