Customizing Modal Event Listeners
it is possible to customize click
and keydown
event listener callbacks for modals.
Available since 1.1.13
In older releases of Hyva_Theme
the callbacks where not exposed globally and could not be customized without overriding the page/js/modal.phtml
Hyva_Theme template.
If you are using an older version, be sure to upgrade the theme module.
At the time of writing, the two callbacks are globally available as
window.hyva.modal.eventListeners.click
window.hyva.modal.eventListeners.keydown
For example, to remove the modal click-away event listener, the following code can be used:
Wrapping the event listeners
This example wraps the keydown
event in a way that it could also be further extended by other code:
(function () {
// store reference to the original event subscriber function
const originalListener = window.hyva.modal.eventListeners.keydown;
// remove the original event subscriber
document.removeEventListener('keydown', originalListener);
// declare the new event subscriber function on the global window.hyva.modal.eventListeners object
window.hyva.modal.eventListeners.keydown = event => {
console.log('my wrapper', event);
originalListener(event); // call original listener if needed
};
// Activate the new event listener
document.addEventListener('keydown', window.hyva.modal.eventListeners.keydown);
})()