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…

  • Create GitHub Issue…