client/locations-list-map.js
// Creates the <select> elements for filters.
Creates the  elements for filters.
Creates the elements for filters .
function createFilterElements(data, filters) {
  for (const f of Object.keys(filters)) {
    if (f === 'applied' || f === 'states') {
      continue;
    }
    const selectItems = [];
    const selected = {};
    for (const item of Object.keys(filters[f]).slice(0, -1)) {
      const itemFilter = filters[f][item];
      selected[itemFilter.name] = itemFilter;
      selectItems.push({
        value: itemFilter.value,
        text: itemFilter.name,
        selected: itemFilter.isSet,
      });
    }
    if (selectItems.length > 0) {
      const placeholderLabel = $.i18n(filters[f].placeholder || '');
      const html = `<div class="mb-2"><label class="filter-label" for="filter-${f}">${placeholderLabel}</label><select id="filter-${f}"></select></div>`;
      $('#filter-container').append(html);
      const selectr = new Selectr(document.getElementById('filter-container').lastElementChild.lastElementChild, {
        customClass: 'ftm-select',
        data: selectItems,
        multiple: true,
        searchable: false,
        placeholder: placeholderLabel,
      });
      document.getElementById('filter-container').lastElementChild.selectrReference = selectr;
      selectr.on('selectr.select', (option) => {
        onFilterChange(data, f, option.idx, true, filters);
        sendEvent('filters', f, option.value);
      });
      selectr.on('selectr.deselect', (option) => {
        onFilterChange(data, f, option.idx, false, filters);
      });
    }
  }
}
function createFilterElements ( data , filters ) { for ( const f of Object . keys ( filters ) ) { if ( f === 'applied' || f === 'states' ) { continue ; } const selectItems = [ ] ; const selected = { } ; for ( const item of Object . keys ( filters [ f ] ) . slice ( 0 , - 1 ) ) { const itemFilter = filters [ f ] [ item ] ; selected [ itemFilter . name ] = itemFilter ; selectItems . push ( { value : itemFilter . value , text : itemFilter . name , selected : itemFilter . isSet , } ) ; } if ( selectItems . length > 0 ) { const placeholderLabel = $ . i18n ( filters [ f ] . placeholder || '' ) ; const html = ` ${ f } ${ placeholderLabel } ${ f } ` ; $ ( '#filter-container' ) . append ( html ) ; const selectr = new Selectr ( document . getElementById ( 'filter-container' ) . lastElementChild . lastElementChild , { customClass : 'ftm-select' , data : selectItems , multiple : true , searchable : false , placeholder : placeholderLabel , } ) ; document . getElementById ( 'filter-container' ) . lastElementChild . selectrReference = selectr ; selectr . on ( 'selectr.select' , ( option ) => { onFilterChange ( data , f , option . idx , true , filters ) ; sendEvent ( 'filters' , f , option . value ) ; } ) ; selectr . on ( 'selectr.deselect' , ( option ) => { onFilterChange ( data , f , option . idx , false , filters ) ; } ) ; } } }
Creates the <select> elements for filters.
Creates the <select > elements for filters .
// All items available in the filter. // Enums selected in the filter. // Attach reference to each selectr object to the each filter DOM node for the ability to clear filters on map // reset // Attach event listeners to the selectr items on selecting and deselecting a filter