https://madeincomics.fr/wp-content/plugins/growfund/resources/asse…/campaign/campaign-filter.js?ver=1.1.1

1(function () {
2  const filterBtn = document.querySelector('.growfund-campaign-mobile-filter-button');
3  const modal = document.querySelector('.growfund-filter-modal');
4  const applyBtn = document.querySelector('.growfund-campaign-filter-modal-apply-button');
5  const closeBtn = document.querySelector('.growfund-campaign-filter-modal-close');
6  const clearBtn = document.querySelector('.growfund-campaign-filter-modal-clear-button');
7  const overlay = modal.querySelector('.growfund-filter-modal-overlay');
8  const mobileFilterList = document.querySelectorAll('.growfund-mobile-filter-group-content-list');
9
10  function dispatchFilterCampaign(params) {
11    document.dispatchEvent(
12      new CustomEvent('growfund:filter-campaigns', {
13        detail: {
14          params,
15        },
16      }),
17    );
18  }
19
20  window.growfundEvents.dispatchFilterCampaign = dispatchFilterCampaign;
21
22  const closeModal = () => {
23    modal.classList.remove('is-open');
24    document.body.style.overflow = '';
25  };
26
27  function filterModal() {
28    filterBtn.addEventListener('click', function (e) {
29      e.preventDefault();
30      modal.classList.add('is-open');
31      document.body.style.overflow = 'hidden';
32    });
33
34    if (closeBtn) closeBtn.addEventListener('click', closeModal);
35    if (overlay) overlay.addEventListener('click', closeModal);
36
37    const accordionToggles = document.querySelectorAll('.growfund-mobile-filter-item-toggle');
38
39    accordionToggles.forEach((toggle) => {
40      toggle.addEventListener('click', function (e) {
41        const wrapper = this.closest('.growfund-filter-modal-group-wrapper');
42
43        const content = wrapper.querySelector('.growfund-mobile-filter-group-content');
44        if (content && content.querySelectorAll('li').length > 0) {
45          wrapper.classList.toggle('is-active');
46        }
47      });
48    });
49
50    mobileFilterList.forEach((filter) => {
51      const listItem = filter.getAttribute('data-name');
52      filter.addEventListener('change', function (e) {
53        if (e.target.matches(`input[type="radio"][name="${listItem}"]`)) {
54          filter.setAttribute('data-selected-value', e.target.value);
55        }
56      });
57    });
58  }
59
60  function applyFilters() {
61    document
62      .querySelector('#growfund_campaign_filter_category_slug')
63      .addEventListener('growfund:select-change', function (e) {
64        const { name, value } = e.detail;
65        const params = growfundUpdateQueryParams(name, value);
66        dispatchFilterCampaign({ ...params });
67      });
68
69    document
70      .querySelector('#growfund_campaign_filter_sortby')
71      .addEventListener('growfund:select-change', function (e) {
72        const { name, value } = e.detail;
73        const parse = value.split(':');
74        const orderby = parse[0] ?? '';
75        const order = parse[1] ?? '';
76        growfundUpdateQueryParams('order', order);
77        const params = growfundUpdateQueryParams(name, orderby);
78        dispatchFilterCampaign({ ...params });
79      });
80
81    document
82      .querySelector('#growfund_campaign_filter_search_input')
83      .addEventListener('growfund:text-field', function (e) {
84        const { name, value } = e.detail;
85        const params = growfundUpdateQueryParams(name, value);
86        dispatchFilterCampaign({ ...params });
87      });
88
89    applyBtn?.addEventListener('click', () => {
90      let params = {};
91
92      document
93        .querySelectorAll('.growfund-filter-modal-body input[type="radio"]:checked')
94        .forEach((input) => {
95          const name = input.name;
96          const value = input.value;
97
98          if (name === 'orderby') {
99            const parse = value.split(':');
100            const orderby = parse[0] ?? '';
101            const order = parse[1] ?? '';
102            growfundUpdateQueryParams('order', order);
103            params = growfundUpdateQueryParams('orderby', orderby);
104            return;
105          }
106
107          params = growfundUpdateQueryParams(name, value);
108        });
109
110      dispatchFilterCampaign({ ...params });
111      closeModal();
112    });
113
114    clearBtn?.addEventListener('click', function () {
115      mobileFilterList.forEach((filter) => {
116        filter.setAttribute('data-selected-value', '');
117        filter.querySelectorAll('input[type="radio"]').forEach((radio) => {
118          radio.checked = false;

119        });
120      });
121
122      growfundUpdateQueryParams('category_slug', '');
123      growfundUpdateQueryParams('orderby', '');
124      growfundUpdateQueryParams('order', '');
125      dispatchFilterCampaign({ category_slug: '', orderby: '', order: '' });
126      closeModal();
127    });
128  }
129
130  document.addEventListener('DOMContentLoaded', function () {
131    filterModal();
132    applyFilters();
133  });
134})();