38 lines
1.1 KiB
JavaScript
38 lines
1.1 KiB
JavaScript
|
import Stepper from 'bs-stepper/dist/js/bs-stepper';
|
||
|
|
|
||
|
|
const bsStepper = document.querySelectorAll('.bs-stepper');
|
||
|
|
|
||
|
|
// Adds crossed class
|
||
|
|
bsStepper.forEach(el => {
|
||
|
|
el.addEventListener('show.bs-stepper', function (event) {
|
||
|
|
var index = event.detail.indexStep;
|
||
|
|
var numberOfSteps = el.querySelectorAll('.line').length;
|
||
|
|
var line = el.querySelectorAll('.step');
|
||
|
|
|
||
|
|
// The first for loop is for increasing the steps,
|
||
|
|
// the second is for turning them off when going back
|
||
|
|
// and the third with the if statement because the last line
|
||
|
|
// can't seem to turn off when I press the first item. ¯\_(ツ)_/¯
|
||
|
|
|
||
|
|
for (let i = 0; i < index; i++) {
|
||
|
|
line[i].classList.add('crossed');
|
||
|
|
|
||
|
|
for (let j = index; j < numberOfSteps; j++) {
|
||
|
|
line[j].classList.remove('crossed');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (event.detail.to == 0) {
|
||
|
|
for (let k = index; k < numberOfSteps; k++) {
|
||
|
|
line[k].classList.remove('crossed');
|
||
|
|
}
|
||
|
|
line[0].classList.remove('crossed');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
try {
|
||
|
|
window.Stepper = Stepper;
|
||
|
|
} catch (e) {}
|
||
|
|
|
||
|
|
export { Stepper };
|