\n\n\n\n\n
\n\n\n\n\n\n\n\n","html_footer_meta":"\n\n
\n","html_hidelinks":false,"showVersion":false,"hideTableOfContents":false,"nextStepsLabel":"","promos":[{"extras":{"type":"none","buttonPrimary":"get-started","buttonSecondary":"none"},"title":"","text":"","_id":"5fa9a583c88a1e003de1fb64"}],"ai_dropdown":"disabled","ai_options":{"chatgpt":"enabled","claude":"enabled","clipboard":"enabled","copilot":"enabled","view_as_markdown":"enabled"},"showPageIcons":true,"layout":{"full_width":false,"style":"classic"}},"child":{"_id":"6606e9c5e8ce1f005276b057","appearance":{"changelog":{"layoutExpanded":false,"showAuthor":false,"showExactDate":true},"rdmd":{"callouts":{"useIconFont":false},"theme":{"background":"","border":"","markdownEdge":"","markdownFont":"","markdownFontSize":"","markdownLineHeight":"","markdownRadius":"","markdownText":"","markdownTitle":"","markdownTitleFont":"","mdCodeBackground":"","mdCodeFont":"","mdCodeRadius":"","mdCodeTabs":"","mdCodeText":"","tableEdges":"","tableHead":"","tableHeadText":"","tableRow":"","tableStripe":"","tableText":"","text":"","title":""}},"main_body":{"type":"links"},"colors":{"highlight":"","main":"eeeeee","main_alt":"","header_text":"","body_highlight":"#3333FF","custom_login_link_color":""},"typography":{"headline":"Open+Sans:400:sans-serif","body":"Open+Sans:400:sans-serif","typekit":false,"tk_key":"","tk_headline":"","tk_body":""},"header":{"style":"solid","img":[],"img_size":"auto","img_pos":"tl","linkStyle":"buttons"},"body":{"style":"none"},"global_landing_page":{"html":"","redirect":""},"allowApiExplorerJsonEditor":false,"referenceSimpleMode":true,"referenceLayout":"column","link_logo_to_url":true,"theme":"line","colorScheme":"light","overlay":"triangles","landing":true,"sticky":false,"hide_logo":true,"childrenAsPills":false,"subheaderStyle":"dropdown","splitReferenceDocs":true,"showMetricsInReference":false,"logo":["https://files.readme.io/af60d4b-small-395ef92-small-docs.png","af60d4b-small-395ef92-small-docs.png",324,40,"#000000","https://files.readme.io/99736b7-395ef92-small-docs.png","660acd14efe91e001fbe334d"],"loginLogo":[],"logo_white":[],"logo_white_use":false,"logo_large":false,"favicon":["https://files.readme.io/8053e33-small-favicon.png","favicon.png",32,32,"#1c1c1c","https://files.readme.io/6735b58-favicon.png"],"stylesheet":"","stylesheet_hub2":"#ssr-main > div > header > div.Header-bottom2eLKOFXMEmh5.rm-Header-bottom > div > nav > div.Dropdown{\n display:none; \n}\n\n.icon-arrow-up-right:before {\n display:none;\n\n}\n\n.Sidebar-item23D-2Kd61_k3:last-child a[href=\"https://docs.foursquare.com/developer/reference/places-api-overview\"] .Sidebar-link-text_label1gCT_uPnx7Gu {\n color: red; /* Example */\n font-weight: bold;\n font-size:12px;\n}\n\n\n.Param1QyvwHroaCgH .Collapseda2tBtFifUAjo .Param1QyvwHroaCgH {\n display: block;\n}\n\n.Param1QyvwHroaCgH .Collapseda2tBtFifUAjo .Param-form1SoAutupIaz3 {\n margin-left: 10px;\n max-width: 100%;\n}\n\n\n/* Custom Console Doc Styles */\n@media (max-width: 768px){\nbody:not(.showSidebarFlyout) #hub-sidebar.Sidebar_flyout2qTF85usvHxB, body:not(.showSidebarFlyout) #reference-sidebar.Sidebar_flyout2qTF85usvHxB {\n display: none !important;\n}\n}\n\n.rm-Sidebar_guides .hub-sidebar-content > section:last-of-type > .Sidebar-headingTRQyOa2pk0gh {\n display: none !important;\n}\n\nli.Sidebar-item23D-2Kd61_k3.expanded-section-item a[href=\"/developer/docs/developer-console-overview\"] {\n /* Applying styles */\n border-radius: 4px;\n background: #F2EEFB !important;\n box-shadow: 2px 0 0 0 #686df3 inset;\n color: #4f5a66 !important;\n margin-left:-15px !important;\n font-weight:500;\n}\n\n\n.rm-Sidebar_guides {\n opacity: 0;\n animation: fadeIn 0s 1s forwards;\n}\n\n@keyframes fadeIn {\n to {\n opacity: 1;\n }\n}","stylesheet_hub3":"","javascript":"","javascript_hub2":"document.addEventListener('DOMContentLoaded', () => {\n // Select all links in the header\n const headerLinks = document.querySelectorAll('.Header-leftADQdGVqx1wqU a');\n\n headerLinks.forEach(link => {\n const href = link.getAttribute('href');\n\n // Check if the href contains the versioned path (e.g., \"/developer/v20241206/\")\n if (href && href.includes('/developer/v')) {\n // Rewrite the URL by removing the versioned part\n const updatedHref = href.replace(/\\/developer\\/v\\d+\\//, '/developer/');\n link.setAttribute('href', updatedHref);\n }\n });\n});\n\n\n\n$(window).on(\"pageLoad\", function (e, state) {\n setTimeout(function () {\n // Check if there's an active link within the Developer Console section\n const isActiveDeveloperConsolePage =\n document.querySelector(\n \".Sidebar-listWrapper6Q9_yUrG906C .Sidebar-link2Dsha-r-GKh2.active\"\n ) !== null;\n\n if (isActiveDeveloperConsolePage) {\n const developerConsoleSection = Array.from(\n document.querySelectorAll(\n \".rm-Sidebar_guides .Sidebar-headingTRQyOa2pk0gh\"\n )\n ).find(\n (heading) =>\n heading.textContent.includes(\"Developer Console\") &&\n heading.classList.contains(\"section-expanded\")\n )?.parentNode;\n\n if (developerConsoleSection) {\n document\n .querySelectorAll(\n \".rm-Sidebar_guides .Sidebar-listWrapper6Q9_yUrG906C\"\n )\n .forEach((section) => {\n section.style.display =\n section === developerConsoleSection ? \"\" : \"none\";\n section\n .querySelectorAll(\n \".Sidebar-item23D-2Kd61_k3, .subpages .Sidebar-item23D-2Kd61_k3\"\n )\n .forEach((item) => {\n item.style.display = \"\";\n });\n });\n\n const lastSectionHeading = document.querySelector(\n \".rm-Sidebar_guides .hub-sidebar-content > section:last-of-type > .Sidebar-headingTRQyOa2pk0gh\"\n );\n if (\n lastSectionHeading &&\n lastSectionHeading.textContent.includes(\"Developer Console\")\n ) {\n lastSectionHeading.style.display = \"block\";\n }\n\n // Call the function to duplicate navigation after a short delay to ensure the page is fully loaded\n setTimeout(function () {\n duplicateNavigation();\n }, 1); // Adjust the delay as needed\n }\n } else {\n\n // Hide the Developer Console section\n const developerConsoleSection = document.querySelector('.rm-Sidebar_guides .Sidebar-headingTRQyOa2pk0gh');\n if (developerConsoleSection) {\n developerConsoleSection.parentNode.style.display = \"none\";\n }\n\n // Restore visibility of all other sidebar sections\n document\n .querySelectorAll(\".rm-Sidebar_guides .Sidebar-listWrapper6Q9_yUrG906C\")\n .forEach((section) => {\n section.style.display = \"\";\n });\n\n // Ensure that all section headings are visible\n document\n .querySelectorAll(\".rm-Sidebar_guides .Sidebar-headingTRQyOa2pk0gh\")\n .forEach((heading) => {\n heading.style.display = \"block\"; // Or whatever the default should be\n });\n\n // Remove the 'active' class from the Console Docs link in the top navigation, if it was set\n const consoleDocsLink = document.querySelector(\n '.Header-bottom-link[href*=\"developer/docs/developer-console-overview\"]'\n );\n if (consoleDocsLink) {\n consoleDocsLink.classList.remove(\"active\");\n }\n\n // Add the 'active' class to the Console Docs link\n const newConsoleDocsLink = document.querySelector('.Header-bottom-link[href*=\"developer/docs/developer-console-overview\"]');\n if (newConsoleDocsLink) {\n newConsoleDocsLink.classList.add(\"active\");\n }\n }\n }, 10); // Adjust delay as needed\n});\n\n\n// Function to duplicate and insert the original navigation\nfunction duplicateNavigation() {\n // Get the original element to be duplicated\n var originalElement = document.querySelector(\n \".rm-Header-bottom\"\n );\n\n // Check if the original element exists\n if (originalElement) {\n // Clone the original element\n var clonedElement = originalElement.cloneNode(true);\n\n // Insert the cloned element directly after the original element\n originalElement.parentNode.insertBefore(\n clonedElement,\n originalElement.nextSibling\n );\n\n // Hide the original element\n originalElement.style.display = \"none\";\n\n // Remove 'active' class from navigation links below\n const navigationLinks = document.querySelectorAll('.Header-leftADQdGVqx1wqU a');\n navigationLinks.forEach(link => {\n link.classList.remove('active');\n });\n\n // Add the 'active' class to the first Console Docs link\n const consoleDocsLink = document.querySelectorAll('.rm-Header-link[href*=\"developer/docs/developer-console-overview\"]')[1];\n if (consoleDocsLink) {\n consoleDocsLink.classList.add(\"active\");\n console.log(\"Added Active to Console Docs Link\");\n }\n }\n}\n\n\n\n$(window).on('pageLoad', function(e, state) {\n if (state && state.params && state.params.slug === \"address-form-autofill\") {\n function localAddressAutoFillJs() {\n const fsqAPIToken = \"fsq3gM6Yqlox6l+EPn1ITXAlJxk5YaBFlQS5bKofN7ov5W8=\";\n let sessionToken = generateRandomSessionToken();\n const addressInput = document.getElementById(\"autofill-search\");\n const dropDownField = document.getElementById(\"autofill-dropdown\");\n const ulField = document.getElementById(\"autofill-suggestions\");\n const errorField = document.getElementById(\"autofill-error\");\n const notFoundField = document.getElementById(\"autofill-not-found\");\n const cityInput = document.getElementById(\"autofill-city\");\n const regionInput = document.getElementById(\"autofill-region\");\n const countryInput = document.getElementById(\"autofill-country\");\n const postcodeInput = document.getElementById(\"autofill-postcode\");\n const address2Input = document.getElementById(\"autofill-address2\");\n const form = document.getElementById(\"autofill-form\");\n const searchContainer = document.getElementById(\n \"autofill-search-container\"\n );\n\n form && form.addEventListener(\"submit\", preventFormSubmit, true);\n const onChangeAutoComplete = debounce(changeAutoComplete);\n addressInput &&\n addressInput.addEventListener(\"input\", onChangeAutoComplete);\n searchContainer &&\n searchContainer.addEventListener(\"focusin\", focusEventAutoComplete);\n searchContainer &&\n searchContainer.addEventListener(\"focusout\", focusEventAutoComplete);\n\n ulField && ulField.addEventListener(\"click\", selectItem);\n\n function focusEventAutoComplete(event) {\n if (event.type === \"focusin\" && event.target.value) {\n dropDownField.style.display = \"block\";\n } else if (\n event.type === \"focusout\" &&\n !event.currentTarget.contains(event.relatedTarget)\n ) {\n dropDownField.style.display = \"none\";\n }\n }\n\n function preventFormSubmit(event) {\n event.preventDefault();\n }\n\n function logError(err) {\n console.warn(`ERROR(${err.code}): ${err.message}`);\n }\n\n /* Generate a random string with 32 characters.\n Session Token is a user-generated token to identify a session for billing purposes.\n Learn more about session tokens.\n https://docs.foursquare.com/reference/session-tokens\n */\n function generateRandomSessionToken(length = 32) {\n let result = \"\";\n const characters = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\n for (let i = 0; i < length; i++) {\n result += characters[Math.floor(Math.random() * characters.length)];\n }\n return result;\n }\n\n let isFetching = false;\n async function changeAutoComplete({ target }) {\n const { value: inputSearch = \"\" } = target;\n ulField.innerHTML = \"\";\n notFoundField.style.display = \"none\";\n errorField.style.display = \"none\";\n if (inputSearch.length && !isFetching) {\n try {\n isFetching = true;\n const results = await autoComplete(inputSearch);\n if (results && results.length) {\n results.forEach((value) => {\n addItem(value);\n });\n } else {\n notFoundField.innerHTML = `Foursquare can't\n find ${inputSearch}. Make sure your search is spelled correctly.`;\n notFoundField.style.display = \"block\";\n }\n } catch (err) {\n errorField.style.display = \"block\";\n logError(err);\n } finally {\n isFetching = false;\n dropDownField.style.display = \"block\";\n }\n } else {\n dropDownField.style.display = \"none\";\n }\n }\n\n async function autoComplete(query) {\n try {\n const searchParams = new URLSearchParams({\n query,\n types: \"address\",\n session_token: sessionToken,\n }).toString();\n const searchResults = await fetch(\n `https://api.foursquare.com/v3/autocomplete?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await searchResults.json();\n return data.results;\n } catch (error) {\n throw error;\n }\n }\n\n function addItem(value) {\n const { link } = value;\n if (!link) return;\n ulField.innerHTML += `
\n ${highlightedNameElement(value.text)}
\n ${value.text.secondary}
\n `;\n }\n\n async function selectItem({ target }) {\n if (target.tagName === \"BUTTON\") {\n const link = target.dataset.object;\n const addressDetail = await fetchAddressDetails(link);\n const { location = {} } = addressDetail;\n const {\n address = \"\",\n country = \"\",\n postcode = \"\",\n locality = \"\",\n region = \"\",\n } = location;\n addressInput.value = address;\n address2Input.value = \"\";\n countryInput.value = country;\n postcodeInput.value = postcode;\n cityInput.value = locality;\n regionInput.value = region;\n // generate new session token after a complete search\n sessionToken = generateRandomSessionToken();\n\n address2Input && address2Input.focus();\n dropDownField.style.display = \"none\";\n }\n }\n\n async function fetchAddressDetails(link) {\n try {\n const results = await fetch(`https://api.foursquare.com${link}`, {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n });\n const data = await results.json();\n return data;\n } catch (err) {\n logError(err);\n }\n }\n\n function highlightedNameElement(textObject) {\n if (!textObject) return \"\";\n const { primary, highlight } = textObject;\n if (highlight && highlight.length) {\n let beginning = 0;\n let hightligtedWords = \"\";\n for (let i = 0; i < highlight.length; i++) {\n const { start, length } = highlight[i];\n hightligtedWords += primary.substr(beginning, start - beginning);\n hightligtedWords += \"
\" + primary.substr(start, length) + \" \";\n beginning = start + length;\n }\n hightligtedWords += primary.substr(beginning);\n return hightligtedWords;\n }\n return primary;\n }\n\n function debounce(func, timeout = 300) {\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n func.apply(this, args);\n }, timeout);\n };\n }\n }\n\n localAddressAutoFillJs();\n }\n if (state && state.params && state.params.slug === \"local-search-map\") {\n function loadLocalMapSearchJs() {\n mapboxgl.accessToken =\n \"pk.eyJ1IjoiZm91cnNxdWFyZSIsImEiOiJjbDNqNXdrN20wN3JtM2JvMWFqZGxoaGljIn0.uSxJ2t7E96TrBFsn3cXT_g\";\n const fsqAPIToken = \"fsq3bgqdcpLAJFkodk8gisc2F+NenA7gK/zI97A9nKQAXIw=\";\n let userLat = 40.7128;\n let userLng = -74.006;\n let sessionToken = generateRandomSessionToken();\n const inputField = document.getElementById(\"explorer-search\");\n const dropDownField = document.getElementById(\"explorer-dropdown\");\n const ulField = document.getElementById(\"explorer-suggestions\");\n const errorField = document.getElementById(\"explorer-error\");\n const notFoundField = document.getElementById(\"explorer-not-found\");\n\n const onChangeAutoComplete = debounce(changeAutoComplete);\n inputField.addEventListener(\"input\", onChangeAutoComplete);\n ulField.addEventListener(\"click\", selectItem);\n\n function success(pos) {\n const { latitude, longitude } = pos.coords;\n userLat = latitude;\n userLng = longitude;\n flyToLocation(userLat, userLng);\n }\n\n function logError(err) {\n console.warn(`ERROR(${err.code}): ${err.message}`);\n }\n\n navigator.geolocation.getCurrentPosition(success, logError, {\n enableHighAccuracy: true,\n timeout: 5000,\n maximumAge: 0,\n });\n\n const map = new mapboxgl.Map({\n container: \"map\",\n style: \"mapbox://styles/mapbox/light-v10\",\n center: [userLng, userLat],\n zoom: 12,\n });\n\n map.addControl(new mapboxgl.GeolocateControl());\n map.addControl(new mapboxgl.NavigationControl());\n\n let currentMarker;\n\n /* Generate a random string with 32 characters.\n Session Token is a user-generated token to identify a session for billing purposes.\n Learn more about session tokens.\n https://docs.foursquare.com/reference/session-tokens\n */\n function generateRandomSessionToken(length = 32) {\n let result = \"\";\n const characters = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\n for (let i = 0; i < length; i++) {\n result += characters[Math.floor(Math.random() * characters.length)];\n }\n return result;\n }\n\n let isFetching = false;\n async function changeAutoComplete({ target }) {\n const { value: inputSearch = \"\" } = target;\n ulField.innerHTML = \"\";\n notFoundField.style.display = \"none\";\n errorField.style.display = \"none\";\n if (inputSearch.length && !isFetching) {\n try {\n isFetching = true;\n const results = await autoComplete(inputSearch);\n if (results && results.length) {\n results.forEach((value) => {\n addItem(value);\n });\n } else {\n notFoundField.innerHTML = `Foursquare can't\n find ${inputSearch}. Make sure your search is spelled correctly.\n
Don't see the place you're looking for? .`;\n notFoundField.style.display = \"block\";\n }\n } catch (err) {\n errorField.style.display = \"block\";\n logError(err);\n } finally {\n isFetching = false;\n dropDownField.style.display = \"block\";\n }\n } else {\n dropDownField.style.display = \"none\";\n }\n }\n\n async function autoComplete(query) {\n const { lng, lat } = map.getCenter();\n userLat = lat;\n userLng = lng;\n try {\n const searchParams = new URLSearchParams({\n query,\n types: \"place\",\n ll: `${userLat},${userLng}`,\n radius: 50000,\n session_token: sessionToken,\n }).toString();\n const searchResults = await fetch(\n `https://api.foursquare.com/v3/autocomplete?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await searchResults.json();\n return data.results;\n } catch (error) {\n throw error;\n }\n }\n\n function addItem(value) {\n const placeDetail = value[value.type];\n if (!placeDetail || !placeDetail.geocodes || !placeDetail.geocodes.main)\n return;\n const { latitude, longitude } = placeDetail.geocodes.main;\n const fsqId = placeDetail.fsq_id;\n const dataObject = JSON.stringify({ latitude, longitude, fsqId });\n ulField.innerHTML += `
\n ${highlightedNameElement(value.text)}
\n ${value.text.secondary}
\n `;\n }\n\n async function selectItem({ target }) {\n if (target.tagName === \"LI\") {\n const valueObject = JSON.parse(target.dataset.object);\n const { latitude, longitude, fsqId } = valueObject;\n const placeDetail = await fetchPlacesDetails(fsqId);\n addMarkerAndPopup(latitude, longitude, placeDetail);\n flyToLocation(latitude, longitude);\n\n // generate new session token after a complete search\n sessionToken = generateRandomSessionToken();\n const name = target.dataset.name;\n inputField.value = target.children[0].textContent;\n dropDownField.style.display = \"none\";\n }\n }\n\n async function fetchPlacesDetails(fsqId) {\n try {\n const searchParams = new URLSearchParams({\n fields: \"fsq_id,name,geocodes,location,photos,rating\",\n session_token: sessionToken,\n }).toString();\n const results = await fetch(\n `https://api.foursquare.com/v3/places/${fsqId}?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await results.json();\n return data;\n } catch (err) {\n logError(err);\n }\n }\n\n function createPopup(placeDetail) {\n const { location = {}, name = \"\", photos = [], rating } = placeDetail;\n let photoUrl = \"https://files.readme.io/c163d6e-placeholder.svg\";\n if (photos.length && photos[0]) {\n photoUrl = `${photos[0].prefix}56${photos[0].suffix}`;\n }\n const popupHTML = ``;\n\n const markerHeight = 35;\n const markerRadius = 14;\n const linearOffset = 8;\n const verticalOffset = 8;\n const popupOffsets = {\n top: [0, verticalOffset],\n \"top-left\": [0, verticalOffset],\n \"top-right\": [0, verticalOffset],\n bottom: [0, -(markerHeight + verticalOffset)],\n \"bottom-left\": [\n 0,\n (markerHeight + verticalOffset - markerRadius + linearOffset) * -1,\n ],\n \"bottom-right\": [\n 0,\n (markerHeight + verticalOffset - markerRadius + linearOffset) * -1,\n ],\n left: [\n markerRadius + linearOffset,\n (markerHeight - markerRadius) * -1,\n ],\n right: [\n -(markerRadius + linearOffset),\n (markerHeight - markerRadius) * -1,\n ],\n };\n return new mapboxgl.Popup({\n offset: popupOffsets,\n closeButton: false,\n }).setHTML(popupHTML);\n }\n\n function addMarkerAndPopup(lat, lng, placeDetail) {\n if (currentMarker) currentMarker.remove();\n currentMarker = new mapboxgl.Marker({\n color: \"#3333FF\",\n })\n .setLngLat([lng, lat])\n .setPopup(createPopup(placeDetail))\n .addTo(map);\n\n currentMarker.togglePopup();\n }\n\n function flyToLocation(lat, lng) {\n map.flyTo({\n center: [lng, lat],\n });\n }\n\n function highlightedNameElement(textObject) {\n if (!textObject) return \"\";\n const { primary, highlight } = textObject;\n if (highlight && highlight.length) {\n let beginning = 0;\n let hightligtedWords = \"\";\n for (let i = 0; i < highlight.length; i++) {\n const { start, length } = highlight[i];\n hightligtedWords += primary.substr(beginning, start - beginning);\n hightligtedWords += \"
\" + primary.substr(start, length) + \" \";\n beginning = start + length;\n }\n hightligtedWords += primary.substr(beginning);\n return hightligtedWords;\n }\n return primary;\n }\n\n function debounce(func, timeout = 300) {\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n func.apply(this, args);\n }, timeout);\n };\n }\n }\n\n loadLocalMapSearchJs();\n }\n});\n\n$(window).on(\"pageLoad\", function (e, state) {\n const openSearchPopup = () => {\n const headerSearch = document.getElementById(\"hub-search-results\");\n if (headerSearch) {\n headerSearch.classList.add(\"hub-search-results-active\");\n document\n .getElementsByClassName(\"Input Input_md SearchBox-InputUQZAW9QXMe-c\")[0]\n ?.focus();\n }\n };\n\n const triggerSearchButton = document.getElementsByClassName(\n \"landing-page-trigger-search-button\"\n )[0];\n if (triggerSearchButton) {\n triggerSearchButton.addEventListener(\"click\", openSearchPopup);\n }\n});\n\n// START: Add Segment Tracking to Try It button\n// TODO: Verify this runs on route changes, so button gets instrumented on every page\n$(window).on(\"load\", function (e, state) {\n var tryItBtn = document.querySelector(\".rm-TryIt\");\n\n // in case the button has not yet renedered\n if (tryItBtn === undefined) return;\n\n tryItBtn.addEventListener(\"click\", () => {\n console.log(\"Try It button Clicked (project)\");\n analytics.track(\"Try It button Clicked\");\n });\n});\n// END: Add Segment Tracking to Try It button\n\n\n\n// CUSTOM LAUNCH TOP NAV CODE - README \ndocument.addEventListener('DOMContentLoaded', () => {\n setTimeout(() => {\n document.querySelectorAll('.Header-leftADQdGVqx1wqU a[href]').forEach(a => {\n a.addEventListener('click', e => {\n e.preventDefault();\n window.location.href = a.href;\n });\n });\n }, 100);\n});\n\n// CUSTOM LAUNCH SIDEBAR CODE (FINAL project: inject Places first, then Users under Welcome)\n// Runs after a short delay to avoid flicker or unwanted auto-expansion.\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n // Delay entire injection by 1 second\n setTimeout(() => {\n (async function() {\n // Normalize path (strip trailing slash)\n const path = window.location.pathname.replace(/\\/$/, '');\n\n // Only act on the FINAL project paths\n if (!path.startsWith('/developer/reference/')) {\n return;\n }\n\n // Pages to pull from: Places API overview and Users API overview\n // **Places first**, then Users\n const toInject = [\n {\n otherPageUrl: '/fsq-developers-places/reference/places-api-overview',\n targetSectionText: 'Places API'\n },\n {\n otherPageUrl: '/fsq-developers-users/reference/users-api-overview',\n targetSectionText: 'Users API'\n }\n ];\n\n // If versioned (e.g. /v2023-05-01/ in URL), insert version segment into otherPageUrl\n const versionMatch = window.location.pathname.match(/\\/(v\\d{4}-\\d{2}-\\d{2})\\//);\n function applyVersion(url) {\n if (versionMatch) {\n const version = versionMatch[1];\n return url.replace('/reference/', `/${version}/reference/`);\n }\n return url;\n }\n\n // Fetch & cache a single section's HTML from another page\n async function fetchSectionHtml(otherPageUrl, targetSectionText) {\n const versionedUrl = applyVersion(otherPageUrl);\n const cacheKey = `crossSection:${versionedUrl}:${targetSectionText}`;\n const cached = sessionStorage.getItem(cacheKey);\n if (cached) {\n return cached;\n }\n try {\n const resp = await fetch(versionedUrl, { credentials: 'same-origin' });\n if (!resp.ok) {\n console.warn('[CrossInject] Fetch failed', resp.status, versionedUrl);\n return null;\n }\n const htmlText = await resp.text();\n // Parse to DOM\n const parser = new DOMParser();\n const doc = parser.parseFromString(htmlText, 'text/html');\n // Find the sidebar section\n const sidebarSelector = '.rm-Sidebar';\n const otherSidebar = doc.querySelector(sidebarSelector);\n if (!otherSidebar) {\n console.warn('[CrossInject] Sidebar not found for', versionedUrl);\n return null;\n }\n // Locate the
whose includes targetSectionText\n let foundSection = null;\n otherSidebar.querySelectorAll('section').forEach(sec => {\n if (foundSection) return;\n const h2 = sec.querySelector('h2');\n if (h2 && h2.textContent.trim().includes(targetSectionText)) {\n foundSection = sec;\n }\n });\n if (!foundSection) {\n console.warn('[CrossInject] Section not found:', targetSectionText, 'in', versionedUrl);\n return null;\n }\n const sectionHtml = foundSection.outerHTML;\n try {\n sessionStorage.setItem(cacheKey, sectionHtml);\n } catch (_) {}\n return sectionHtml;\n } catch (err) {\n console.error('[CrossInject] Error fetching/parsing:', err);\n return null;\n }\n }\n\n // Wait until the current page's sidebar is present\n function whenSidebarReady(fn) {\n const interval = setInterval(() => {\n const sidebarNav = document.querySelector('.rm-Sidebar');\n if (sidebarNav) {\n clearInterval(interval);\n fn(sidebarNav);\n }\n }, 100);\n // Stop polling after 5s\n setTimeout(() => clearInterval(interval), 5000);\n }\n\n // Collapse helper for a section element\n function collapseSection(sec) {\n const h2 = sec.querySelector('h2');\n const ul = sec.querySelector('ul');\n if (h2) {\n h2.classList.remove('section-expanded');\n h2.classList.add('section-collapsed');\n h2.setAttribute('aria-expanded', 'false');\n }\n if (ul) {\n ul.classList.add('section-collapsed');\n ul.classList.remove('section-list-expanded');\n }\n }\n // Expand helper\n function expandSection(sec) {\n const h2 = sec.querySelector('h2');\n const ul = sec.querySelector('ul');\n if (h2) {\n h2.classList.remove('section-collapsed');\n h2.classList.add('section-expanded');\n h2.setAttribute('aria-expanded', 'true');\n }\n if (ul) {\n ul.classList.remove('section-collapsed');\n ul.classList.add('section-list-expanded');\n }\n }\n\n // Fetch all needed sections in parallel\n const results = await Promise.all(\n toInject.map(item =>\n fetchSectionHtml(item.otherPageUrl, item.targetSectionText)\n .then(html => ({ ...item, sectionHtml: html }))\n )\n );\n const validSections = results.filter(r => r.sectionHtml);\n if (validSections.length === 0) {\n return;\n }\n\n // Once our sidebar is ready, inject under \"Welcome\"\n whenSidebarReady(sidebarNav => {\n const contentDiv = sidebarNav.querySelector('.hub-sidebar-content');\n if (!contentDiv) {\n console.warn('[CrossInject] .hub-sidebar-content not found; abort insertion.');\n return;\n }\n\n // Find \"Welcome\" section\n const welcomeSection = Array.from(contentDiv.querySelectorAll('section')).find(sec => {\n const h2 = sec.querySelector('h2');\n return h2 && h2.textContent.trim() === 'Welcome';\n });\n let insertAfter = welcomeSection;\n\n validSections.forEach(({ targetSectionText, sectionHtml }) => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = sectionHtml;\n const originalSectionNode = wrapper.firstElementChild;\n if (!originalSectionNode) {\n console.warn('[CrossInject] No section node for', targetSectionText);\n return;\n }\n const sectionClone = originalSectionNode.cloneNode(true);\n\n // Adapt heading & toggle as needed:\n const injectedH2 = sectionClone.querySelector('h2');\n const injectedUL = sectionClone.querySelector('ul');\n if (injectedH2 && injectedUL) {\n // Copy classes from an existing template if present\n const templateH2 = sidebarNav.querySelector('.hub-sidebar-content section h2');\n if (templateH2) {\n injectedH2.className = templateH2.className;\n } else {\n injectedH2.classList.add('Sidebar-headingTRQyOa2pk0gh', 'rm-Sidebar-heading');\n }\n injectedH2.setAttribute('tabindex', '0');\n // Remove existing chevrons, clone from template or fallback\n Array.from(injectedH2.querySelectorAll('.icon-chevron')).forEach(el => el.remove());\n if (templateH2) {\n templateH2.querySelectorAll('.icon-chevron').forEach(iconSpan => {\n injectedH2.appendChild(iconSpan.cloneNode(true));\n });\n } else {\n const fallbackSpan = document.createElement('span');\n fallbackSpan.className = 'icon-chevron';\n injectedH2.appendChild(fallbackSpan);\n }\n // Initially collapsed\n collapseSection(sectionClone);\n\n // Toggle handler\n const toggleFn = () => {\n const isCollapsed = injectedUL.classList.contains('section-collapsed');\n if (isCollapsed) {\n expandSection(sectionClone);\n } else {\n collapseSection(sectionClone);\n }\n };\n injectedH2.style.cursor = 'pointer';\n injectedH2.addEventListener('click', toggleFn);\n injectedH2.addEventListener('keydown', e => {\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {\n e.preventDefault();\n toggleFn();\n }\n });\n }\n\n // Nested toggles\n sectionClone.querySelectorAll('a.Sidebar-link_parent').forEach(aParent => {\n let btn = aParent.querySelector('button');\n if (!btn && aParent.nextElementSibling && aParent.nextElementSibling.tagName === 'BUTTON') {\n btn = aParent.nextElementSibling;\n }\n let subUl = null;\n if (btn) {\n const maybeUl = btn.parentElement.nextElementSibling;\n if (maybeUl && maybeUl.classList.contains('subpages')) subUl = maybeUl;\n }\n if (!subUl) {\n const parentLi = aParent.closest('li');\n if (parentLi) {\n const maybe = parentLi.querySelector('ul.subpages');\n if (maybe) subUl = maybe;\n }\n }\n if (btn && subUl) {\n // collapsed by default\n btn.setAttribute('aria-expanded', 'false');\n subUl.classList.add('section-collapsed');\n subUl.classList.remove('section-list-expanded');\n btn.style.cursor = 'pointer';\n btn.addEventListener('click', e => {\n e.preventDefault();\n const expanded = btn.getAttribute('aria-expanded') === 'true';\n if (expanded) {\n btn.setAttribute('aria-expanded', 'false');\n subUl.classList.add('section-collapsed');\n subUl.classList.remove('section-list-expanded');\n } else {\n btn.setAttribute('aria-expanded', 'true');\n subUl.classList.remove('section-collapsed');\n subUl.classList.add('section-list-expanded');\n }\n });\n }\n });\n\n // Insert right after Welcome (Places first, then Users)\n if (insertAfter && insertAfter.parentElement === contentDiv) {\n insertAfter.insertAdjacentElement('afterend', sectionClone);\n insertAfter = sectionClone;\n } else {\n contentDiv.appendChild(sectionClone);\n }\n console.log(`[CrossInject] Injected \"${targetSectionText}\" after Welcome.`);\n });\n\n // After injecting both, auto-expand whichever matches current path\n function normalizeHref(href) {\n try {\n const url = new URL(href, window.location.origin);\n return url.pathname.replace(/\\/$/, '');\n } catch {\n return href.replace(/\\/$/, '');\n }\n }\n const normPath = window.location.pathname.replace(/\\/$/, '');\n // Clear any previous active marks:\n contentDiv.querySelectorAll('a[aria-current]').forEach(a => {\n a.removeAttribute('aria-current');\n a.classList.remove('active');\n });\n // Find matches among injected links:\n const allLinks = Array.from(contentDiv.querySelectorAll('a'));\n allLinks.forEach(a => {\n const href = a.getAttribute('href');\n if (!href) return;\n if (normalizeHref(href) === normPath) {\n // mark active\n a.setAttribute('aria-current', 'page');\n a.classList.add('active');\n // expand its parent section\n let sec = a.closest('section');\n if (sec) expandSection(sec);\n // expand ancestors\n let anc = a.parentElement;\n while (anc && anc !== contentDiv) {\n if (anc.tagName === 'UL' && anc.classList.contains('subpages')) {\n anc.classList.remove('section-collapsed');\n anc.classList.add('section-list-expanded');\n const parentLi = anc.closest('li');\n if (parentLi) {\n const btn = parentLi.querySelector('button[aria-expanded]');\n if (btn) btn.setAttribute('aria-expanded', 'true');\n }\n }\n if (anc.tagName === 'SECTION') {\n expandSection(anc);\n }\n anc = anc.parentElement;\n }\n }\n });\n // If none matched exactly, all remain collapsed.\n });\n })();\n }, 600);\n});","html_promo":"","html_body":"","html_footer":"\n\n\n\n\n\n\n
\n \n
Foursquare Developer Documentation \n
\n Explore our comprehensive technical documentation, tools and more to up your location game.\n
\n
\n
\n
\n\n \n
\n \n
\n
Products
\n
Explore our products \n
\n Learn more about our complete suite of developer products.\n
\n
\n
\n View All \n APIs \n SDKs \n \n
\n
\n \n
\n
\n
API
\n
Places API New! \n
\n Access global POI data and rich content via our new Places API endpoints.\n
\n
\n
\n\n \n
\n
\n
API
\n
Users API New! \n
\n Manage user accounts and authentication endpoints for Foursquare users.\n
\n
\n
\n\n\n \n \n
\n
\n
API
\n
Movement Geofence API \n
\n Enable Movement SDK user-configured geofences for specific venues, categories, and more.\n
\n
\n
\n\n \n
\n
\n
API
\n
Studio Data API \n
\n Create, manage, and modify geospatial assets used on Foursquare Studio. Integrate into\n your pipeline tasks for the bulk processing of geospatial data, allowing for the\n efficient flow of data into Studio.\n
\n
\n
\n\n \n
\n
\n
API
\n
Measurement API \n
\n Measurement API (MAPI) is a tool for accessing measurement data, powering everything\n from insights gathering to campaign optimization. MAPI combines unparalleled data\n granularity with a flexible syntax to put you in control of your report data.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Movement SDK \n
\n Create real-time, contextual mobile experiences, and bridge the gap between online\n interests and real-world behaviors.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Studio Data SDK \n
\n Supports automated, scalable management of maps and seamless integration with your work\n flows.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Map SDK \n
\n Control, embed and customize maps on your own webpage or in Jupyter Notebooks.\n
\n
\n
\n\n \n\n
\n
X\n
\n
API
\n
Places API - Deprecated \n
\n Access global POI data and rich content from 100K+ trusted sources via our API for\n real-time venue search, discovery, and ranking.\n
\n
\n
\n\n
\n
X\n
\n
API
\n
Personalization API - Deprecated \n
\n Leverage our global POI database alongside our personalization algorithms to provide a\n personalized search experience unique to a user’s specific tastes, visit history, review\n sentiment, and more.\n
\n
\n
\n
\n
\n\n \n\n
\n \n
\n
\n
Developer Tools
\n
API Explorer \n
\n View working code examples and make authenticated API requests with full responses. Try\n it out!\n
\n
\n \n \n \n \n Full sample responses without writing code\n \n \n \n \n \n Build your own requests and see responses in real-time\n \n \n \n \n \n Multiple code language support\n \n \n
\n
\n
\n
\n
\n
\n
\n\n
\n \n
\n
\n
\n
API Tools \n
\n View working web experiences leveraging our most popular API endpoints, including code,\n and step-by-step code walkthroughs of our most popular API use cases.\n
\n
\n
\n
\n
\n
SDK Tools \n
\n Take Foursquare technology for a test ride before you spend the time and effort to\n implement the code.\n
\n
\n
\n
\n
\n
Developer Support \n
\n Resources aimed at providing a dedicated experience where you can interact with other\n developers.\n
\n
\n
\n
\n
\n\n
\n \n
\n
Resources
\n
Get Started Guides \n
\n
\n
\n
Feature
\n
Get Started with the Places API \n
\n New to the Foursquare Places API? Not to worry, we've got you covered. In just a few\n simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
APIs
\n
Get Started with the Personalization APIs \n
\n New to the Foursquare Personalization APIs? Not to worry, we've got you covered. In just\n a few simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
Feature
\n
Get Started with Foursquare Studio \n
\n Using Foursquare Studio, you can create powerful geospatial visualizations that you can\n share with the world.\n
\n
\n Read more \n
\n
\n
\n
\n\n
\n \n
Unlock Your App's Full Potential with Foursquare Developer \n
\n Register now to get the monthly 10,000 monthly free Places Pro Calls and more.\n
\n
Sign up \n
\n
\n
\n \n
Foursquare Developer Documentation \n
\n Explore our comprehensive technical documentation, tools and more to up your location game.\n
\n
\n
\n
\n\n \n
\n \n
\n
Products
\n
Explore our products \n
\n Learn more about our complete suite of developer products.\n
\n
\n
\n View All \n APIs \n SDKs \n \n
\n
\n \n
\n
\n
API
\n
Places API New! \n
\n Access global POI data and rich content via our new Places API endpoints.\n
\n
\n
\n\n \n
\n
\n
API
\n
Users API New! \n
\n Manage user accounts and authentication endpoints for Foursquare users.\n
\n
\n
\n\n\n \n \n
\n
\n
API
\n
Movement Geofence API \n
\n Enable Movement SDK user-configured geofences for specific venues, categories, and more.\n
\n
\n
\n\n \n
\n
\n
API
\n
Studio Data API \n
\n Create, manage, and modify geospatial assets used on Foursquare Studio. Integrate into\n your pipeline tasks for the bulk processing of geospatial data, allowing for the\n efficient flow of data into Studio.\n
\n
\n
\n\n \n
\n
\n
API
\n
Measurement API \n
\n Measurement API (MAPI) is a tool for accessing measurement data, powering everything\n from insights gathering to campaign optimization. MAPI combines unparalleled data\n granularity with a flexible syntax to put you in control of your report data.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Movement SDK \n
\n Create real-time, contextual mobile experiences, and bridge the gap between online\n interests and real-world behaviors.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Studio Data SDK \n
\n Supports automated, scalable management of maps and seamless integration with your work\n flows.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Map SDK \n
\n Control, embed and customize maps on your own webpage or in Jupyter Notebooks.\n
\n
\n
\n\n \n\n
\n
X\n
\n
API
\n
Places API - Deprecated \n
\n Access global POI data and rich content from 100K+ trusted sources via our API for\n real-time venue search, discovery, and ranking.\n
\n
\n
\n\n
\n
X\n
\n
API
\n
Personalization API - Deprecated \n
\n Leverage our global POI database alongside our personalization algorithms to provide a\n personalized search experience unique to a user’s specific tastes, visit history, review\n sentiment, and more.\n
\n
\n
\n
\n
\n\n \n\n
\n \n
\n
\n
Developer Tools
\n
API Explorer \n
\n View working code examples and make authenticated API requests with full responses. Try\n it out!\n
\n
\n \n \n \n \n Full sample responses without writing code\n \n \n \n \n \n Build your own requests and see responses in real-time\n \n \n \n \n \n Multiple code language support\n \n \n
\n
\n
\n
\n
\n
\n
\n\n
\n \n
\n
\n
\n
API Tools \n
\n View working web experiences leveraging our most popular API endpoints, including code,\n and step-by-step code walkthroughs of our most popular API use cases.\n
\n
\n
\n
\n
\n
SDK Tools \n
\n Take Foursquare technology for a test ride before you spend the time and effort to\n implement the code.\n
\n
\n
\n
\n
\n
Developer Support \n
\n Resources aimed at providing a dedicated experience where you can interact with other\n developers.\n
\n
\n
\n
\n
\n\n
\n \n
\n
Resources
\n
Get Started Guides \n
\n
\n
\n
Feature
\n
Get Started with the Places API \n
\n New to the Foursquare Places API? Not to worry, we've got you covered. In just a few\n simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
APIs
\n
Get Started with the Personalization APIs \n
\n New to the Foursquare Personalization APIs? Not to worry, we've got you covered. In just\n a few simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
Feature
\n
Get Started with Foursquare Studio \n
\n Using Foursquare Studio, you can create powerful geospatial visualizations that you can\n share with the world.\n
\n
\n Read more \n
\n
\n
\n
\n\n
\n \n
Unlock Your App's Full Potential with Foursquare Developer \n
\n Register now to get the monthly 10,000 monthly free Places Pro Calls and more.\n
\n
Sign up \n
\n
\n
\n \n
Foursquare Product Documentation \n
\n Find help, follow step-by-step guides, technical documentation, and learn more about how to power your business forward with Foursquare Products.\n
\n
\n \n
\n \n
\n \n
\n
Products
\n
Explore our products \n
\n Learn more about our complete suite of geospatial technology products.\n
\n
\n \n
\n View All \n Analytics Products \n Campaign Products \n Data Products \n Developer \n \n
\n
\n
\n
\n
Analytics Products
\n
Studio \n
Next-generation geospatial analytics platform for working with big geospatial data.
\n
\n
\n
\n
\n
\n \n
\n
Campaign Products
\n
Targeting \n
Create and deploy audience segment, dervied from our rich repository of historical place visits.
\n
\n
\n
\n
\n
Campaign Products
\n
Attribution \n
Quantify the effectiveness of advertising campaigns at driving conversions across all channels.
\n
\n
\n
\n
\n
Data Products
\n
Places \n
Enrich your understanding of locations to help you drive business decisions or develop engaging user experiences.
\n
\n
\n
\n
\n
\n
\n
Data Products
\n
Placemaker Tools \n
Foursquare Placemakers are the guardians and curators of our Places dataset – playing a crucial role in shaping how people understand and interact with physical spaces in our digital world.
\n
\n
\n\n\n
\n
\n
Developer
\n
Places API New! \n
\n Access global POI data and rich content via our new Places API endpoints.\n
\n
\n
\n\n\n
\n
\n
Developer
\n
Users API New! \n
\n Manage user accounts and authentication endpoints for Foursquare users.\n
\n
\n
\n\n\n\n
\n
\n
Developer
\n
Movement Geofence API \n
\n Enable Movement SDK user-configured geofences for specific venues, categories, and more.\n
\n
\n
\n\n
\n
\n
Developer
\n
Studio Data API \n
\n Create, manage, and modify geospatial assets used on Foursquare Studio . Integrate into\n your pipeline tasks for the bulk processing of geospatial data, allowing for the\n efficient flow of data into Studio.\n
\n
\n
\n\n
\n
\n
Developer
\n
Measurement API \n
\n Measurement API (MAPI) is a tool for accessing measurement data, powering everything from insights gathering to campaign optimization. MAPI combines unparalleled data granularity with a flexible syntax to put you in control of your report data.\n
\n
\n
\n\n \n
\n
\n
Developer
\n
Movement SDK \n
\n Create real-time, contextual mobile experiences, and bridge the gap between online\n interests and real-world behaviors.\n
\n
\n
\n\n
\n
\n
Developer
\n
Studio Data SDK \n
\n Supports automated, scalable management of maps and seamless integration with your work\n flows.\n
\n
\n
\n \n
\n
\n
Developer
\n
Studio Map SDK \n
Control, embed and customize maps on your own webpage or in Jupyter Notebooks.
\n
\n
\n\n \n
\n
\n
Developer
\n
Places API - Deprecated \n
\n Access global POI data and rich content from 100K+ trusted sources via our API for\n real-time venue search, discovery, and ranking.\n
\n
\n
\n\n\n
\n
\n
Developer
\n
Personalization API - Deprecated \n
\n Leverage our global POI database alongside our personalization algorithms to provide a\n personalized search experience unique to a user’s specific tastes, visit history, review\n sentiment, and more.\n
\n
\n
\n\n
\n
\n
\n \n
\n
\n
Product Spotlight
\n
Placemaker Tools \n
\n Foursquare Placemakers are the guardians and curators of our Places dataset – playing a crucial role in shaping how people understand and interact with physical spaces in our digital world.\n
\n
\n \n \n \n Placemakers are the dedicated, passionate members of our global open source community who contribute to our shared understanding of places around the world.\n \n \n \n \n \n There are 10 levels in the Placemaker community. Each time you advance, you gain benefits and influence within the community, plus improve the quality of our places.\n \n \n \n \n \n Directly contribute to the accuracy of places for Swarm users and developers using our data to build rich, location-powered features.\n \n \n \n
\n
\n
\n
\n \n \n \n \n
\n
\n
\n
\n \n
\n
Resources
\n
Get Started Guides \n
\n
\n
\n
APIs
\n
Get Started with the Placemaker Tools \n
\n Placemakers are the most dedicated and passionate members of our community. They care deeply about maintaining the accuracy and quality of our data.\n
\n
\n Read more \n
\n
\n
\n
Feature
\n
Get Started with the Places API \n
\n New to the Foursquare Places API? Not to worry, we've got you covered. In just a few\n simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
Feature
\n
Get Started with Foursquare Studio \n
\n Using Foursquare Studio, you can create powerful geospatial visualizations that you can\n share with the world.\n
\n
\n Read more \n
\n
\n
\n
\n
\n \n
Get in touch with an expert \n
\n Interested in exploring how Foursquare can help drive your business forward? Let us show you.\n
\n
Request a Demo \n
\n
element\n\n // Create a new dropdown element\n var dropdown = document.createElement(\"div\");\n dropdown.classList.add(\"Dropdown\"); // You can define your CSS styles for the dropdown here\n\n // Create a button for the clickable dropdown\n var dropdownButton = document.createElement(\"button\");\n dropdownButton.classList.add(\"Dropdown-button\");\n\n // Get the section name based on the current URL\n var sectionName = getSectionName();\n\n // Set the dropdown button text\n dropdownButton.textContent = sectionName + \" ▾\";\n dropdown.appendChild(dropdownButton);\n\n // Create a list for the dropdown items\n var dropdownList = document.createElement(\"ul\");\n dropdownList.classList.add(\"Dropdown-list\"); // You can define your CSS styles for the dropdown list here\n\n // Define the items and their URLs\n var items = [\n { text: \"Data Products\", url: \"/data-products\" },\n { text: \"Campaign Products\", url: \"/campaign-products\" },\n { text: \"Analytics Products\", url: \"/analytics-products\" },\n { text: \"Developer\", url: \"/developer\" },\n ];\n\n // Filter out the active item from the list\n var activeSection = sectionName.toLowerCase();\n items = items.filter(function (item) {\n return item.text.toLowerCase() !== activeSection;\n });\n\n // Create list items and links for each item\n items.forEach(function (item) {\n var listItem = document.createElement(\"li\");\n var link = document.createElement(\"a\");\n link.setAttribute(\"href\", item.url);\n link.textContent = item.text;\n listItem.appendChild(link);\n dropdownList.appendChild(listItem);\n });\n\n // Append the dropdown list to the dropdown element\n dropdown.appendChild(dropdownList);\n\n // Insert the clickable dropdown at the very beginning of this element\n navElement.insertBefore(dropdown, navElement.firstChild);\n\n // Add a click event listener to toggle the visibility of the dropdown\n dropdownButton.addEventListener(\"click\", function () {\n dropdownList.classList.toggle(\"active\");\n });\n }\n });\n\n// Inject the styles into the document's head\nvar styleElement = document.createElement(\"style\");\nstyleElement.textContent = `\n/* Define CSS styles for the dropdown and its button */\n.rm-Header-bottom .Dropdown {position: relative;display: inline-block;z-index: 9999;}\n.rm-Header-bottom .Dropdown-button {background-color: transparent;cursor: pointer;font-weight: bold;font-size: 1em;color: #333;border: 1px solid #e8e8e8;padding: 6px 10px;border-radius: 8px;}\n.rm-Header-bottom .Dropdown-list {position: absolute;display: none;background-color: #fff;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);list-style: none;margin: 0;padding: 0;min-width: 125px;}\n.rm-Header-bottom ul.Dropdown-list {border-radius: 2px 2px 10px 10px;}\n.Dropdown-list li {padding: 3px 5px;text-align: left;}\n.Dropdown-button {cursor: pointer;}\n.Dropdown-list.active {display: block;}\n.Dropdown-list a {text-decoration: none;color: #333;display: block;padding: 7px;width: 145px;}\n.Dropdown-list a:hover {background-color: #f2f2f2;}\n.Header-leftADQdGVqx1wqU, .Header-bottom2eLKOFXMEmh5 {overflow: visible !important;}\n `;\n\n // Append the style element to the document's head\n document.head.appendChild(styleElement);\n }, 800); // delay\n}); \n// END - Custom Project Dropdown\n\n// START - Login Link\n$(window).on(\"pageLoad\", function (e, state) {\n const link = document.querySelector(\n \".rm-Header-top-link_login.Button_primary\"\n );\n\n if (link) {\n link.href = \"https://foursquare.com/developers/login\";\n }\n});\n// END - Login Link\n\n//-------------------------------------------------------\n\n// START - Logged in dev console link\nwindow.addEventListener(\"load\", function () {\n const header = document.querySelector(\".rm-Header-top-link_login\");\n const logoutWrapper = header.children[0];\n\n if (logoutWrapper === undefined) return;\n\n logoutWrapper.addEventListener(\"click\", function () {\n setTimeout(() => {\n const logoutDiv = document.querySelector(\n \".tippy-content > div > div > div\"\n );\n\n if (logoutDiv) {\n let logoutLink;\n if (window.hasDeveloperConsoleLink) {\n logoutLink = logoutDiv.children[1];\n } else {\n logoutLink = logoutDiv.children[0];\n }\n logoutLink.href = \"https://foursquare.com/developers/home\";\n logoutLink.target = \"_blank\";\n logoutLink.rel = \"noopener noreferrer\";\n logoutLink.textContent = \"Developer Console\";\n }\n }, \"25\");\n });\n});\n// END - Logged out dev console link\n\n//-------------------------------------------------------\n\n// START - Custom Search Popup\n$(window).on('pageLoad', function(e, state) {\n setTimeout(function() {\n const openSearchPopup = () => {\n const cmsSearchButton = document.querySelector('.rm-SearchToggle');\n if (cmsSearchButton) {\n cmsSearchButton.click();\n }\n };\n\n const triggerSearchButton = document.getElementsByClassName(\"landing-page-trigger-search-button\")[0];\n if (triggerSearchButton) {\n triggerSearchButton.addEventListener(\"click\", openSearchPopup);\n }\n }, 700);\n});\n\n\n\n// END - Custom Search Popup\n \n//-------------------------------------------------------\n\n// START - Tile Filters for Homepage\n// List of allowed URLs\nconst allowedUrls = [\n \"https://docs.foursquare.com/\",\n \"https://docs.foursquare.com/campaign-products\",\n \"https://docs.foursquare.com/data-products\",\n \"https://docs.foursquare.com/analytics-products\",\n \"https://docs.foursquare.com/developer\"\n];\n\n// Check if the current URL is in the allowed list\nif (allowedUrls.includes(window.location.href)) {\n \n // START - Tile Filters for Homepage\n document.addEventListener(\"DOMContentLoaded\", function () {\n let counter = 0; // Initialize counter variable\n\n const intervalId = setInterval(function () {\n console.log(\"Function loaded v2.0\");\n\n // Your filtering logic function\n function filterSections(event) {\n if (!event.target.classList.contains(\"filter-item\")) return;\n\n const filterValues = event.target.textContent.toLowerCase();\n let filterValue = filterValues.split(\" \")[0];\n console.log(filterValue);\n\n const filter = document.getElementById(\"tileFilter\");\n const sections = document.querySelectorAll(\".section-item\");\n\n // Remove active class from all filter items\n filter.querySelectorAll(\".filter-item\").forEach((li) => {\n li.classList.remove(\"active\");\n });\n\n // Add active class to clicked filter item\n event.target.classList.add(\"active\");\n\n sections.forEach((section) => {\n if (\n filterValue === \"all\" ||\n filterValue === \"view\" ||\n filterValue === \"view all\" ||\n section.classList.contains(filterValue)\n ) {\n section.style.display = \"block\";\n } else {\n section.style.display = \"none\";\n }\n });\n\n // Increment counter\n counter++;\n console.log(`Counter: ${counter}`);\n }\n\n // Attach the event listener directly to the filter element\n const filter = document.getElementById(\"tileFilter\");\n if (filter) {\n filter.addEventListener(\"click\", filterSections);\n\n // Clear interval after setting up the event listener to avoid multiple attachments\n clearInterval(intervalId);\n console.log(\"Event listener attached and interval cleared.\");\n }\n }, 1000);\n });\n // END - Tile Filters for Homepage\n}\n\n//-------------------------------------------------------\n\n// START - Change ALL code tabs on page if code type is selected\n$(window).on(\"pageLoad\", function (e, state) {\n document.querySelectorAll(\".CodeTabs-toolbar button\").forEach((item) => {\n item.addEventListener(\"click\", updateCodeTabs);\n });\n\n console.log(\"v7\");\n //$('#signindrop').appendTo('ul#header-nav-left > li');\n //$('#signindrop').appendTo(\".Header-leftADQdGVqx1wqU\");\n //$('#supportdrop').appendTo('ul#header-nav-right > li');\n});\n\nfunction updateCodeTabs(e) {\n if (e.isTrusted) {\n //console.log(\"Clicked\");\n //console.log(e);\n //const activeTabTitle = i.innerHTML;\n const activeTabTitle = e.srcElement.innerText;\n //console.log(\"Title:\", activeTabTitle);\n document.querySelectorAll(\".CodeTabs-toolbar button\").forEach((item) => {\n if (item.innerHTML == activeTabTitle) {\n item.click();\n }\n });\n }\n}\n// END - Change ALL code tabs on page if code type is selected\n\n//-------------------------------------------------------\n\n// START - TOC List highlighting\n$(window).on(\"pageLoad\", function (e, state) {\n var tocList = document.querySelector(\".toc-list li\");\n if (tocList !== null) {\n document.querySelector(\".toc-list li\").innerHTML =\n '';\n }\n $(\".toc-children > ul > li:first-child\").addClass(\"active\");\n\n const spyScrolling = () => {\n const sections = document.querySelectorAll(\".heading-anchor[id]\");\n\n window.onscroll = () => {\n const scrollPos =\n document.documentElement.scrollTop || document.body.scrollTop;\n\n for (let s in sections)\n if (\n sections.hasOwnProperty(s) &&\n sections[s].parentNode.offsetTop <= scrollPos\n ) {\n const id = sections[s].id;\n\n document\n .querySelector(\"ul.toc-list li.active\")\n .classList.remove(\"active\");\n document\n .querySelector(\n 'ul.toc-list li.toc-children ul li a[href=\"#' + id + '\"]'\n )\n .parentNode.classList.add(\"active\");\n }\n };\n };\n\n spyScrolling();\n});\n// END - TOC List highlighting\n\n//-------------------------------------------------------\n\n// START - Collapse Left Navigation\n$(window).on(\"pageLoad\", function (e, state) {\n function initializeSidebar() {\n // Collapse navigation in the sidebar initially\n $(\".rm-Sidebar-section > .rm-Sidebar-list\").addClass(\"section-collapsed\");\n $(\".rm-Sidebar-heading\").append(\"\n ${highlightedNameElement(value.text)}
\n ${value.text.secondary}
\n `;\n }\n\n async function selectItem({ target }) {\n if (target.tagName === \"BUTTON\") {\n const link = target.dataset.object;\n const addressDetail = await fetchAddressDetails(link);\n const { location = {} } = addressDetail;\n const {\n address = \"\",\n country = \"\",\n postcode = \"\",\n locality = \"\",\n region = \"\",\n } = location;\n addressInput.value = address;\n address2Input.value = \"\";\n countryInput.value = country;\n postcodeInput.value = postcode;\n cityInput.value = locality;\n regionInput.value = region;\n // generate new session token after a complete search\n sessionToken = generateRandomSessionToken();\n\n address2Input && address2Input.focus();\n dropDownField.style.display = \"none\";\n }\n }\n\n async function fetchAddressDetails(link) {\n try {\n const results = await fetch(`https://api.foursquare.com${link}`, {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n });\n const data = await results.json();\n return data;\n } catch (err) {\n logError(err);\n }\n }\n\n function highlightedNameElement(textObject) {\n if (!textObject) return \"\";\n const { primary, highlight } = textObject;\n if (highlight && highlight.length) {\n let beginning = 0;\n let hightligtedWords = \"\";\n for (let i = 0; i < highlight.length; i++) {\n const { start, length } = highlight[i];\n hightligtedWords += primary.substr(beginning, start - beginning);\n hightligtedWords += \"\" + primary.substr(start, length) + \" \";\n beginning = start + length;\n }\n hightligtedWords += primary.substr(beginning);\n return hightligtedWords;\n }\n return primary;\n }\n\n function debounce(func, timeout = 300) {\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n func.apply(this, args);\n }, timeout);\n };\n }\n }\n\n localAddressAutoFillJs();\n }\n if (state && state.params && state.params.slug === \"local-search-map\") {\n function loadLocalMapSearchJs() {\n mapboxgl.accessToken =\n \"pk.eyJ1IjoiZm91cnNxdWFyZSIsImEiOiJjbDNqNXdrN20wN3JtM2JvMWFqZGxoaGljIn0.uSxJ2t7E96TrBFsn3cXT_g\";\n const fsqAPIToken = \"fsq3bgqdcpLAJFkodk8gisc2F+NenA7gK/zI97A9nKQAXIw=\";\n let userLat = 40.7128;\n let userLng = -74.006;\n let sessionToken = generateRandomSessionToken();\n const inputField = document.getElementById(\"explorer-search\");\n const dropDownField = document.getElementById(\"explorer-dropdown\");\n const ulField = document.getElementById(\"explorer-suggestions\");\n const errorField = document.getElementById(\"explorer-error\");\n const notFoundField = document.getElementById(\"explorer-not-found\");\n\n const onChangeAutoComplete = debounce(changeAutoComplete);\n inputField.addEventListener(\"input\", onChangeAutoComplete);\n ulField.addEventListener(\"click\", selectItem);\n\n function success(pos) {\n const { latitude, longitude } = pos.coords;\n userLat = latitude;\n userLng = longitude;\n flyToLocation(userLat, userLng);\n }\n\n function logError(err) {\n console.warn(`ERROR(${err.code}): ${err.message}`);\n }\n\n navigator.geolocation.getCurrentPosition(success, logError, {\n enableHighAccuracy: true,\n timeout: 5000,\n maximumAge: 0,\n });\n\n const map = new mapboxgl.Map({\n container: \"map\",\n style: \"mapbox://styles/mapbox/light-v10\",\n center: [userLng, userLat],\n zoom: 12,\n });\n\n map.addControl(new mapboxgl.GeolocateControl());\n map.addControl(new mapboxgl.NavigationControl());\n\n let currentMarker;\n\n /* Generate a random string with 32 characters.\n Session Token is a user-generated token to identify a session for billing purposes.\n Learn more about session tokens.\n https://docs.foursquare.com/reference/session-tokens\n */\n function generateRandomSessionToken(length = 32) {\n let result = \"\";\n const characters = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\n for (let i = 0; i < length; i++) {\n result += characters[Math.floor(Math.random() * characters.length)];\n }\n return result;\n }\n\n let isFetching = false;\n async function changeAutoComplete({ target }) {\n const { value: inputSearch = \"\" } = target;\n ulField.innerHTML = \"\";\n notFoundField.style.display = \"none\";\n errorField.style.display = \"none\";\n if (inputSearch.length && !isFetching) {\n try {\n isFetching = true;\n const results = await autoComplete(inputSearch);\n if (results && results.length) {\n results.forEach((value) => {\n addItem(value);\n });\n } else {\n notFoundField.innerHTML = `Foursquare can't\n find ${inputSearch}. Make sure your search is spelled correctly.\n Don't see the place you're looking for? .`;\n notFoundField.style.display = \"block\";\n }\n } catch (err) {\n errorField.style.display = \"block\";\n logError(err);\n } finally {\n isFetching = false;\n dropDownField.style.display = \"block\";\n }\n } else {\n dropDownField.style.display = \"none\";\n }\n }\n\n async function autoComplete(query) {\n const { lng, lat } = map.getCenter();\n userLat = lat;\n userLng = lng;\n try {\n const searchParams = new URLSearchParams({\n query,\n types: \"place\",\n ll: `${userLat},${userLng}`,\n radius: 50000,\n session_token: sessionToken,\n }).toString();\n const searchResults = await fetch(\n `https://api.foursquare.com/v3/autocomplete?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await searchResults.json();\n return data.results;\n } catch (error) {\n throw error;\n }\n }\n\n function addItem(value) {\n const placeDetail = value[value.type];\n if (!placeDetail || !placeDetail.geocodes || !placeDetail.geocodes.main)\n return;\n const { latitude, longitude } = placeDetail.geocodes.main;\n const fsqId = placeDetail.fsq_id;\n const dataObject = JSON.stringify({ latitude, longitude, fsqId });\n ulField.innerHTML += `\n ${highlightedNameElement(value.text)}
\n ${value.text.secondary}
\n `;\n }\n\n async function selectItem({ target }) {\n if (target.tagName === \"LI\") {\n const valueObject = JSON.parse(target.dataset.object);\n const { latitude, longitude, fsqId } = valueObject;\n const placeDetail = await fetchPlacesDetails(fsqId);\n addMarkerAndPopup(latitude, longitude, placeDetail);\n flyToLocation(latitude, longitude);\n\n // generate new session token after a complete search\n sessionToken = generateRandomSessionToken();\n const name = target.dataset.name;\n inputField.value = target.children[0].textContent;\n dropDownField.style.display = \"none\";\n }\n }\n\n async function fetchPlacesDetails(fsqId) {\n try {\n const searchParams = new URLSearchParams({\n fields: \"fsq_id,name,geocodes,location,photos,rating\",\n session_token: sessionToken,\n }).toString();\n const results = await fetch(\n `https://api.foursquare.com/v3/places/${fsqId}?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await results.json();\n return data;\n } catch (err) {\n logError(err);\n }\n }\n\n function createPopup(placeDetail) {\n const { location = {}, name = \"\", photos = [], rating } = placeDetail;\n let photoUrl = \"https://files.readme.io/c163d6e-placeholder.svg\";\n if (photos.length && photos[0]) {\n photoUrl = `${photos[0].prefix}56${photos[0].suffix}`;\n }\n const popupHTML = ``;\n\n const markerHeight = 35;\n const markerRadius = 14;\n const linearOffset = 8;\n const verticalOffset = 8;\n const popupOffsets = {\n top: [0, verticalOffset],\n \"top-left\": [0, verticalOffset],\n \"top-right\": [0, verticalOffset],\n bottom: [0, -(markerHeight + verticalOffset)],\n \"bottom-left\": [\n 0,\n (markerHeight + verticalOffset - markerRadius + linearOffset) * -1,\n ],\n \"bottom-right\": [\n 0,\n (markerHeight + verticalOffset - markerRadius + linearOffset) * -1,\n ],\n left: [\n markerRadius + linearOffset,\n (markerHeight - markerRadius) * -1,\n ],\n right: [\n -(markerRadius + linearOffset),\n (markerHeight - markerRadius) * -1,\n ],\n };\n return new mapboxgl.Popup({\n offset: popupOffsets,\n closeButton: false,\n }).setHTML(popupHTML);\n }\n\n function addMarkerAndPopup(lat, lng, placeDetail) {\n if (currentMarker) currentMarker.remove();\n currentMarker = new mapboxgl.Marker({\n color: \"#3333FF\",\n })\n .setLngLat([lng, lat])\n .setPopup(createPopup(placeDetail))\n .addTo(map);\n\n currentMarker.togglePopup();\n }\n\n function flyToLocation(lat, lng) {\n map.flyTo({\n center: [lng, lat],\n });\n }\n\n function highlightedNameElement(textObject) {\n if (!textObject) return \"\";\n const { primary, highlight } = textObject;\n if (highlight && highlight.length) {\n let beginning = 0;\n let hightligtedWords = \"\";\n for (let i = 0; i < highlight.length; i++) {\n const { start, length } = highlight[i];\n hightligtedWords += primary.substr(beginning, start - beginning);\n hightligtedWords += \"\" + primary.substr(start, length) + \" \";\n beginning = start + length;\n }\n hightligtedWords += primary.substr(beginning);\n return hightligtedWords;\n }\n return primary;\n }\n\n function debounce(func, timeout = 300) {\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n func.apply(this, args);\n }, timeout);\n };\n }\n }\n\n loadLocalMapSearchJs();\n }\n});\n\n$(window).on(\"pageLoad\", function (e, state) {\n const openSearchPopup = () => {\n const headerSearch = document.getElementById(\"hub-search-results\");\n if (headerSearch) {\n headerSearch.classList.add(\"hub-search-results-active\");\n document\n .getElementsByClassName(\"Input Input_md SearchBox-InputUQZAW9QXMe-c\")[0]\n ?.focus();\n }\n };\n\n const triggerSearchButton = document.getElementsByClassName(\n \"landing-page-trigger-search-button\"\n )[0];\n if (triggerSearchButton) {\n triggerSearchButton.addEventListener(\"click\", openSearchPopup);\n }\n});\n\n// START: Add Segment Tracking to Try It button\n// TODO: Verify this runs on route changes, so button gets instrumented on every page\n$(window).on(\"load\", function (e, state) {\n var tryItBtn = document.querySelector(\".rm-TryIt\");\n\n // in case the button has not yet renedered\n if (tryItBtn === undefined) return;\n\n tryItBtn.addEventListener(\"click\", () => {\n console.log(\"Try It button Clicked (project)\");\n analytics.track(\"Try It button Clicked\");\n });\n});\n// END: Add Segment Tracking to Try It button\n\n\n\n// CUSTOM LAUNCH TOP NAV CODE - README \ndocument.addEventListener('DOMContentLoaded', () => {\n setTimeout(() => {\n document.querySelectorAll('.Header-leftADQdGVqx1wqU a[href]').forEach(a => {\n a.addEventListener('click', e => {\n e.preventDefault();\n window.location.href = a.href;\n });\n });\n }, 100);\n});\n\n// CUSTOM LAUNCH SIDEBAR CODE (FINAL project: inject Places first, then Users under Welcome)\n// Runs after a short delay to avoid flicker or unwanted auto-expansion.\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n // Delay entire injection by 1 second\n setTimeout(() => {\n (async function() {\n // Normalize path (strip trailing slash)\n const path = window.location.pathname.replace(/\\/$/, '');\n\n // Only act on the FINAL project paths\n if (!path.startsWith('/developer/reference/')) {\n return;\n }\n\n // Pages to pull from: Places API overview and Users API overview\n // **Places first**, then Users\n const toInject = [\n {\n otherPageUrl: '/fsq-developers-places/reference/places-api-overview',\n targetSectionText: 'Places API'\n },\n {\n otherPageUrl: '/fsq-developers-users/reference/users-api-overview',\n targetSectionText: 'Users API'\n }\n ];\n\n // If versioned (e.g. /v2023-05-01/ in URL), insert version segment into otherPageUrl\n const versionMatch = window.location.pathname.match(/\\/(v\\d{4}-\\d{2}-\\d{2})\\//);\n function applyVersion(url) {\n if (versionMatch) {\n const version = versionMatch[1];\n return url.replace('/reference/', `/${version}/reference/`);\n }\n return url;\n }\n\n // Fetch & cache a single section's HTML from another page\n async function fetchSectionHtml(otherPageUrl, targetSectionText) {\n const versionedUrl = applyVersion(otherPageUrl);\n const cacheKey = `crossSection:${versionedUrl}:${targetSectionText}`;\n const cached = sessionStorage.getItem(cacheKey);\n if (cached) {\n return cached;\n }\n try {\n const resp = await fetch(versionedUrl, { credentials: 'same-origin' });\n if (!resp.ok) {\n console.warn('[CrossInject] Fetch failed', resp.status, versionedUrl);\n return null;\n }\n const htmlText = await resp.text();\n // Parse to DOM\n const parser = new DOMParser();\n const doc = parser.parseFromString(htmlText, 'text/html');\n // Find the sidebar section\n const sidebarSelector = '.rm-Sidebar';\n const otherSidebar = doc.querySelector(sidebarSelector);\n if (!otherSidebar) {\n console.warn('[CrossInject] Sidebar not found for', versionedUrl);\n return null;\n }\n // Locate the whose includes targetSectionText\n let foundSection = null;\n otherSidebar.querySelectorAll('section').forEach(sec => {\n if (foundSection) return;\n const h2 = sec.querySelector('h2');\n if (h2 && h2.textContent.trim().includes(targetSectionText)) {\n foundSection = sec;\n }\n });\n if (!foundSection) {\n console.warn('[CrossInject] Section not found:', targetSectionText, 'in', versionedUrl);\n return null;\n }\n const sectionHtml = foundSection.outerHTML;\n try {\n sessionStorage.setItem(cacheKey, sectionHtml);\n } catch (_) {}\n return sectionHtml;\n } catch (err) {\n console.error('[CrossInject] Error fetching/parsing:', err);\n return null;\n }\n }\n\n // Wait until the current page's sidebar is present\n function whenSidebarReady(fn) {\n const interval = setInterval(() => {\n const sidebarNav = document.querySelector('.rm-Sidebar');\n if (sidebarNav) {\n clearInterval(interval);\n fn(sidebarNav);\n }\n }, 100);\n // Stop polling after 5s\n setTimeout(() => clearInterval(interval), 5000);\n }\n\n // Collapse helper for a section element\n function collapseSection(sec) {\n const h2 = sec.querySelector('h2');\n const ul = sec.querySelector('ul');\n if (h2) {\n h2.classList.remove('section-expanded');\n h2.classList.add('section-collapsed');\n h2.setAttribute('aria-expanded', 'false');\n }\n if (ul) {\n ul.classList.add('section-collapsed');\n ul.classList.remove('section-list-expanded');\n }\n }\n // Expand helper\n function expandSection(sec) {\n const h2 = sec.querySelector('h2');\n const ul = sec.querySelector('ul');\n if (h2) {\n h2.classList.remove('section-collapsed');\n h2.classList.add('section-expanded');\n h2.setAttribute('aria-expanded', 'true');\n }\n if (ul) {\n ul.classList.remove('section-collapsed');\n ul.classList.add('section-list-expanded');\n }\n }\n\n // Fetch all needed sections in parallel\n const results = await Promise.all(\n toInject.map(item =>\n fetchSectionHtml(item.otherPageUrl, item.targetSectionText)\n .then(html => ({ ...item, sectionHtml: html }))\n )\n );\n const validSections = results.filter(r => r.sectionHtml);\n if (validSections.length === 0) {\n return;\n }\n\n // Once our sidebar is ready, inject under \"Welcome\"\n whenSidebarReady(sidebarNav => {\n const contentDiv = sidebarNav.querySelector('.hub-sidebar-content');\n if (!contentDiv) {\n console.warn('[CrossInject] .hub-sidebar-content not found; abort insertion.');\n return;\n }\n\n // Find \"Welcome\" section\n const welcomeSection = Array.from(contentDiv.querySelectorAll('section')).find(sec => {\n const h2 = sec.querySelector('h2');\n return h2 && h2.textContent.trim() === 'Welcome';\n });\n let insertAfter = welcomeSection;\n\n validSections.forEach(({ targetSectionText, sectionHtml }) => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = sectionHtml;\n const originalSectionNode = wrapper.firstElementChild;\n if (!originalSectionNode) {\n console.warn('[CrossInject] No section node for', targetSectionText);\n return;\n }\n const sectionClone = originalSectionNode.cloneNode(true);\n\n // Adapt heading & toggle as needed:\n const injectedH2 = sectionClone.querySelector('h2');\n const injectedUL = sectionClone.querySelector('ul');\n if (injectedH2 && injectedUL) {\n // Copy classes from an existing template if present\n const templateH2 = sidebarNav.querySelector('.hub-sidebar-content section h2');\n if (templateH2) {\n injectedH2.className = templateH2.className;\n } else {\n injectedH2.classList.add('Sidebar-headingTRQyOa2pk0gh', 'rm-Sidebar-heading');\n }\n injectedH2.setAttribute('tabindex', '0');\n // Remove existing chevrons, clone from template or fallback\n Array.from(injectedH2.querySelectorAll('.icon-chevron')).forEach(el => el.remove());\n if (templateH2) {\n templateH2.querySelectorAll('.icon-chevron').forEach(iconSpan => {\n injectedH2.appendChild(iconSpan.cloneNode(true));\n });\n } else {\n const fallbackSpan = document.createElement('span');\n fallbackSpan.className = 'icon-chevron';\n injectedH2.appendChild(fallbackSpan);\n }\n // Initially collapsed\n collapseSection(sectionClone);\n\n // Toggle handler\n const toggleFn = () => {\n const isCollapsed = injectedUL.classList.contains('section-collapsed');\n if (isCollapsed) {\n expandSection(sectionClone);\n } else {\n collapseSection(sectionClone);\n }\n };\n injectedH2.style.cursor = 'pointer';\n injectedH2.addEventListener('click', toggleFn);\n injectedH2.addEventListener('keydown', e => {\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {\n e.preventDefault();\n toggleFn();\n }\n });\n }\n\n // Nested toggles\n sectionClone.querySelectorAll('a.Sidebar-link_parent').forEach(aParent => {\n let btn = aParent.querySelector('button');\n if (!btn && aParent.nextElementSibling && aParent.nextElementSibling.tagName === 'BUTTON') {\n btn = aParent.nextElementSibling;\n }\n let subUl = null;\n if (btn) {\n const maybeUl = btn.parentElement.nextElementSibling;\n if (maybeUl && maybeUl.classList.contains('subpages')) subUl = maybeUl;\n }\n if (!subUl) {\n const parentLi = aParent.closest('li');\n if (parentLi) {\n const maybe = parentLi.querySelector('ul.subpages');\n if (maybe) subUl = maybe;\n }\n }\n if (btn && subUl) {\n // collapsed by default\n btn.setAttribute('aria-expanded', 'false');\n subUl.classList.add('section-collapsed');\n subUl.classList.remove('section-list-expanded');\n btn.style.cursor = 'pointer';\n btn.addEventListener('click', e => {\n e.preventDefault();\n const expanded = btn.getAttribute('aria-expanded') === 'true';\n if (expanded) {\n btn.setAttribute('aria-expanded', 'false');\n subUl.classList.add('section-collapsed');\n subUl.classList.remove('section-list-expanded');\n } else {\n btn.setAttribute('aria-expanded', 'true');\n subUl.classList.remove('section-collapsed');\n subUl.classList.add('section-list-expanded');\n }\n });\n }\n });\n\n // Insert right after Welcome (Places first, then Users)\n if (insertAfter && insertAfter.parentElement === contentDiv) {\n insertAfter.insertAdjacentElement('afterend', sectionClone);\n insertAfter = sectionClone;\n } else {\n contentDiv.appendChild(sectionClone);\n }\n console.log(`[CrossInject] Injected \"${targetSectionText}\" after Welcome.`);\n });\n\n // After injecting both, auto-expand whichever matches current path\n function normalizeHref(href) {\n try {\n const url = new URL(href, window.location.origin);\n return url.pathname.replace(/\\/$/, '');\n } catch {\n return href.replace(/\\/$/, '');\n }\n }\n const normPath = window.location.pathname.replace(/\\/$/, '');\n // Clear any previous active marks:\n contentDiv.querySelectorAll('a[aria-current]').forEach(a => {\n a.removeAttribute('aria-current');\n a.classList.remove('active');\n });\n // Find matches among injected links:\n const allLinks = Array.from(contentDiv.querySelectorAll('a'));\n allLinks.forEach(a => {\n const href = a.getAttribute('href');\n if (!href) return;\n if (normalizeHref(href) === normPath) {\n // mark active\n a.setAttribute('aria-current', 'page');\n a.classList.add('active');\n // expand its parent section\n let sec = a.closest('section');\n if (sec) expandSection(sec);\n // expand ancestors\n let anc = a.parentElement;\n while (anc && anc !== contentDiv) {\n if (anc.tagName === 'UL' && anc.classList.contains('subpages')) {\n anc.classList.remove('section-collapsed');\n anc.classList.add('section-list-expanded');\n const parentLi = anc.closest('li');\n if (parentLi) {\n const btn = parentLi.querySelector('button[aria-expanded]');\n if (btn) btn.setAttribute('aria-expanded', 'true');\n }\n }\n if (anc.tagName === 'SECTION') {\n expandSection(anc);\n }\n anc = anc.parentElement;\n }\n }\n });\n // If none matched exactly, all remain collapsed.\n });\n })();\n }, 600);\n});","html_promo":"","html_body":"","html_footer":"\n\n\n\n\n\n\n
\n \n
Foursquare Developer Documentation \n
\n Explore our comprehensive technical documentation, tools and more to up your location game.\n
\n
\n
\n
\n\n \n
\n \n
\n
Products
\n
Explore our products \n
\n Learn more about our complete suite of developer products.\n
\n
\n
\n View All \n APIs \n SDKs \n \n
\n
\n \n
\n
\n
API
\n
Places API New! \n
\n Access global POI data and rich content via our new Places API endpoints.\n
\n
\n
\n\n \n
\n
\n
API
\n
Users API New! \n
\n Manage user accounts and authentication endpoints for Foursquare users.\n
\n
\n
\n\n\n \n \n
\n
\n
API
\n
Movement Geofence API \n
\n Enable Movement SDK user-configured geofences for specific venues, categories, and more.\n
\n
\n
\n\n \n
\n
\n
API
\n
Studio Data API \n
\n Create, manage, and modify geospatial assets used on Foursquare Studio. Integrate into\n your pipeline tasks for the bulk processing of geospatial data, allowing for the\n efficient flow of data into Studio.\n
\n
\n
\n\n \n
\n
\n
API
\n
Measurement API \n
\n Measurement API (MAPI) is a tool for accessing measurement data, powering everything\n from insights gathering to campaign optimization. MAPI combines unparalleled data\n granularity with a flexible syntax to put you in control of your report data.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Movement SDK \n
\n Create real-time, contextual mobile experiences, and bridge the gap between online\n interests and real-world behaviors.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Studio Data SDK \n
\n Supports automated, scalable management of maps and seamless integration with your work\n flows.\n
\n
\n
\n\n \n
\n
\n
SDK
\n
Map SDK \n
\n Control, embed and customize maps on your own webpage or in Jupyter Notebooks.\n
\n
\n
\n\n \n\n
\n
X\n
\n
API
\n
Places API - Deprecated \n
\n Access global POI data and rich content from 100K+ trusted sources via our API for\n real-time venue search, discovery, and ranking.\n
\n
\n
\n\n
\n
X\n
\n
API
\n
Personalization API - Deprecated \n
\n Leverage our global POI database alongside our personalization algorithms to provide a\n personalized search experience unique to a user’s specific tastes, visit history, review\n sentiment, and more.\n
\n
\n
\n
\n
\n\n \n\n
\n \n
\n
\n
Developer Tools
\n
API Explorer \n
\n View working code examples and make authenticated API requests with full responses. Try\n it out!\n
\n
\n \n \n \n \n Full sample responses without writing code\n \n \n \n \n \n Build your own requests and see responses in real-time\n \n \n \n \n \n Multiple code language support\n \n \n
\n
\n
\n
\n
\n
\n
\n\n
\n \n
\n
\n
\n
API Tools \n
\n View working web experiences leveraging our most popular API endpoints, including code,\n and step-by-step code walkthroughs of our most popular API use cases.\n
\n
\n
\n
\n
\n
SDK Tools \n
\n Take Foursquare technology for a test ride before you spend the time and effort to\n implement the code.\n
\n
\n
\n
\n
\n
Developer Support \n
\n Resources aimed at providing a dedicated experience where you can interact with other\n developers.\n
\n
\n
\n
\n
\n\n
\n \n
\n
Resources
\n
Get Started Guides \n
\n
\n
\n
Feature
\n
Get Started with the Places API \n
\n New to the Foursquare Places API? Not to worry, we've got you covered. In just a few\n simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
APIs
\n
Get Started with the Personalization APIs \n
\n New to the Foursquare Personalization APIs? Not to worry, we've got you covered. In just\n a few simple steps, you'll be up and running with your first API call in no time!\n
\n
\n Read more \n
\n
\n
\n
Feature
\n
Get Started with Foursquare Studio \n
\n Using Foursquare Studio, you can create powerful geospatial visualizations that you can\n share with the world.\n
\n
\n Read more \n
\n
\n
\n
\n\n
\n \n
Unlock Your App's Full Potential with Foursquare Developer \n
\n Register now to get the monthly 10,000 monthly free Places Pro Calls and more.\n
\n
Sign up \n
\n
element\n\n // Create a new dropdown element\n var dropdown = document.createElement(\"div\");\n dropdown.classList.add(\"Dropdown\"); // You can define your CSS styles for the dropdown here\n\n // Create a button for the clickable dropdown\n var dropdownButton = document.createElement(\"button\");\n dropdownButton.classList.add(\"Dropdown-button\");\n\n // Get the section name based on the current URL\n var sectionName = getSectionName();\n\n // Set the dropdown button text\n dropdownButton.textContent = sectionName + \" ▾\";\n dropdown.appendChild(dropdownButton);\n\n // Create a list for the dropdown items\n var dropdownList = document.createElement(\"ul\");\n dropdownList.classList.add(\"Dropdown-list\"); // You can define your CSS styles for the dropdown list here\n\n // Define the items and their URLs\n var items = [\n { text: \"Data Products\", url: \"/data-products\" },\n { text: \"Campaign Products\", url: \"/campaign-products\" },\n { text: \"Analytics Products\", url: \"/analytics-products\" },\n { text: \"Developer\", url: \"/developer\" },\n ];\n\n // Filter out the active item from the list\n var activeSection = sectionName.toLowerCase();\n items = items.filter(function (item) {\n return item.text.toLowerCase() !== activeSection;\n });\n\n // Create list items and links for each item\n items.forEach(function (item) {\n var listItem = document.createElement(\"li\");\n var link = document.createElement(\"a\");\n link.setAttribute(\"href\", item.url);\n link.textContent = item.text;\n listItem.appendChild(link);\n dropdownList.appendChild(listItem);\n });\n\n // Append the dropdown list to the dropdown element\n dropdown.appendChild(dropdownList);\n\n // Insert the clickable dropdown at the very beginning of this element\n navElement.insertBefore(dropdown, navElement.firstChild);\n\n // Add a click event listener to toggle the visibility of the dropdown\n dropdownButton.addEventListener(\"click\", function () {\n dropdownList.classList.toggle(\"active\");\n });\n }\n });\n\n// Inject the styles into the document's head\nvar styleElement = document.createElement(\"style\");\nstyleElement.textContent = `\n/* Define CSS styles for the dropdown and its button */\n.rm-Header-bottom .Dropdown {position: relative;display: inline-block;z-index: 9999;}\n.rm-Header-bottom .Dropdown-button {background-color: transparent;cursor: pointer;font-weight: bold;font-size: 1em;color: #333;border: 1px solid #e8e8e8;padding: 6px 10px;border-radius: 8px;}\n.rm-Header-bottom .Dropdown-list {position: absolute;display: none;background-color: #fff;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);list-style: none;margin: 0;padding: 0;min-width: 125px;}\n.rm-Header-bottom ul.Dropdown-list {border-radius: 2px 2px 10px 10px;}\n.Dropdown-list li {padding: 3px 5px;text-align: left;}\n.Dropdown-button {cursor: pointer;}\n.Dropdown-list.active {display: block;}\n.Dropdown-list a {text-decoration: none;color: #333;display: block;padding: 7px;width: 145px;}\n.Dropdown-list a:hover {background-color: #f2f2f2;}\n.Header-leftADQdGVqx1wqU, .Header-bottom2eLKOFXMEmh5 {overflow: visible !important;}\n `;\n\n // Append the style element to the document's head\n document.head.appendChild(styleElement);\n }, 800); // delay\n}); \n// END - Custom Project Dropdown\n\n// START - Login Link\n$(window).on(\"pageLoad\", function (e, state) {\n const link = document.querySelector(\n \".rm-Header-top-link_login.Button_primary\"\n );\n\n if (link) {\n link.href = \"https://foursquare.com/developers/login\";\n }\n});\n// END - Login Link\n\n//-------------------------------------------------------\n\n// START - Logged in dev console link\nwindow.addEventListener(\"load\", function () {\n const header = document.querySelector(\".rm-Header-top-link_login\");\n const logoutWrapper = header.children[0];\n\n if (logoutWrapper === undefined) return;\n\n logoutWrapper.addEventListener(\"click\", function () {\n setTimeout(() => {\n const logoutDiv = document.querySelector(\n \".tippy-content > div > div > div\"\n );\n\n if (logoutDiv) {\n let logoutLink;\n if (window.hasDeveloperConsoleLink) {\n logoutLink = logoutDiv.children[1];\n } else {\n logoutLink = logoutDiv.children[0];\n }\n logoutLink.href = \"https://foursquare.com/developers/home\";\n logoutLink.target = \"_blank\";\n logoutLink.rel = \"noopener noreferrer\";\n logoutLink.textContent = \"Developer Console\";\n }\n }, \"25\");\n });\n});\n// END - Logged out dev console link\n\n//-------------------------------------------------------\n\n// START - Custom Search Popup\n$(window).on('pageLoad', function(e, state) {\n setTimeout(function() {\n const openSearchPopup = () => {\n const cmsSearchButton = document.querySelector('.rm-SearchToggle');\n if (cmsSearchButton) {\n cmsSearchButton.click();\n }\n };\n\n const triggerSearchButton = document.getElementsByClassName(\"landing-page-trigger-search-button\")[0];\n if (triggerSearchButton) {\n triggerSearchButton.addEventListener(\"click\", openSearchPopup);\n }\n }, 700);\n});\n\n\n\n// END - Custom Search Popup\n \n//-------------------------------------------------------\n\n// START - Tile Filters for Homepage\n// List of allowed URLs\nconst allowedUrls = [\n \"https://docs.foursquare.com/\",\n \"https://docs.foursquare.com/campaign-products\",\n \"https://docs.foursquare.com/data-products\",\n \"https://docs.foursquare.com/analytics-products\",\n \"https://docs.foursquare.com/developer\"\n];\n\n// Check if the current URL is in the allowed list\nif (allowedUrls.includes(window.location.href)) {\n \n // START - Tile Filters for Homepage\n document.addEventListener(\"DOMContentLoaded\", function () {\n let counter = 0; // Initialize counter variable\n\n const intervalId = setInterval(function () {\n console.log(\"Function loaded v2.0\");\n\n // Your filtering logic function\n function filterSections(event) {\n if (!event.target.classList.contains(\"filter-item\")) return;\n\n const filterValues = event.target.textContent.toLowerCase();\n let filterValue = filterValues.split(\" \")[0];\n console.log(filterValue);\n\n const filter = document.getElementById(\"tileFilter\");\n const sections = document.querySelectorAll(\".section-item\");\n\n // Remove active class from all filter items\n filter.querySelectorAll(\".filter-item\").forEach((li) => {\n li.classList.remove(\"active\");\n });\n\n // Add active class to clicked filter item\n event.target.classList.add(\"active\");\n\n sections.forEach((section) => {\n if (\n filterValue === \"all\" ||\n filterValue === \"view\" ||\n filterValue === \"view all\" ||\n section.classList.contains(filterValue)\n ) {\n section.style.display = \"block\";\n } else {\n section.style.display = \"none\";\n }\n });\n\n // Increment counter\n counter++;\n console.log(`Counter: ${counter}`);\n }\n\n // Attach the event listener directly to the filter element\n const filter = document.getElementById(\"tileFilter\");\n if (filter) {\n filter.addEventListener(\"click\", filterSections);\n\n // Clear interval after setting up the event listener to avoid multiple attachments\n clearInterval(intervalId);\n console.log(\"Event listener attached and interval cleared.\");\n }\n }, 1000);\n });\n // END - Tile Filters for Homepage\n}\n\n//-------------------------------------------------------\n\n// START - Change ALL code tabs on page if code type is selected\n$(window).on(\"pageLoad\", function (e, state) {\n document.querySelectorAll(\".CodeTabs-toolbar button\").forEach((item) => {\n item.addEventListener(\"click\", updateCodeTabs);\n });\n\n console.log(\"v7\");\n //$('#signindrop').appendTo('ul#header-nav-left > li');\n //$('#signindrop').appendTo(\".Header-leftADQdGVqx1wqU\");\n //$('#supportdrop').appendTo('ul#header-nav-right > li');\n});\n\nfunction updateCodeTabs(e) {\n if (e.isTrusted) {\n //console.log(\"Clicked\");\n //console.log(e);\n //const activeTabTitle = i.innerHTML;\n const activeTabTitle = e.srcElement.innerText;\n //console.log(\"Title:\", activeTabTitle);\n document.querySelectorAll(\".CodeTabs-toolbar button\").forEach((item) => {\n if (item.innerHTML == activeTabTitle) {\n item.click();\n }\n });\n }\n}\n// END - Change ALL code tabs on page if code type is selected\n\n//-------------------------------------------------------\n\n// START - TOC List highlighting\n$(window).on(\"pageLoad\", function (e, state) {\n var tocList = document.querySelector(\".toc-list li\");\n if (tocList !== null) {\n document.querySelector(\".toc-list li\").innerHTML =\n '';\n }\n $(\".toc-children > ul > li:first-child\").addClass(\"active\");\n\n const spyScrolling = () => {\n const sections = document.querySelectorAll(\".heading-anchor[id]\");\n\n window.onscroll = () => {\n const scrollPos =\n document.documentElement.scrollTop || document.body.scrollTop;\n\n for (let s in sections)\n if (\n sections.hasOwnProperty(s) &&\n sections[s].parentNode.offsetTop <= scrollPos\n ) {\n const id = sections[s].id;\n\n document\n .querySelector(\"ul.toc-list li.active\")\n .classList.remove(\"active\");\n document\n .querySelector(\n 'ul.toc-list li.toc-children ul li a[href=\"#' + id + '\"]'\n )\n .parentNode.classList.add(\"active\");\n }\n };\n };\n\n spyScrolling();\n});\n// END - TOC List highlighting\n\n//-------------------------------------------------------\n\n// START - Collapse Left Navigation\n$(window).on(\"pageLoad\", function (e, state) {\n function initializeSidebar() {\n // Collapse navigation in the sidebar initially\n $(\".rm-Sidebar-section > .rm-Sidebar-list\").addClass(\"section-collapsed\");\n $(\".rm-Sidebar-heading\").append(\"\n ${highlightedNameElement(value.text)}
\n ${value.text.secondary}
\n `;\n }\n\n async function selectItem({ target }) {\n if (target.tagName === \"BUTTON\") {\n const link = target.dataset.object;\n const addressDetail = await fetchAddressDetails(link);\n const { location = {} } = addressDetail;\n const {\n address = \"\",\n country = \"\",\n postcode = \"\",\n locality = \"\",\n region = \"\",\n } = location;\n addressInput.value = address;\n address2Input.value = \"\";\n countryInput.value = country;\n postcodeInput.value = postcode;\n cityInput.value = locality;\n regionInput.value = region;\n // generate new session token after a complete search\n sessionToken = generateRandomSessionToken();\n\n address2Input && address2Input.focus();\n dropDownField.style.display = \"none\";\n }\n }\n\n async function fetchAddressDetails(link) {\n try {\n const results = await fetch(`https://api.foursquare.com${link}`, {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n });\n const data = await results.json();\n return data;\n } catch (err) {\n logError(err);\n }\n }\n\n function highlightedNameElement(textObject) {\n if (!textObject) return \"\";\n const { primary, highlight } = textObject;\n if (highlight && highlight.length) {\n let beginning = 0;\n let hightligtedWords = \"\";\n for (let i = 0; i < highlight.length; i++) {\n const { start, length } = highlight[i];\n hightligtedWords += primary.substr(beginning, start - beginning);\n hightligtedWords += \"\" + primary.substr(start, length) + \" \";\n beginning = start + length;\n }\n hightligtedWords += primary.substr(beginning);\n return hightligtedWords;\n }\n return primary;\n }\n\n function debounce(func, timeout = 300) {\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n func.apply(this, args);\n }, timeout);\n };\n }\n }\n\n localAddressAutoFillJs();\n }\n if (state && state.params && state.params.slug === \"local-search-map\") {\n function loadLocalMapSearchJs() {\n mapboxgl.accessToken =\n \"pk.eyJ1IjoiZm91cnNxdWFyZSIsImEiOiJjbDNqNXdrN20wN3JtM2JvMWFqZGxoaGljIn0.uSxJ2t7E96TrBFsn3cXT_g\";\n const fsqAPIToken = \"fsq3bgqdcpLAJFkodk8gisc2F+NenA7gK/zI97A9nKQAXIw=\";\n let userLat = 40.7128;\n let userLng = -74.006;\n let sessionToken = generateRandomSessionToken();\n const inputField = document.getElementById(\"explorer-search\");\n const dropDownField = document.getElementById(\"explorer-dropdown\");\n const ulField = document.getElementById(\"explorer-suggestions\");\n const errorField = document.getElementById(\"explorer-error\");\n const notFoundField = document.getElementById(\"explorer-not-found\");\n\n const onChangeAutoComplete = debounce(changeAutoComplete);\n inputField.addEventListener(\"input\", onChangeAutoComplete);\n ulField.addEventListener(\"click\", selectItem);\n\n function success(pos) {\n const { latitude, longitude } = pos.coords;\n userLat = latitude;\n userLng = longitude;\n flyToLocation(userLat, userLng);\n }\n\n function logError(err) {\n console.warn(`ERROR(${err.code}): ${err.message}`);\n }\n\n navigator.geolocation.getCurrentPosition(success, logError, {\n enableHighAccuracy: true,\n timeout: 5000,\n maximumAge: 0,\n });\n\n const map = new mapboxgl.Map({\n container: \"map\",\n style: \"mapbox://styles/mapbox/light-v10\",\n center: [userLng, userLat],\n zoom: 12,\n });\n\n map.addControl(new mapboxgl.GeolocateControl());\n map.addControl(new mapboxgl.NavigationControl());\n\n let currentMarker;\n\n /* Generate a random string with 32 characters.\n Session Token is a user-generated token to identify a session for billing purposes.\n Learn more about session tokens.\n https://docs.foursquare.com/reference/session-tokens\n */\n function generateRandomSessionToken(length = 32) {\n let result = \"\";\n const characters = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\n for (let i = 0; i < length; i++) {\n result += characters[Math.floor(Math.random() * characters.length)];\n }\n return result;\n }\n\n let isFetching = false;\n async function changeAutoComplete({ target }) {\n const { value: inputSearch = \"\" } = target;\n ulField.innerHTML = \"\";\n notFoundField.style.display = \"none\";\n errorField.style.display = \"none\";\n if (inputSearch.length && !isFetching) {\n try {\n isFetching = true;\n const results = await autoComplete(inputSearch);\n if (results && results.length) {\n results.forEach((value) => {\n addItem(value);\n });\n } else {\n notFoundField.innerHTML = `Foursquare can't\n find ${inputSearch}. Make sure your search is spelled correctly.\n Don't see the place you're looking for? .`;\n notFoundField.style.display = \"block\";\n }\n } catch (err) {\n errorField.style.display = \"block\";\n logError(err);\n } finally {\n isFetching = false;\n dropDownField.style.display = \"block\";\n }\n } else {\n dropDownField.style.display = \"none\";\n }\n }\n\n async function autoComplete(query) {\n const { lng, lat } = map.getCenter();\n userLat = lat;\n userLng = lng;\n try {\n const searchParams = new URLSearchParams({\n query,\n types: \"place\",\n ll: `${userLat},${userLng}`,\n radius: 50000,\n session_token: sessionToken,\n }).toString();\n const searchResults = await fetch(\n `https://api.foursquare.com/v3/autocomplete?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await searchResults.json();\n return data.results;\n } catch (error) {\n throw error;\n }\n }\n\n function addItem(value) {\n const placeDetail = value[value.type];\n if (!placeDetail || !placeDetail.geocodes || !placeDetail.geocodes.main)\n return;\n const { latitude, longitude } = placeDetail.geocodes.main;\n const fsqId = placeDetail.fsq_id;\n const dataObject = JSON.stringify({ latitude, longitude, fsqId });\n ulField.innerHTML += `\n ${highlightedNameElement(value.text)}
\n ${value.text.secondary}
\n `;\n }\n\n async function selectItem({ target }) {\n if (target.tagName === \"LI\") {\n const valueObject = JSON.parse(target.dataset.object);\n const { latitude, longitude, fsqId } = valueObject;\n const placeDetail = await fetchPlacesDetails(fsqId);\n addMarkerAndPopup(latitude, longitude, placeDetail);\n flyToLocation(latitude, longitude);\n\n // generate new session token after a complete search\n sessionToken = generateRandomSessionToken();\n const name = target.dataset.name;\n inputField.value = target.children[0].textContent;\n dropDownField.style.display = \"none\";\n }\n }\n\n async function fetchPlacesDetails(fsqId) {\n try {\n const searchParams = new URLSearchParams({\n fields: \"fsq_id,name,geocodes,location,photos,rating\",\n session_token: sessionToken,\n }).toString();\n const results = await fetch(\n `https://api.foursquare.com/v3/places/${fsqId}?${searchParams}`,\n {\n method: \"get\",\n headers: new Headers({\n Accept: \"application/json\",\n Authorization: fsqAPIToken,\n }),\n }\n );\n const data = await results.json();\n return data;\n } catch (err) {\n logError(err);\n }\n }\n\n function createPopup(placeDetail) {\n const { location = {}, name = \"\", photos = [], rating } = placeDetail;\n let photoUrl = \"https://files.readme.io/c163d6e-placeholder.svg\";\n if (photos.length && photos[0]) {\n photoUrl = `${photos[0].prefix}56${photos[0].suffix}`;\n }\n const popupHTML = ``;\n\n const markerHeight = 35;\n const markerRadius = 14;\n const linearOffset = 8;\n const verticalOffset = 8;\n const popupOffsets = {\n top: [0, verticalOffset],\n \"top-left\": [0, verticalOffset],\n \"top-right\": [0, verticalOffset],\n bottom: [0, -(markerHeight + verticalOffset)],\n \"bottom-left\": [\n 0,\n (markerHeight + verticalOffset - markerRadius + linearOffset) * -1,\n ],\n \"bottom-right\": [\n 0,\n (markerHeight + verticalOffset - markerRadius + linearOffset) * -1,\n ],\n left: [\n markerRadius + linearOffset,\n (markerHeight - markerRadius) * -1,\n ],\n right: [\n -(markerRadius + linearOffset),\n (markerHeight - markerRadius) * -1,\n ],\n };\n return new mapboxgl.Popup({\n offset: popupOffsets,\n closeButton: false,\n }).setHTML(popupHTML);\n }\n\n function addMarkerAndPopup(lat, lng, placeDetail) {\n if (currentMarker) currentMarker.remove();\n currentMarker = new mapboxgl.Marker({\n color: \"#3333FF\",\n })\n .setLngLat([lng, lat])\n .setPopup(createPopup(placeDetail))\n .addTo(map);\n\n currentMarker.togglePopup();\n }\n\n function flyToLocation(lat, lng) {\n map.flyTo({\n center: [lng, lat],\n });\n }\n\n function highlightedNameElement(textObject) {\n if (!textObject) return \"\";\n const { primary, highlight } = textObject;\n if (highlight && highlight.length) {\n let beginning = 0;\n let hightligtedWords = \"\";\n for (let i = 0; i < highlight.length; i++) {\n const { start, length } = highlight[i];\n hightligtedWords += primary.substr(beginning, start - beginning);\n hightligtedWords += \"\" + primary.substr(start, length) + \" \";\n beginning = start + length;\n }\n hightligtedWords += primary.substr(beginning);\n return hightligtedWords;\n }\n return primary;\n }\n\n function debounce(func, timeout = 300) {\n let timer;\n return (...args) => {\n clearTimeout(timer);\n timer = setTimeout(() => {\n func.apply(this, args);\n }, timeout);\n };\n }\n }\n\n loadLocalMapSearchJs();\n }\n});\n\n$(window).on(\"pageLoad\", function (e, state) {\n const openSearchPopup = () => {\n const headerSearch = document.getElementById(\"hub-search-results\");\n if (headerSearch) {\n headerSearch.classList.add(\"hub-search-results-active\");\n document\n .getElementsByClassName(\"Input Input_md SearchBox-InputUQZAW9QXMe-c\")[0]\n ?.focus();\n }\n };\n\n const triggerSearchButton = document.getElementsByClassName(\n \"landing-page-trigger-search-button\"\n )[0];\n if (triggerSearchButton) {\n triggerSearchButton.addEventListener(\"click\", openSearchPopup);\n }\n});\n\n// START: Add Segment Tracking to Try It button\n// TODO: Verify this runs on route changes, so button gets instrumented on every page\n$(window).on(\"load\", function (e, state) {\n var tryItBtn = document.querySelector(\".rm-TryIt\");\n\n // in case the button has not yet renedered\n if (tryItBtn === undefined) return;\n\n tryItBtn.addEventListener(\"click\", () => {\n console.log(\"Try It button Clicked (project)\");\n analytics.track(\"Try It button Clicked\");\n });\n});\n// END: Add Segment Tracking to Try It button\n\n\n\n// CUSTOM LAUNCH TOP NAV CODE - README \ndocument.addEventListener('DOMContentLoaded', () => {\n setTimeout(() => {\n document.querySelectorAll('.Header-leftADQdGVqx1wqU a[href]').forEach(a => {\n a.addEventListener('click', e => {\n e.preventDefault();\n window.location.href = a.href;\n });\n });\n }, 100);\n});\n\n// CUSTOM LAUNCH SIDEBAR CODE (FINAL project: inject Places first, then Users under Welcome)\n// Runs after a short delay to avoid flicker or unwanted auto-expansion.\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n // Delay entire injection by 1 second\n setTimeout(() => {\n (async function() {\n // Normalize path (strip trailing slash)\n const path = window.location.pathname.replace(/\\/$/, '');\n\n // Only act on the FINAL project paths\n if (!path.startsWith('/developer/reference/')) {\n return;\n }\n\n // Pages to pull from: Places API overview and Users API overview\n // **Places first**, then Users\n const toInject = [\n {\n otherPageUrl: '/fsq-developers-places/reference/places-api-overview',\n targetSectionText: 'Places API'\n },\n {\n otherPageUrl: '/fsq-developers-users/reference/users-api-overview',\n targetSectionText: 'Users API'\n }\n ];\n\n // If versioned (e.g. /v2023-05-01/ in URL), insert version segment into otherPageUrl\n const versionMatch = window.location.pathname.match(/\\/(v\\d{4}-\\d{2}-\\d{2})\\//);\n function applyVersion(url) {\n if (versionMatch) {\n const version = versionMatch[1];\n return url.replace('/reference/', `/${version}/reference/`);\n }\n return url;\n }\n\n // Fetch & cache a single section's HTML from another page\n async function fetchSectionHtml(otherPageUrl, targetSectionText) {\n const versionedUrl = applyVersion(otherPageUrl);\n const cacheKey = `crossSection:${versionedUrl}:${targetSectionText}`;\n const cached = sessionStorage.getItem(cacheKey);\n if (cached) {\n return cached;\n }\n try {\n const resp = await fetch(versionedUrl, { credentials: 'same-origin' });\n if (!resp.ok) {\n console.warn('[CrossInject] Fetch failed', resp.status, versionedUrl);\n return null;\n }\n const htmlText = await resp.text();\n // Parse to DOM\n const parser = new DOMParser();\n const doc = parser.parseFromString(htmlText, 'text/html');\n // Find the sidebar section\n const sidebarSelector = '.rm-Sidebar';\n const otherSidebar = doc.querySelector(sidebarSelector);\n if (!otherSidebar) {\n console.warn('[CrossInject] Sidebar not found for', versionedUrl);\n return null;\n }\n // Locate the whose includes targetSectionText\n let foundSection = null;\n otherSidebar.querySelectorAll('section').forEach(sec => {\n if (foundSection) return;\n const h2 = sec.querySelector('h2');\n if (h2 && h2.textContent.trim().includes(targetSectionText)) {\n foundSection = sec;\n }\n });\n if (!foundSection) {\n console.warn('[CrossInject] Section not found:', targetSectionText, 'in', versionedUrl);\n return null;\n }\n const sectionHtml = foundSection.outerHTML;\n try {\n sessionStorage.setItem(cacheKey, sectionHtml);\n } catch (_) {}\n return sectionHtml;\n } catch (err) {\n console.error('[CrossInject] Error fetching/parsing:', err);\n return null;\n }\n }\n\n // Wait until the current page's sidebar is present\n function whenSidebarReady(fn) {\n const interval = setInterval(() => {\n const sidebarNav = document.querySelector('.rm-Sidebar');\n if (sidebarNav) {\n clearInterval(interval);\n fn(sidebarNav);\n }\n }, 100);\n // Stop polling after 5s\n setTimeout(() => clearInterval(interval), 5000);\n }\n\n // Collapse helper for a section element\n function collapseSection(sec) {\n const h2 = sec.querySelector('h2');\n const ul = sec.querySelector('ul');\n if (h2) {\n h2.classList.remove('section-expanded');\n h2.classList.add('section-collapsed');\n h2.setAttribute('aria-expanded', 'false');\n }\n if (ul) {\n ul.classList.add('section-collapsed');\n ul.classList.remove('section-list-expanded');\n }\n }\n // Expand helper\n function expandSection(sec) {\n const h2 = sec.querySelector('h2');\n const ul = sec.querySelector('ul');\n if (h2) {\n h2.classList.remove('section-collapsed');\n h2.classList.add('section-expanded');\n h2.setAttribute('aria-expanded', 'true');\n }\n if (ul) {\n ul.classList.remove('section-collapsed');\n ul.classList.add('section-list-expanded');\n }\n }\n\n // Fetch all needed sections in parallel\n const results = await Promise.all(\n toInject.map(item =>\n fetchSectionHtml(item.otherPageUrl, item.targetSectionText)\n .then(html => ({ ...item, sectionHtml: html }))\n )\n );\n const validSections = results.filter(r => r.sectionHtml);\n if (validSections.length === 0) {\n return;\n }\n\n // Once our sidebar is ready, inject under \"Welcome\"\n whenSidebarReady(sidebarNav => {\n const contentDiv = sidebarNav.querySelector('.hub-sidebar-content');\n if (!contentDiv) {\n console.warn('[CrossInject] .hub-sidebar-content not found; abort insertion.');\n return;\n }\n\n // Find \"Welcome\" section\n const welcomeSection = Array.from(contentDiv.querySelectorAll('section')).find(sec => {\n const h2 = sec.querySelector('h2');\n return h2 && h2.textContent.trim() === 'Welcome';\n });\n let insertAfter = welcomeSection;\n\n validSections.forEach(({ targetSectionText, sectionHtml }) => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = sectionHtml;\n const originalSectionNode = wrapper.firstElementChild;\n if (!originalSectionNode) {\n console.warn('[CrossInject] No section node for', targetSectionText);\n return;\n }\n const sectionClone = originalSectionNode.cloneNode(true);\n\n // Adapt heading & toggle as needed:\n const injectedH2 = sectionClone.querySelector('h2');\n const injectedUL = sectionClone.querySelector('ul');\n if (injectedH2 && injectedUL) {\n // Copy classes from an existing template if present\n const templateH2 = sidebarNav.querySelector('.hub-sidebar-content section h2');\n if (templateH2) {\n injectedH2.className = templateH2.className;\n } else {\n injectedH2.classList.add('Sidebar-headingTRQyOa2pk0gh', 'rm-Sidebar-heading');\n }\n injectedH2.setAttribute('tabindex', '0');\n // Remove existing chevrons, clone from template or fallback\n Array.from(injectedH2.querySelectorAll('.icon-chevron')).forEach(el => el.remove());\n if (templateH2) {\n templateH2.querySelectorAll('.icon-chevron').forEach(iconSpan => {\n injectedH2.appendChild(iconSpan.cloneNode(true));\n });\n } else {\n const fallbackSpan = document.createElement('span');\n fallbackSpan.className = 'icon-chevron';\n injectedH2.appendChild(fallbackSpan);\n }\n // Initially collapsed\n collapseSection(sectionClone);\n\n // Toggle handler\n const toggleFn = () => {\n const isCollapsed = injectedUL.classList.contains('section-collapsed');\n if (isCollapsed) {\n expandSection(sectionClone);\n } else {\n collapseSection(sectionClone);\n }\n };\n injectedH2.style.cursor = 'pointer';\n injectedH2.addEventListener('click', toggleFn);\n injectedH2.addEventListener('keydown', e => {\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {\n e.preventDefault();\n toggleFn();\n }\n });\n }\n\n // Nested toggles\n sectionClone.querySelectorAll('a.Sidebar-link_parent').forEach(aParent => {\n let btn = aParent.querySelector('button');\n if (!btn && aParent.nextElementSibling && aParent.nextElementSibling.tagName === 'BUTTON') {\n btn = aParent.nextElementSibling;\n }\n let subUl = null;\n if (btn) {\n const maybeUl = btn.parentElement.nextElementSibling;\n if (maybeUl && maybeUl.classList.contains('subpages')) subUl = maybeUl;\n }\n if (!subUl) {\n const parentLi = aParent.closest('li');\n if (parentLi) {\n const maybe = parentLi.querySelector('ul.subpages');\n if (maybe) subUl = maybe;\n }\n }\n if (btn && subUl) {\n // collapsed by default\n btn.setAttribute('aria-expanded', 'false');\n subUl.classList.add('section-collapsed');\n subUl.classList.remove('section-list-expanded');\n btn.style.cursor = 'pointer';\n btn.addEventListener('click', e => {\n e.preventDefault();\n const expanded = btn.getAttribute('aria-expanded') === 'true';\n if (expanded) {\n btn.setAttribute('aria-expanded', 'false');\n subUl.classList.add('section-collapsed');\n subUl.classList.remove('section-list-expanded');\n } else {\n btn.setAttribute('aria-expanded', 'true');\n subUl.classList.remove('section-collapsed');\n subUl.classList.add('section-list-expanded');\n }\n });\n }\n });\n\n // Insert right after Welcome (Places first, then Users)\n if (insertAfter && insertAfter.parentElement === contentDiv) {\n insertAfter.insertAdjacentElement('afterend', sectionClone);\n insertAfter = sectionClone;\n } else {\n contentDiv.appendChild(sectionClone);\n }\n console.log(`[CrossInject] Injected \"${targetSectionText}\" after Welcome.`);\n });\n\n // After injecting both, auto-expand whichever matches current path\n function normalizeHref(href) {\n try {\n const url = new URL(href, window.location.origin);\n return url.pathname.replace(/\\/$/, '');\n } catch {\n return href.replace(/\\/$/, '');\n }\n }\n const normPath = window.location.pathname.replace(/\\/$/, '');\n // Clear any previous active marks:\n contentDiv.querySelectorAll('a[aria-current]').forEach(a => {\n a.removeAttribute('aria-current');\n a.classList.remove('active');\n });\n // Find matches among injected links:\n const allLinks = Array.from(contentDiv.querySelectorAll('a'));\n allLinks.forEach(a => {\n const href = a.getAttribute('href');\n if (!href) return;\n if (normalizeHref(href) === normPath) {\n // mark active\n a.setAttribute('aria-current', 'page');\n a.classList.add('active');\n // expand its parent section\n let sec = a.closest('section');\n if (sec) expandSection(sec);\n // expand ancestors\n let anc = a.parentElement;\n while (anc && anc !== contentDiv) {\n if (anc.tagName === 'UL' && anc.classList.contains('subpages')) {\n anc.classList.remove('section-collapsed');\n anc.classList.add('section-list-expanded');\n const parentLi = anc.closest('li');\n if (parentLi) {\n const btn = parentLi.querySelector('button[aria-expanded]');\n if (btn) btn.setAttribute('aria-expanded', 'true');\n }\n }\n if (anc.tagName === 'SECTION') {\n expandSection(anc);\n }\n anc = anc.parentElement;\n }\n }\n });\n // If none matched exactly, all remain collapsed.\n });\n })();\n }, 600);\n});","html":{"header":"\n\n\n\n\n\n 
![\"Linkedin\"](\"https://location.foursquare.com/wp-content/uploads/sites/2/2022/06/linkedin.svg?w=1240\")
\t\t\t\t\t\t\t\t\t\t\t\t\t![\"\"](\"https://location.foursquare.com/wp-content/uploads/sites/2/2023/07/Twitter-x-e1690467670817.png?w=50\")
\t\t\t\t\t\t\t\t\t\t\t\t\t![\"\"](\"https://location.foursquare.com/wp-content/uploads/sites/2/2022/10/Discord_icon_clyde_black.svg?w=1240\"){kind=icon}
\t\t\t\t\t\t\t\t\t\t\t\t\t![\"\"](\"https://location.foursquare.com/wp-content/uploads/sites/2/2022/10/vimeo-1-e1665673976373.png?w=40\")
\t\t\t\t\t\t\t\t\t\t\t\t\t![\"\"](\"https://location.foursquare.com/wp-content/uploads/sites/2/2023/03/Slack-Black-Solid-e1679414272120.png?w=40\")
\t\t\t\t\t\t\t\t\t\t\t\t\t![\"Foursquare](\"https://location.foursquare.com/wp-content/uploads/sites/2/2023/10/new-fsq-access.png\"\n)
\n ![](\"https://files.readme.io/eda470330b30fa28ec9a4170ef453aa759a1f7bf9aa734790f199d0df1c7c15e-PM-Badge.svg\"){kind=icon}
\n ![\"Foursquare](\"https://files.readme.io/bf5818e5a2fa3e717ea7efde1ab954362bb615ff34dc0f0685be4df9d04ed424-Screenshot_2024-12-17_at_12.23.07_PM.png\")
\n \n \n \n \n