diff --git a/ignite-template.js b/ignite-template.js index a5270f5..8ad00c6 100644 --- a/ignite-template.js +++ b/ignite-template.js @@ -763,6 +763,54 @@ class IgniteTemplate { return this; } + /** + * Adds a on escape key press event handler to this template. + * @param {Function|IgniteProperty} eventCallback The callback function to be invoked by the event once it fires. + * @returns {IgniteTemplate} This ignite template so function calls can be chained. + */ + onEscape(eventCallback) { + var eventName = "keydown"; + + if (!this._events[eventName]) { + this._events[eventName] = []; + } + + if (eventCallback instanceof IgniteProperty) { + this._callbacks.push(eventCallback.attachOnChange((oldValue, newValue) => { + //Create a new wrapped function to check for the escape key being pressed. + var wrapped = (e) => { + if (e.key === 'Escape') { + newValue(e); + } + }; + + eventCallback._value = wrapped; //Store the wrapped function into the property so we can remove it later + this.onEventChanged(oldValue, wrapped, eventName); //Invoke event changed with the old value and wrapped one. + })); + + //Create the initial wrapper + var target = eventCallback._value; + var wrapped = (e) => { + if (e.key === 'Escape') { + target(e); + } + }; + + //Store the wrapped so that it's the old value next time around. + eventCallback._value = wrapped; + + this._events[eventName].push(wrapped); + } else { + this.on(eventName, (e) => { + if (e.key === 'Escape') { + eventCallback(e); + } + }); + } + + return this; + } + /** * Adds a on backspace key press event handler to this template. * @param {Function|IgniteProperty} eventCallback The callback function to be invoked by the event once it fires.