A Custom Salesforce Community Search Component for POS Nation's Salesforce

salesforce-community-custom-search.js

//-- Grab search element that will be doing search
const searchInput = document.getElementById("search-custom-erikplachta");

//-- where results message appears
const resultsMessage = document.querySelector("#results-message");

//-- where search URL to appear for aareness
const searchLocation_Base = document.querySelector("#search-url");

//-- defined on load as global by default.
let selectedSearchLocation;

//-- used to verify location and auto-fill keywords.
const Locations = {
  "global" : {
    url:      "https://help.posnation.com/s/global-search/", 
    keyword: ''
  },  
  "/capretail/" : {
    keyword:  "CAPPOSKBA2021",
    url:      "https://help.posnation.com/capretail/s/global-search/"
  },
  "/bottle-pos/" : {
    keyword: "BPOSKBA2022",
    url: "https://help.posnation.com/bottlepos/s/global-search/",
  }
}

//-- Get the search request, add the base URL, add the values, return results for navigation
const buildURL = function(searchRequest) {

  //-- get location value
  const pathname = document.location.pathname;  
  //-- encoding to a URL str value
  const searchRequest_URL = encodeURI(searchRequest);
  
  //-- Verify if user making search from defined location
  for (const [key, value] of Object.entries(Locations)) {
    //-- IF making search-request from a defined location, return proper URL with keyword
    if(pathname.includes(key)){ return(`${value.url}${value.keyword}%20${searchRequest_URL}`);  };
  };

  //-- Otherwise, not a defined location so return global location URL
  return (`${Locations.global.url}${searchRequest_URL}` );
};

//-- When search happens, updating list with results
searchInput.onsearch = function(){  
  let searchRequestURL = buildURL(searchInput.value);
  window.location.href = searchRequestURL;
};

//-- when loads events
window.addEventListener('load', function() {    
  //-- assign focus to search bar
  document.getElementById("search-custom-erikplachta").focus();
});