import wixAnimations from 'wix-animations';

 

$w.onReady(function () {

const boxes = ['#box1', '#box2', '#box3', '#box4', '#box6'];

 

boxes.forEach((box) => {

let btnID = $w(box).children[0].id;

let textID = $w(box).children[1].id;

 

$w(`#${btnID}`).onClick(() => {

if ($w(`#${textID}`).collapsed) {

$w(`#${textID}`).expand().then(() => {

wixAnimations.timeline()

.add($w(`#${btnID}`), { rotate: 180, duration: 300 })

.play();

})

} else {

$w(`#${textID}`).collapse().then(() => {

wixAnimations.timeline()

.add($w(`#${btnID}`), { rotate: 0, duration: 300 })

.play();

})

}

collapseOpenBoxes(box);

});

});

 

function collapseOpenBoxes(elementTokeepExpand) {

 

boxes.forEach((box) => {

let text = $w(box).children[1].id;

let arrow = $w(box).children[0].id;

 

if (box !== elementTokeepExpand) {

$w(`#${text}`).collapse();

wixAnimations.timeline()

.add($w(`#${arrow}`), { rotate: 0, duration: 300 })

.play();

}

 

});

}

 

});