Progress

Dynamically set the progress status of steps, on a round progress preview.

Header

<script src="progress.js"></script>
<link rel="stylesheet" href="progress.css">

Body

<nav class="frontello-ui-progress"></nav>
<script>
document.addEventListener('DOMContentLoaded', () => {
	let progressElement = document.querySelector('.frontello-ui-progress');
	progressElement.addEventListener('init', (event) => {
		console.log('progress: init');
		console.log(event.detail);
	}, false);
	progressElement.addEventListener('change', (event) => {
		console.log('progress: change');
		console.log(event.detail);
	}, false);
	
	let progress = new Progress(progressElement);
	progress.setNumberOfSteps(3);
	progress.setStep(1);
});
</script>