import wixAnimations from 'wix-animations';

 

const ACTIVE_COLOR = '#543AE8';

const DEFUALT_COLOR = '#A4A4A4';

 

$w.onReady(function () {

​

});

 

function initFAQrepeater() {

   $w('#FAQrepeater').forEachItem(($item, itemData, index) => {

      $item('#Qbutton').onClick(() => {

         openRelevantContent(index);

      });

   });

}

​

function openRelevantContent(targetIndex) {

   $w('#FAQrepeater').forEachItem(($item, itemData, index) => {

      const contentBox = $item('#FAQcontent');

      const button = $item('#Qbutton');

      const arrow = $item('#FAQarrow');

​

      if (targetIndex === index) {

         contentBox.collapsed ?
            expandFAQcontent(contentBox, button, arrow) :
            collapseFAQcontent(contentBox, button, arrow)

      } else {

         collapseFAQcontent(contentBox, button, arrow);

      }

   });

}

 

function expandFAQcontent(contentBox, button, arrow) {

   contentBox.expand();

   button.style.color = ACTIVE_COLOR;

   wixAnimations.timeline()

      .add(arrow, { rotate: 180, duration: 300 })

      .play();

}

​

function collapseFAQcontent(contentBox, button, arrow) {

   contentBox.collapse();

   button.style.color = DEFUALT_COLOR;

   wixAnimations.timeline()

      .add(arrow, { rotate: 0, duration: 300 })

      .play();

}

​

export function FAQdataset_ready() {

   initFAQrepeater();

}