diff --git a/src/focus.js b/src/focus.js index 8c264f9..06aeda7 100644 --- a/src/focus.js +++ b/src/focus.js @@ -1,88 +1,78 @@ -import {customAttribute} from 'aurelia-templating'; -import {bindingMode} from 'aurelia-binding'; -import {inject} from 'aurelia-dependency-injection'; -import {TaskQueue} from 'aurelia-task-queue'; -import {DOM} from 'aurelia-pal'; - -/** -* CustomAttribute that binds provided DOM element's focus attribute with a property on the viewmodel. -*/ -@customAttribute('focus', bindingMode.twoWay) -@inject(DOM.Element, TaskQueue) -export class Focus { - /** - * Creates an instance of Focus. - * @paramelement Target element on where attribute is placed on. - * @param taskQueue The TaskQueue instance. - */ - constructor(element, taskQueue) { - this.element = element; - this.taskQueue = taskQueue; - this.isAttached = false; - this.needsApply = false; - } - - /** - * Invoked everytime the bound value changes. - * @param newValue The new value. - */ - valueChanged(newValue) { - if (this.isAttached) { - this._apply(); - } else { - this.needsApply = true; - } - } - - _apply() { - if (this.value) { - this.taskQueue.queueMicroTask(() => { - if (this.value) { - this.element.focus(); - } - }); - } else { - this.element.blur(); - } - } - - /** - * Invoked when the attribute is attached to the DOM. - */ - attached() { - this.isAttached = true; - if (this.needsApply) { - this.needsApply = false; - this._apply(); - } - this.element.addEventListener('focus', this); - this.element.addEventListener('blur', this); - } - - /** - * Invoked when the attribute is detached from the DOM. - */ - detached() { - this.isAttached = false; - this.element.removeEventListener('focus', this); - this.element.removeEventListener('blur', this); - } - - handleEvent(e) { - switch (e.type) { - case 'focus': this.handleFocus(e); break; - case 'blur': this.handleBlur(e); break; - default: break; - } - } - - handleFocus(e) { - this.value = true; - } - - handleBlur(e) { - if (DOM.activeElement !== this.element) { - this.value = false; - } - } -} +import {customAttribute} from 'aurelia-templating'; +import {bindingMode} from 'aurelia-binding'; +import {inject} from 'aurelia-dependency-injection'; +import {TaskQueue} from 'aurelia-task-queue'; +import {DOM} from 'aurelia-pal'; + +/** +* CustomAttribute that binds provided DOM element's focus attribute with a property on the viewmodel. +*/ +@customAttribute('focus', bindingMode.twoWay) +@inject(DOM.Element, TaskQueue) +export class Focus { + /** + * Creates an instance of Focus. + * @paramelement Target element on where attribute is placed on. + * @param taskQueue The TaskQueue instance. + */ + constructor(element, taskQueue) { + this.element = element; + this.taskQueue = taskQueue; + this.isAttached = false; + this.needsApply = false; + } + + /** + * Invoked everytime the bound value changes. + * @param newValue The new value. + */ + valueChanged(newValue) { + if (this.isAttached) { + this._apply(); + } else { + this.needsApply = true; + } + } + + _apply() { + if (this.value) { + this.taskQueue.queueMicroTask(() => { + if (this.value) { + this.element.focus(); + } + }); + } else { + this.element.blur(); + } + } + + /** + * Invoked when the attribute is attached to the DOM. + */ + attached() { + this.isAttached = true; + if (this.needsApply) { + this.needsApply = false; + this._apply(); + } + this.element.addEventListener('focus', this); + this.element.addEventListener('blur', this); + } + + /** + * Invoked when the attribute is detached from the DOM. + */ + detached() { + this.isAttached = false; + this.element.removeEventListener('focus', this); + this.element.removeEventListener('blur', this); + } + + handleEvent(e) { + if (e.type === 'focus') { + this.value = true; + } else if (DOM.activeElement !== this.element) { + this.value = false; + } + } +}