RP Promap Help Series
Custom Store Locator Radius Behavior (Country Detection)
Author: Rose Perl Technology
Last Updated: March 2026
Scope: Shopify theme customization for RP Promap Store Locator
Related System: RP Promap Store Locator
Overview
This guide documents a custom JavaScript enhancement implemented on the RP Promap Store Locator page to automatically adjust the search radius when a country-level search is detected.
By default, store locator searches use a fixed radius. However, when users search by country, limiting the radius can prevent relevant locations from appearing.
This customization ensures that when a country is selected, the radius is automatically set to “No Limit” before the search executes.
The solution is implemented safely within the Shopify theme and does not modify any RP Promap core application files.
Problem
When users search for a country-level location (example: United States, Canada), the store locator radius may restrict results.
Example issue:
User searches for "United States"
Default radius still applies
Many locations outside the radius are excluded
Users see incomplete results
This leads to confusion and reduces the effectiveness of the store locator.
Solution
A custom JavaScript listener was added to the theme to detect when the user selects a country-level location.
When a country is detected, the script:
Intercepts the user action before the search executes
Identifies if the selected location appears to be a country
Automatically sets the search radius to No Limit
This allows the store locator to return all available locations within that country.
How It Works
The script listens for two types of user actions that trigger a search.
1. Selecting a Google Autocomplete Result
When the user clicks a location suggestion in the Google Places Autocomplete dropdown, the script checks the selected text.
If it appears to be a country, the radius is changed to No Limit.
2. Pressing Enter in the Location Field
If the user presses Enter while the location input is focused, the script evaluates the typed value.
If the value appears to represent a country, the radius is updated before the search executes.
Country Detection Logic
The script determines whether a search term is likely a country using lightweight heuristics:
A value is treated as a country if:
It does not contain numbers
It does not contain commas
It contains three words or fewer
Examples detected as countries:
United States
Canada
France
Germany
Examples not treated as countries:
Miami, Florida
90210
123 Main Street
Los Angeles, CA
This ensures that city and address searches remain unaffected.
Search Behavior
The customization does not change the store locator search flow.
User Action | Behavior |
Typing characters | No search triggered |
Selecting autocomplete suggestion | Search executes normally |
Pressing Enter | Search executes normally |
The only modification is:
If the location is detected as a country, the radius is automatically set to "No Limit" immediately before the search runs.
Implementation Location
The script was added directly to the Shopify theme:
File
theme.liquid
Scope restriction
The script runs only on the Store Locator page.
{% if request.path contains 'store-locator' %}This ensures the script does not affect any other pages in the storefront.
Code Implementation
{% if request.path contains 'store-locator' %}
<script>
(function () {
const addressInputId = 'bh-sl-address';
const radiusSelectId = 'scasl-radius-container';
function setNoLimit() {
const radius = document.getElementById(radiusSelectId);
if (!radius) return;
radius.value = '0';
}
// Handle click on Google Autocomplete item
document.addEventListener('mousedown', function (e) {
const item = e.target.closest('.pac-item');
if (!item) return;
const text = item.innerText || '';
const isCountry =
!/\d/.test(text) &&
!text.includes(',') &&
text.trim().split(/\s+/).length <= 3;
if (isCountry) {
setNoLimit();
}
}, true);
// Handle Enter key in location input
document.addEventListener('keydown', function (e) {
if (e.key !== 'Enter') return;
const input = document.getElementById(addressInputId);
if (!input || document.activeElement !== input) return;
const value = input.value || '';
const isCountry =
!/\d/.test(value) &&
!value.includes(',') &&
value.trim().split(/\s+/).length <= 3;
if (isCountry) {
setNoLimit();
}
});
})();
</script>
{% endif %}Scope & Safety
This customization was designed to avoid impacting the RP Promap application or Shopify theme functionality.
Isolation
The script runs only on the Store Locator page.
Non-invasive
No RP Promap core files were modified.
UX preserved
Existing search behavior and UI interactions remain unchanged.
Safe deployment
Because the code lives in the Shopify theme, it will not be overwritten by RP Promap app updates.
Benefits
This enhancement improves the store locator experience by:
Ensuring country-level searches return complete results
Preventing radius limitations from hiding locations
Maintaining the existing search flow
Avoiding core app modifications
Maintenance Notes
If the Store Locator page URL changes, update the condition in the script:
{% if request.path contains 'store-locator' %}Additionally, if the locator input IDs change in a future RP Promap update, the following variables may need adjustment:
bh-sl-address
scasl-radius-container
Internal Reference
This customization was implemented as part of an RP Promap store locator improvement to support country-level searches without requiring modifications to the core application.
Owner: Rose Perl Technology