/* TODO: move this into blocks at some point when we have time */

// on ready functions
document.addEventListener("DOMContentLoaded", function () {
  Object.values(blockInitializers).forEach((initializer) => {
    initializer();
  });
});

const blockInitializers = {
  // LOGO CLOUD EXPANDABLE
  initLogoCloud: function() {
    const expandableContainers = document.querySelectorAll('.expandable-content');
    Array.from(expandableContainers).forEach((container) => {
      const viewMoreButton = container.querySelector('.view-more a');
      if (viewMoreButton) {
        viewMoreButton.addEventListener('click', () => {
          container.classList.add('show-all');
          console.log('adding show-all class');
        });
      }
    });
  },

  // ACCORDION
  initAccordion: function() {
    const accordionButtons = document.getElementsByClassName('accordion-button');
    Array.from(accordionButtons).forEach((accordionButton) => {
      accordionButton.addEventListener('click', () => {
        const accordionItem = accordionButton.parentNode.parentNode;
        accordionItem.classList.toggle('show');
        getSiblings(accordionItem).forEach((el) => {
          el.classList.remove('show');
        });
      });
    });
  },

  // PROGRESS BAR
  initProgressBars: function() {
    const progressBars = document.querySelectorAll('.progress-bar')
    progressBars.forEach(progressBar => {
      setTimeout(() => {
        progressBar.style.width = `${progressBar.getAttribute('aria-valuenow')}%`
      }, 100)
    })
  },

  initMadlinPetitions: function() {
    const madlibPetitions = document.querySelectorAll('.wp-block-fight-madlib-petition')
    madlibPetitions.forEach(madlibPetition => {
      const button = madlibPetition.querySelector('.wp-block-button__link')
      if (button) {
        button.addEventListener('click', () => {
          const petition = madlibPetition.querySelector('.petition-wrapper')
          if (petition) {
            const comment = petition.dataset.defaultComment
            const autocomplete = madlibPetition.querySelector('.autocomplete input')

            if (autocomplete) {
              petition.querySelector('#form-comments').value = comment.replace("_USER_INPUT_", autocomplete.value)
            }
          }

          const modal = madlibPetition.querySelector('.modal')
          if (modal) {
            new bootstrap.Modal(modal).show()
          }
        })
      }
    })
  }
};

function getSiblings (elem) {
  return Array.from(elem.parentNode.children).filter(function (sibling) {
    return sibling !== elem;
  });
}