Hydro/packages/ui-default/components/footer/footer.page.ts

import { AutoloadPage } from 'vj/misc/Page';
import { isBelow } from 'vj/utils/mediaQuery';
import { slideUp, slideDown } from 'vj/utils/slide';
import responsiveCutoff from 'vj/breakpoints.json';

const footerPage = new AutoloadPage('footerPage', () => {
  if (!$('.footer').length) return;
  $('.footer__category.expandable > h1').on('click', async (ev) => {
    if (!isBelow(responsiveCutoff.mobile)) return;
    const $category = $(ev.currentTarget).closest('.footer__category');
    const $list = $category.find('.footer__category__expander');
    if ($category.hasClass('animating')) return;
    $category.addClass('animating');
    if ($category.hasClass('expanded')) {
      $category.removeClass('expanded');
      await slideUp($list, 300, { opacity: 1 }, { opacity: 0 });
    } else {
      $category.addClass('expanded');
      await slideDown($list, 300, { opacity: 0 }, { opacity: 1 });
    }
    $category.removeClass('animating');
  });
});

export default footerPage;