export default () => {
  const compareSection = document.querySelector('section.compare');
  const compareTable = document.querySelector('.compare__table table');

  if (!compareSection || !compareTable) { return }

  const rows = [...compareTable.querySelectorAll('tr')];

  if (!rows.length) { return }

  const align = (rows) => {
    rows.forEach((row) => {
      const headingCell = row.querySelector('th');
      const productCell = row.querySelector('th + td');

      if (!productCell) {
        compareSection.classList.add('js-nothing-to-compare');
        return;
      } else {
        compareSection.classList.remove('js-nothing-to-compare');
      }

      if (headingCell.offsetHeight > productCell.offsetHeight) {
        productCell.style.height = headingCell.offsetHeight + `px`;
      } else {
        headingCell.style.height = productCell.offsetHeight + `px`;
      }
    });
  };

  const reset = (rows) => {
    rows.forEach((row) => {
      const headingCell = row.querySelector('th');
      const productCell = row.querySelector('th + td');

      productCell.style.height = `auto`;
      headingCell.style.height = `auto`;
    });
  };

  align(rows);

  const onResize = () => {
    const rows = [...compareTable.querySelectorAll('tr')];

    reset(rows);
    align(rows);
  };

  window.addEventListener('resize', onResize);
};