Asides JS
You can get a hold of the Aside
component and control it with JavaScript.
ts.ui.get('#myaside', aside => {
// you can pass an element instead of an ID
aside.open();
aside.close();
aside.toggle();
aside.title('Updated title');
});
Tracking with methods
You can overwrite the methods onopen
, onopened
,
onclose
and onclosed
to do something whenever the aside changes
state.
aside.onopen = function() {
console.log('Aside will open');
};
If you return false
in methods onopen
and onclose
,
the aside will respect that.
Tracking with events
You can also monitor the asides with DOM event listeners.
function debug(e) {
console.log(e.type, e.target);
}
document.addEventListener('ts-open', debug);
document.addEventListener('ts-opened', debug);
document.addEventListener('ts-close', debug);
document.addEventListener('ts-closed', debug);
The events "ts-open"
and "ts-close"
can be blocked with
e.preventDefault()
to prevent the aside from changing state.
If you find a bug or need a feature…