HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/netwerkbrabant/netwerkbrabant.nl/resources/assets/js/site/companyFilterHandler.js
/* ==========================================================================
   Company Filter Handler
 ========================================================================== */

const CompanyFilterHandler = {

    companyFilterElement: null,
    companiesGridElement: null,
    companiesInGrid: [],
    nCompaniesInGrid: 0,

    branchFilterId: 0,
    regionFilterId: 0,

    init: function () {

        CompanyFilterHandler.companyFilterElement = document.querySelector('.companies .filter-menu');
        CompanyFilterHandler.companiesGridElement = document.querySelector('.companies .companies--grid');

        // Check if the needed elements are present
        if(isset(CompanyFilterHandler.companyFilterElement) && CompanyFilterHandler.companiesGridElement){

            // Get all companies in grid
            CompanyFilterHandler.companiesInGrid = CompanyFilterHandler.companiesGridElement.querySelectorAll('.company');
            CompanyFilterHandler.nCompaniesInGrid = CompanyFilterHandler.companiesInGrid.length;

            // Get all filters in the filter-menu
            const filters = CompanyFilterHandler.companyFilterElement.querySelectorAll('select');
            const filtersLength = filters.length;

            // Add event listeners to filters
            for(let i = 0; i < filtersLength; i++){
                CompanyFilterHandler.addEventListenersToFilter(filters[i]);
            }
        }
    },

    addEventListenersToFilter: function (filter)
    {
        // Get the filter type
        filter.addEventListener('change', function () {
            const filterValue = this.value;
            const filterType = this.id;
            if(filterType === 'category') CompanyFilterHandler.branchFilterId = filterValue;
            if(filterType === 'region') CompanyFilterHandler.regionFilterId = filterValue;

            CompanyFilterHandler.updateCompanies();
        });
    },

    updateCompanies: function()
    {
        for(let i = 0; i < CompanyFilterHandler.nCompaniesInGrid; i++)
        {
            const company = CompanyFilterHandler.companiesInGrid[i];

            const companyRegion = company.getAttribute('data-region');
            const companyBranch = company.getAttribute('data-category');

            if(CompanyFilterHandler.regionFilterId == 0 || companyRegion == CompanyFilterHandler.regionFilterId) company.classList.remove('is-hidden-by-region-filter');
            else company.classList.add('is-hidden-by-region-filter');

            if(CompanyFilterHandler.branchFilterId == 0 || companyBranch == CompanyFilterHandler.branchFilterId) company.classList.remove('is-hidden-by-branch-filter');
            else company.classList.add('is-hidden-by-branch-filter');
        }
    },


};

CompanyFilterHandler.init();