Breakpoint module
A module that fires a custom event when a breakpoint changes, so (js) modules can react to breakpoint changes.
Usage
This module is included in the javascript bundle by default.
It emits an event bpupdate
which passes in details of the current and previous breakpoint.
// listen for the custom event
document.addEventListener('bpupdate', myFunction, false);
function myFunction(e) { // this will fire everytime the breakpoint changes
console.log(`I am here: ${e.detail.current}`) // current breakpoint
console.log(`I came from: ${e.detail.previous}`) // previous breakpoint
}
// e.detail object that is available with this custom event
{
current: 'md',
previous: 'sm',
gtBase: true,
gtXxs: true,
gtXs: true,
gtSm: true,
gtMd: false,
gtLg: false,
gtXl: false
}
The breakpoint detail object is also available on the global jwAtomic
object @window.jwAtomic.modules.Breakpoint.detail
.