const $regionDropdown = $('#region-dropdown'); const $industriesSelector = $('#industry-options'); const $locationsInput = $('#location-input'); const baseRepUrl = 'https://api.stifirestop.com/'; const getRegionUrl = `${baseRepUrl}find-a-rep-configuration`; let industries = {}; function getRegions() { $.get(getRegionUrl).then((response) => { const regionData = Object.values(response.data); regionData.forEach((region, index) => { // Add index parameter to forEach loop const { value, name, industries: regionIndustries, countries } = region; // Check if the name is "United States" and update it to "U.S.A" const displayName = name === "United States" ? "U.S.A" : name; if (value === 'international') { industries[value] = countries; } else { industries[value] = regionIndustries; } const regionSelectInput = ` ${displayName} `; $regionDropdown.append(regionSelectInput); }); }); } function populateLocationIndustry(value) { const industriesVals = Object.values(industries[value.toString()]); if (value !== 'international') { const inputIndustry = industriesVals.reduce((acc, eachItem, index) => { const isChecked = index === 0 ? 'checked' : ''; // Check the first element return acc + ` ${eachItem.name} `; }, ''); $industriesSelector.html(inputIndustry); const restInputs = `Enter State/Province<sup>*</sup> `; $locationsInput.html(restInputs); const input = document.getElementById("pac-input"); input.addEventListener('input', handleInputNow); function handleInputNow() { // Get the current input value const inputValue = input.value; // Validate the input using a regular expression (allow only alphabetical characters) if (!/^[a-zA-Z\s]*$/.test(inputValue)) { // Clear the input field or handle it in a way that fits your application input.value = ''; } else { const options = { fields: ["geometry", "name"], }; if (value === 'united_states') { options.componentRestrictions = { country: ["us"] }; } else { options.componentRestrictions = { country: ["ca"] }; } const autocomplete = new google.maps.places.Autocomplete(input, options); autocomplete.addListener("place_changed", () => { const place = autocomplete.getPlace(); if (place.geometry && place.geometry.location) { selectedStateLat = place.geometry.location.lat(); selectedStateLng = place.geometry.location.lng(); centerLocationName = place.name; getZipCode(selectedStateLat, selectedStateLng); } else { selectedStateLat = null; selectedStateLng = null; input.value='' } }); } } } else { let locationsSelect = ''; industriesVals.forEach((eachItem, index) => { locationsSelect += ` ${eachItem.name} `; }); const selectLocations = `Select Location `; $locationsInput.html(selectLocations); $industriesSelector.html(''); $('#select-indutry-title').text('Select Industry') $('.find-sti-tab-form form .form-filds .custom-radio-options input[name="location-inp"]').change(function() { $('#interNational').text($(this).attr('data-name')); $('#interNational').attr('data-value', this.value); $('#region-dropdown-int').hide() }); } $('.find-sti-tab-form form .form-filds .custom-radio-options input[name="region"]').change(function() { $('#region').text($(this).attr('data-name')); $('#region').attr('data-value', this.value); }); closeDropdown() } function populateLocationIndustryInternational(value) { const key = value.toString(); let inputIndustry = ''; const internationalInd = Object.values(industries['international'][key].industries); internationalInd.forEach((eachItem, index) => { const isChecked = index === 0 ? 'checked' : ''; // Check the first element if (index === 0) { $('#select-indutry-title').text(eachItem.name) } inputIndustry += ` ${eachItem.name} `; }); $industriesSelector.html(inputIndustry); closeDropdown() } function dist_api_url_generate() { var region = document.getElementById('region').getAttribute('data-value'); var checkedCheckbox = document.querySelector('input[name="category"]:checked'); var selectedCategory = checkedCheckbox ? checkedCheckbox.value : null; var industryRedirect = checkedCheckbox ? checkedCheckbox.getAttribute('redirects-to') : null; if (region === 'international') { if (industryRedirect === 'false') { var internationalregion = document.getElementById('interNational').getAttribute('data-value'); const api_disbutor_url = 'https://api.stifirestop.com/find-a-rep?' + 'region=' + internationalregion + '&' + 'industry=' + selectedCategory; make_api_call_for_distributors(`${api_disbutor_url}`, 'GET'); } else { var findStiTabContent = document.querySelector('.find-sti-tab-content'); if (findStiTabContent) { findStiTabContent.classList.remove('loader-on'); } window.open(industryRedirect, '_blank'); } } else { const api_disbutor_url = 'https://api.stifirestop.com/find-a-rep?' + 'region=' + region + '&' + 'zip=' + zipcode + '&' + 'industry=' + selectedCategory; if(zipcode!=undefined){ make_api_call_for_distributors(`${api_disbutor_url}`, 'GET'); }else{ showErrorMsg() const findStiTabContent = document.querySelector('.find-sti-tab-content'); if (findStiTabContent) { findStiTabContent.classList.remove('loader-on'); } } } } $(document).ready(function() { getRegions(); }); function setDisplayInternational() { document.getElementById('region-dropdown-int').style.display = 'block' } // Add an event listener to toggle the 'open' class when the custom-select is clicked document.addEventListener('DOMContentLoaded', function() { var customSelect = document.querySelector('.custom-select'); var selectOptions = document.getElementById('industry-options'); var regionDropdown = document.getElementById('region'); var regionDropdownBox = document.getElementById('region-dropdown'); function setDisplay(style) { selectOptions.style.display = style; } function setDisplayRegion(style) { regionDropdownBox.style.display = style; } regionDropdown.addEventListener('click', function() { setDisplayRegion('block'); }); customSelect.addEventListener('mouseenter', function() { setDisplay('block'); }); customSelect.addEventListener('mouseleave', function() { setDisplay('none'); }); }); function closeDropdown() { var dropdown = document.getElementById('region-dropdown'); dropdown.style.display = 'none'; // or set another appropriate style to hide the dropdown } // Add an event listener to each radio button to close the dropdown when clicked var radioButtons = document.querySelectorAll('input[type="radio"][name="region"]'); radioButtons.forEach(function(radioButton) { radioButton.addEventListener('click', closeDropdown); }); -->