@ussebastian/kitdigital/src/js/components/ComponentAccordion.js

Kit Digital de la Universidad San Sebastián

export default class ComponentAccordion {
  constructor(el) {
    this.el = el;
    this.accordionItems = this.el.querySelectorAll('.uss-accordion__item');
    this.accordionHeaders = this.el.querySelectorAll('.uss-accordion__header');
  }

  init() {
    this.accordionHeaders.forEach((item) => {
      item.addEventListener('click', () => {
        const parent = item.parentNode;
        if (parent.hasAttribute('data-uss-accordeon-open')) {
          parent.removeAttribute('data-uss-accordeon-open');
        } else {
          this.closeAll();
          parent.setAttribute('data-uss-accordeon-open', '');
        }
      });
    });

    const { hash } = window.location;
    if (hash) {
      this.openItem(hash);
    }
  }

  openItem(id) {
    const item = this.el.querySelector(id);
    if (item) {
      this.closeAll();
      item.setAttribute('data-uss-accordeon-open', '');
    }
  }

  closeAll() {
    this.accordionHeaders.forEach((item) => {
      const parent = item.parentNode;
      parent.removeAttribute('data-uss-accordeon-open');
    });
  }

  destroy() {
    this.accordionHeaders.forEach((item) => {
      const parent = item.parentNode;
      parent.removeEventListener('click');
    });
  }
}