customElements.get("my-store-locator")||customElements.define("my-store-locator",class extends HTMLElement{constructor(){super(),this.dom={mobile:"my-store-locator-mobile",btn:".js-my-store-locator-btn",drawer:"my-store-locator-drawer",drawerBtn:".js-my-store-locator-drawer-btn",info:".js-my-store-locator-info",details:".js-my-store-locator-details",close:".js-my-store-locator-close",location:".js-my-store-locator-location",telephone:".js-my-store-locator-telephone",email:".js-my-store-locator-email",address:".js-my-store-locator-address",hours:".js-my-store-locator-hours",services:".js-my-store-locator-services",distance:".js-my-store-locator-distance",pickupAvailability:"pickup-availability",searchButton:".js-my-store-locator-search-drawer-launcher",filterResults:"ProductGridContainer",filterTag:".js-my-store-pickup-location-text",filterInput:".js-my-store-pickup-location-input",storeLocatorSearch:"storeLocatorSearch"},this.mobileLocator=document.querySelector(this.dom.mobile),this.button=this.querySelector(this.dom.btn),this.drawer=document.querySelector(this.dom.drawer),this.drawerBtn=this.querySelector(this.dom.drawerBtn),this.drawerBtn&&this.drawerBtn.addEventListener("click",this.onClickShowStoreSelector.bind(this)),this.details=this.querySelector(this.dom.details),this.detailsClose=this.details.querySelector(this.dom.close),this.detailsClose.addEventListener("click",this.hideDetails.bind(this)),this.detailsLocation=this.details.querySelector(this.dom.location),this.detailsTelephone=this.details.querySelector(this.dom.telephone),this.detailsEmail=this.details.querySelector(this.dom.email),this.detailsAddress=this.details.querySelector(this.dom.address),this.detailsHours=this.details.querySelector(this.dom.hours),this.detailsServices=this.details.querySelector(this.dom.services),this.distance=this.details.querySelector(this.dom.distance),this.filterResults=document.getElementById(this.dom.filterResults)||null,this.storeLocatorSearch=document.getElementById(this.dom.storeLocatorSearch)||null,this.onBodyClick=this.handleBodyClick.bind(this),this.onClickRefreshList=this.onClickRefreshList.bind(this),this.onClickToggleDetails=this.onClickToggleDetails.bind(this),this.onClickShowStoreSelector=this.onClickShowStoreSelector.bind(this),this.addEventListener("keyup",event=>{event.code.toUpperCase()==="ESCAPE"&&this.hideDetails()}),this?.filterResults&&new MutationObserver(mutations=>{mutations.forEach(mutation=>{mutation?.type==="childList"&&(document.querySelectorAll(this.dom.searchButton).forEach($searchButton=>{$searchButton.addEventListener("click",this.onClickShowStoreSelector.bind(this))}),this.updateFacets(this.button.querySelector(this.dom.info).innerHTML))})}).observe(this.filterResults,{childList:!0}),document.querySelectorAll(this.dom.searchButton).forEach($searchButton=>{$searchButton.addEventListener("click",this.onClickShowStoreSelector.bind(this))}),this.preferredStoreId=null,this.myCoords=null,this.allLocationsData=[],this.itemLocationsData={},this.storeSuggestions=[],this.init(),window.refreshStoreLocator=this.init.bind(this)}storageAvailable(type){let storage;try{storage=window[type];const x="__storage_test__";return storage.setItem(x,x),storage.removeItem(x),!0}catch(e){return e instanceof DOMException&&(e.code===22||e.code===1014||e.name==="QuotaExceededError"||e.name==="NS_ERROR_DOM_QUOTA_REACHED")&&storage&&storage.length!==0}}getDistanceFromKm(km){let distanceText="";if(this.dataset.distanceUnit==="km")distanceText=`${parseFloat(km.toFixed(1))} ${this.dataset.distanceKmLabel}`;else{const miles=km*.621371;distanceText=`${parseFloat(miles.toFixed(1))} ${this.dataset.distanceMilesLabel}`}return distanceText}init(){const expiry=SDG.Data.locationCookieExpiry||30;function setSecureCookie(name,value,days){var expires="";if(days){var date=new Date;date.setTime(date.getTime()+days*24*60*60*1e3),expires="; expires="+date.toUTCString()}document.cookie=name+"="+(value||"")+expires+"; path=/; secure"}function getCookie(name){for(var nameEQ=name+"=",ca=document.cookie.split(";"),i=0;i{this.updateMyStoreFromLocalStorage()||this.renderSelectYourStore()})}function getLocation(){if(SDG.Data.locationCookie||!1){const locationPreference=getCookie("location_sharing")||null;if(locationPreference&&locationPreference==="false"){decline.call(this,!1),this.hasInitialized=!0;return}if(locationPreference&&locationPreference==="true"){const locationPosition=getCookie("location_position")||null;if(locationPosition){const pos=JSON.parse(locationPosition);accept.call(this,pos,!0),this.hasInitialized=!0;return}}navigator.geolocation.getCurrentPosition(pos=>accept.call(this,pos,!0),decline.bind(this)),this.hasInitialized=!0;return}navigator.geolocation.getCurrentPosition(accept.bind(this),decline.call(this,!1)),this.hasInitialized=!0}if(this.storageAvailable("localStorage")){const preferredStoreId=localStorage.getItem("preferredStoreId");preferredStoreId&&(this.preferredStoreId=preferredStoreId)}navigator.geolocation?getLocation.call(this):this.fetchLocations(null,!0,()=>{this.updateMyStoreFromLocalStorage()||this.renderSelectYourStore()})}updateFacets(placeholderText=null){if(!this?.filterResults)return;const $placeholder=document.querySelector(`${this.dom.filterInput}[data-location-id="placeholder"]`),$placeholderButton=$placeholder?.closest("li").querySelector(this.dom.searchButton);placeholderText&&$placeholderButton&&($placeholderButton.innerText=placeholderText);const $prevInput=document.querySelector(`${this.dom.filterInput}.active`),$prevInputChecked=$prevInput?.checked;let $visibleInput=null;if(this.allLocationsData.forEach(location=>{document.querySelectorAll(`${this.dom.filterTag}[data-location-id="${location.id}"]`).forEach($filterTag=>{$filterTag.innerText=location.name}),document.querySelectorAll(this.dom.filterInput).forEach($filterInput=>{const pickupLocationId=$filterInput.dataset?.locationId;if(pickupLocationId===location.id){$filterInput.innerText=location.name;const $searchButton=$filterInput.closest("li").querySelector(this.dom.searchButton);$searchButton&&($searchButton.innerText=location.name)}pickupLocationId===this.preferredStoreId?($visibleInput=$filterInput,$filterInput.disabled=!1,$filterInput.classList.add("active"),$filterInput.closest("label").classList.remove("facet-checkbox--disabled"),$filterInput.closest("li").classList.add("active")):pickupLocationId!=="placeholder"&&($filterInput.disabled=!0,$filterInput.checked=!1,$filterInput.classList.remove("active"),$filterInput.closest("label").classList.add("facet-checkbox--disabled"),$filterInput.closest("li").classList.remove("active"))})}),$visibleInput&&$prevInput&&$visibleInput?.id!==$prevInput?.id&&$prevInputChecked){const clickEvt=new MouseEvent("click",{view:window,bubbles:!0,cancelable:!0});$visibleInput.dispatchEvent(clickEvt)}if(!$visibleInput&&$placeholder){$placeholder.closest("li").classList.add("active");const $filterTag=document.querySelector(`${this.dom.filterTag}[data-location-id]`);if($filterTag){const clickEvt=new MouseEvent("click",{view:window,bubbles:!0,cancelable:!0});$filterTag.closest("a").dispatchEvent(clickEvt)}}else $placeholder&&$placeholder.closest("li").classList.remove("active")}updateMyStoreFromLocalStorage(){let hasUpdated=!1;if(this.storageAvailable("localStorage")){const preferredStoreId=localStorage.getItem("preferredStoreId");if(preferredStoreId){const preferredLocation=this.allLocationsData.find(location=>location.id===preferredStoreId);preferredLocation&&(this.updateMyStoreWithLocation(preferredLocation),hasUpdated=!0)}}return hasUpdated}locationsQuery(productQueryIds=[]){const locationQuery=` id name address { formatted address1 city province provinceCode zip country phone latitude longitude } phoneOverride: metafield(namespace: "apple", key: "apl_PhoneOverride") { value } email: metafield(namespace: "apple", key: "apl_Email") { value } hours: metafield(namespace: "apple", key: "apl_Hours") { value } services: metafield(namespace: "apple", key: "apl_ServicesContent") { value } image: metafield(namespace: "apple", key: "apl_StoreImage") { reference { ... on MediaImage { image { originalSrc } } } } `,getNearestQuery=` getNearestPickupLocations($first: Int!, $location: GeoCoordinateInput, $sortKey: LocationSortKeys) { locations(near: $location, first: $first, sortKey: $sortKey) { edges { node { ${locationQuery} } } } } `;if(productQueryIds.length>0){let productsQuery="",productIds="",selectedOptions="";const activeLang=SDG?.Data?.language||"EN";return productQueryIds.forEach(key=>{productIds+=`$productId${key}: ID!,`,selectedOptions+=`$selectedOptions${key}: [SelectedOptionInput!]!,`,productsQuery+=` product${key}: product(id: $productId${key}) { variantBySelectedOptions(selectedOptions: $selectedOptions${key}) { storeAvailability(first: $first) { edges { node { available pickUpTime quantityAvailable location { ${locationQuery} } } } } } } `}),` query Products(${productIds} ${selectedOptions} $first: Int!, $location: GeoCoordinateInput, $sortKey: LocationSortKeys) @inContext(language: ${activeLang}){ ${productsQuery} locations(near: $location, first: $first, sortKey: $sortKey) { edges { node { ${locationQuery} } } } } `}return` query ${getNearestQuery} `}async fetchLocations(position=null,setDataOnly=!1,cb=null){const queryVariables={first:parseInt(this.dataset.numberOfLocationsToFetch),sortKey:"NAME"};if(position?.coords){this.myCoords=position.coords;const latitude=position.coords.latitude,longitude=position.coords.longitude;queryVariables.sortKey="DISTANCE",queryVariables.location={latitude,longitude}}let isCart=!1;const pickupAvailabilities=document.querySelectorAll(this.dom.pickupAvailability),productQueryIds=[];pickupAvailabilities.length>0&&[...pickupAvailabilities].every((pickupAvailability,i)=>{const itemKey=pickupAvailability?.dataset?.itemKey,productId=pickupAvailability?.dataset?.productId,selectedOptionsRaw=pickupAvailability?.dataset?.selectedOptions;if(productId&&selectedOptionsRaw){const selectedOptions=JSON.parse(selectedOptionsRaw).map(option=>({name:option.name,value:option.selected_value?option.selected_value:option.values[0]}));return itemKey?(productQueryIds.push(itemKey),queryVariables[`productId${itemKey}`]=`gid://shopify/Product/${productId}`,queryVariables[`selectedOptions${itemKey}`]=selectedOptions,isCart=!0):(productQueryIds.push(i),queryVariables[`productId${i}`]=`gid://shopify/Product/${productId}`,queryVariables[`selectedOptions${i}`]=selectedOptions),itemKey}});const query=this.locationsQuery(productQueryIds),locationsData=await this.fetchStorefrontApi(query,queryVariables);if(locationsData){if(locationsData.locations?.edges?.length&&(locationsData.locations.edges.forEach(location=>{if(location?.node?.services?.value){const parsed=JSON.parse(location.node.services.value),markup=this.serializeRichText(parsed);location.node.services_html=markup}location?.node?.image?.reference?.image?.originalSrc&&(location.node.image_url=location.node.image.reference.image.originalSrc)}),this.allLocationsData=locationsData.locations.edges.map(location=>{const locationData=location.node;return locationsData.product0&&(locationData.available=!1),locationData.distance=this.calculateStoreDistance(locationData.address),locationData})),locationsData.product0?.variantBySelectedOptions?.storeAvailability?.edges?.length){const locationsPDPData=locationsData.product0.variantBySelectedOptions.storeAvailability.edges;this.allLocationsData=this.allLocationsData.map(location=>{const locationPDPData=locationsPDPData.find(locationPDP=>locationPDP.node.location.id===location.id);return locationPDPData?{...location,available:locationPDPData.node.available,pickUpTime:locationPDPData.node.pickUpTime,quantityAvailable:locationPDPData.node.quantityAvailable}:location})}else isCart&&(this.itemLocationsData={},Object.keys(locationsData).forEach(key=>{if(key.includes("product")){const itemKey=key.replace("product",""),locationsItemData=locationsData[key]?.variantBySelectedOptions?.storeAvailability?.edges||[],lineItemLocations=this.allLocationsData.map(location=>{const locationItemData=locationsItemData.find(locationItem=>locationItem.node.location.id===location.id);return locationItemData?{...location,available:locationItemData.node.available,pickUpTime:locationItemData.node.pickUpTime,quantityAvailable:locationItemData.node.quantityAvailable}:{...location,available:!1}});this.itemLocationsData[itemKey]=lineItemLocations}}));if(this.storeSuggestions=[],this.allLocationsData.forEach(location=>{this.storeSuggestions.push(location.address.city,location.address.province,location.address.zip,location.address.country)}),setDataOnly||this.updateMyStoreFromLocalStorage()||this.updateMyStoreWithLocation(this.allLocationsData[0]),this.drawer){let allLocationsData=this.allLocationsData;if(this.drawer.selectedItemLocationsKey){const selectedItemLocationsData=this.itemLocationsData[this.drawer.selectedItemLocationsKey];selectedItemLocationsData&&(allLocationsData=selectedItemLocationsData)}let searchLocation=this.storeLocatorSearch.value;searchLocation=searchLocation.trim(),this.drawer.updateStoreDetails(allLocationsData,searchLocation)}}cb&&cb()}serializeRichText(richText){let html="";switch(richText.type){case"root":richText.children.forEach(child=>{html+=this.serializeRichText(child)});break;case"list":html+="";break;case"list-item":html+="
  • ",richText.children.forEach(child=>{html+=this.serializeRichText(child)}),html+="
  • ";break;case"text":html+=richText.value;break;case"link":html+=``,richText.children.forEach(child=>{html+=this.serializeRichText(child)}),html+="";break;case"paragraph":html+="

    ",richText.children.forEach(child=>{html+=this.serializeRichText(child)}),html+="

    ";break;default:break}return html}onClickRefreshList(evt){evt.currentTarget.disabled=!0,this.init()}onClickToggleDetails(){this.details.hasAttribute("open")?this.hideDetails():this.showDetails()}onClickShowStoreSelector(evt){document.querySelector("my-store-locator-drawer").show(evt.currentTarget)}handleBodyClick(evt){const target=evt.target;target!=this.details&&!target.closest(this.dom.btn)&&!target.closest(this.dom.details)&&this.hideDetails()}hideDetails(){this.details.removeAttribute("open"),document.body.removeEventListener("click",this.onBodyClick),removeTrapFocus(this.focusElement)}showDetails(focusElement){this.focusElement=focusElement,this.details.setAttribute("open",""),document.body.addEventListener("click",this.onBodyClick),trapFocus(this.details)}removeButtonEvents(){this.button.removeEventListener("click",this.onClickRefreshList),this.button.removeEventListener("click",this.onClickToggleDetails),this.button.removeEventListener("click",this.onClickShowStoreSelector)}renderError(){this.removeButtonEvents(),this.button.disabled=!1,this.button.querySelector(this.dom.info).innerHTML=this.dataset.errorText,this.button.addEventListener("click",this.onClickRefreshList),this.mobileLocator&&this.mobileLocator.renderError();const pickupAvailabilities=document.querySelectorAll(this.dom.pickupAvailability);pickupAvailabilities.length>0&&pickupAvailabilities.forEach(pickupAvailability=>{pickupAvailability.renderError()}),this.updateFacets(this.dataset.errorText)}renderSelectYourStore(){this.removeButtonEvents(),this.button.disabled=!1,this.button.querySelector(this.dom.info).innerHTML=this.dataset.selectText,this.button.addEventListener("click",this.onClickShowStoreSelector),this.drawer.loading.classList.add("hidden"),this.mobileLocator&&this.mobileLocator.renderSelectYourStore();const pickupAvailabilities=document.querySelectorAll(this.dom.pickupAvailability);pickupAvailabilities.length>0&&pickupAvailabilities.forEach(pickupAvailability=>{pickupAvailability.renderPreview()}),this.updateFacets(this.dataset.selectText)}updateMyStoreWithLocation(location){if(!location)return;this.removeButtonEvents();const{name,address,email,hours,phoneOverride,id,distance}=location;this.preferredStoreId=id,this.button.disabled=!1,this.button.querySelector(this.dom.info).innerHTML=name,this.button.addEventListener("click",this.onClickToggleDetails);function resetValue(element,attribute=!1){element&&(element.value="",attribute&&element.setAttribute(attribute,""))}if(this.updateFacets(name),this.details.querySelector("h2").innerHTML=name,this.detailsLocation.innerHTML=address?.city&&address?.provinceCode?`${address.city}, ${address.provinceCode}`:`${address.city}`,address?.phone&&address?.phone!==""){this.detailsTelephone.classList.remove("hidden");const phoneLink=this.detailsTelephone.querySelector("a");phoneLink.href=`tel:${address.phone}`,phoneLink.innerHTML=address.phone}else{const phoneLink=this.detailsTelephone.querySelector("a");resetValue(phoneLink,"href"),this.detailsTelephone.classList.add("hidden")}if(phoneOverride?.value&&phoneOverride?.value!==""){this.detailsTelephone.classList.remove("hidden");const phoneLink=this.detailsTelephone.querySelector("a");phoneLink.href=`tel:${phoneOverride.value}`,phoneLink.innerHTML=phoneOverride.value}if(address?.address1&&address?.address1!==""){this.detailsAddress.classList.remove("hidden");const apiProvider=SDG?.Data?.mapProvider||null,addressLink=this.detailsAddress.querySelector("a");if(apiProvider==="google_maps"){const encodedName=encodeURIComponent(name),latitude=address.latitude,longitude=address.longitude,href=`https://www.google.com/maps/search/?api=1&query=${encodedName}&query_place_id=${latitude},${longitude}`;addressLink.href=href,addressLink.innerHTML=address.address1}if(apiProvider==="apple_maps"){const href=`https://maps.apple.com/place?q=${name}&address=${address.formatted}&ll=${address.latitude},${address.longitude}`;addressLink.href=href,addressLink.innerHTML=address.address1}}else{const addressLink=this.detailsAddress.querySelector("a");resetValue(addressLink,"href"),this.detailsAddress.classList.add("hidden")}if(email?.value&&email?.value!==""){this.detailsEmail.classList.remove("hidden");const emailLink=this.detailsEmail.querySelector("a");emailLink.href=`mailto:${email.value}`,emailLink.innerHTML=email.value}else{const emailLink=this.detailsEmail.querySelector("a");resetValue(emailLink,"href"),this.detailsEmail.classList.add("hidden")}if(hours?.value&&hours?.value!==""){this.detailsHours.classList.remove("hidden");const hoursSpan=this.detailsHours.querySelector("span");hoursSpan.innerHTML=hours.value}else{const hoursSpan=this.detailsHours.querySelector("span");resetValue(hoursSpan),this.detailsHours.classList.add("hidden")}if(location?.services_html){let openAcc2=function(el){el.setAttribute("aria-expanded",!0),el.classList.add("is-active")},closeAcc2=function(el){el.setAttribute("aria-expanded",!1),el.classList.remove("is-active")};var openAcc=openAcc2,closeAcc=closeAcc2;this.detailsServices.classList.remove("hidden"),this.detailsServices.innerHTML=` `;const $accButton=this.detailsServices.querySelector(".js-acc-button"),$accDetails=this.detailsServices.querySelector(".js-acc-details"),$accIcon=this.detailsServices.querySelector(".js-acc-icon");$accButton.addEventListener("click",()=>{$accDetails.classList.contains("is-active")?(closeAcc2($accDetails),$accIcon&&closeAcc2($accIcon)):(openAcc2($accDetails),$accIcon&&openAcc2($accIcon))})}else this.detailsServices.classList.add("hidden");this.updateMyStoreDistance(distance),this.mobileLocator&&this.mobileLocator.updateMyStoreWithLocation(location);const pickupAvailabilities=document.querySelectorAll(this.dom.pickupAvailability);pickupAvailabilities.length>0&&pickupAvailabilities.forEach(pickupAvailability=>{pickupAvailability.renderPreview(location)})}updateMyStoreDistance(distance){distance?(this.distance.innerHTML=distance,this.distance.classList.remove("hidden"),this.mobileLocator?.distance&&(this.mobileLocator.distance.innerHTML=distance,this.mobileLocator.distance.classList.remove("hidden"))):(this.distance.classList.add("hidden"),this.mobileLocator?.distance&&this.mobileLocator.distance.classList.add("hidden"))}getDistanceFromLatLon(lat1,lon1,lat2,lon2){var R=6371,dLat=this.deg2rad(lat2-lat1),dLon=this.deg2rad(lon2-lon1),a=Math.sin(dLat/2)*Math.sin(dLat/2)+Math.cos(this.deg2rad(lat1))*Math.cos(this.deg2rad(lat2))*Math.sin(dLon/2)*Math.sin(dLon/2),c=2*Math.atan2(Math.sqrt(a),Math.sqrt(1-a)),d=R*c;return this.getDistanceFromKm(d)}deg2rad(deg){return deg*(Math.PI/180)}calculateStoreDistance(locationAddress){return this.myCoords?.latitude&&this.myCoords?.longitude&&locationAddress?.latitude&&locationAddress?.longitude?this.getDistanceFromLatLon(this.myCoords.latitude,this.myCoords.longitude,locationAddress.latitude,locationAddress.longitude):null}async fetchStorefrontApi(query,variables={}){const endpoint=`https://${Shopify.shop}/api/2023-07/graphql.json`,response=await fetch(endpoint,{method:"POST",headers:{"Content-Type":"application/json","X-Shopify-Storefront-Access-Token":this.dataset.storefrontApiAccessToken},body:JSON.stringify({query,variables})}),{data,errors}=await response.json();if(errors)throw this.renderError(),new Error(errors[0].message);return data}}),customElements.get("my-store-locator-mobile")||customElements.define("my-store-locator-mobile",class extends HTMLElement{constructor(){super(),this.dom={desktop:"my-store-locator",btn:".js-my-store-locator-btn",drawerBtn:".js-my-store-locator-drawer-btn",info:".js-my-store-locator-info",details:".js-my-store-locator-details",close:".js-my-store-locator-close",location:".js-my-store-locator-location",telephone:".js-my-store-locator-telephone",email:".js-my-store-locator-email",address:".js-my-store-locator-address",hours:".js-my-store-locator-hours",services:".js-my-store-locator-services",distance:".js-my-store-locator-distance"},this.desktopLocator=document.querySelector(this.dom.desktop),this.button=this.querySelector(this.dom.btn),this.drawerBtn=this.querySelector(this.dom.drawerBtn),this.drawerBtn&&this.drawerBtn.addEventListener("click",this.onClickShowStoreSelector.bind(this)),this.details=this.querySelector(this.dom.details),this.detailsClose=this.details.querySelector(this.dom.close),this.detailsClose.addEventListener("click",this.hideDetails.bind(this)),this.detailsLocation=this.details.querySelector(this.dom.location),this.detailsTelephone=this.details.querySelector(this.dom.telephone),this.detailsEmail=this.details.querySelector(this.dom.email),this.detailsAddress=this.details.querySelector(this.dom.address),this.detailsHours=this.details.querySelector(this.dom.hours),this.detailsServices=this.details.querySelector(this.dom.services),this.distance=this.details.querySelector(this.dom.distance),this.onBodyClick=this.handleBodyClick.bind(this),this.onClickRefreshList=this.onClickRefreshList.bind(this),this.onClickToggleDetails=this.onClickToggleDetails.bind(this),this.onClickShowStoreSelector=this.onClickShowStoreSelector.bind(this),this.addEventListener("keyup",event=>{event.code.toUpperCase()==="ESCAPE"&&this.hideDetails()})}onClickRefreshList(evt){evt.currentTarget.disabled=!0,this.desktopLocator.init()}onClickToggleDetails(){this.details.hasAttribute("open")?this.hideDetails():this.showDetails()}onClickShowStoreSelector(evt){document.querySelector("my-store-locator-drawer").show(evt.currentTarget)}handleBodyClick(evt){const target=evt.target;target!=this.details&&!target.closest(this.dom.btn)&&!target.closest(this.dom.details)&&this.hideDetails()}hideDetails(){this.details.removeAttribute("open"),document.body.removeEventListener("click",this.onBodyClick),removeTrapFocus(this.focusElement)}showDetails(focusElement){this.focusElement=focusElement,this.details.setAttribute("open",""),document.body.addEventListener("click",this.onBodyClick),trapFocus(this.details)}removeButtonEvents(){this.button.removeEventListener("click",this.onClickRefreshList),this.button.removeEventListener("click",this.onClickToggleDetails),this.button.removeEventListener("click",this.onClickShowStoreSelector)}renderError(){this.removeButtonEvents(),this.button.disabled=!1,this.button.querySelector(this.dom.info).innerHTML=this.dataset.errorText,this.button.addEventListener("click",this.onClickRefreshList)}renderSelectYourStore(){this.removeButtonEvents(),this.button.disabled=!1,this.button.querySelector(this.dom.info).innerHTML=this.dataset.selectText,this.button.addEventListener("click",this.onClickShowStoreSelector)}updateMyStoreWithLocation(location){this.removeButtonEvents();const{name,address,email,hours,phoneOverride}=location;this.button.disabled=!1,this.button.querySelector(this.dom.info).innerHTML=name,this.button.addEventListener("click",this.onClickToggleDetails);function resetValue(element,attribute=!1){element&&(element.value="",attribute&&element.setAttribute(attribute,""))}if(this.details.querySelector("h2").innerHTML=name,this.detailsLocation.innerHTML=address?.city&&address?.provinceCode?`${address.city}, ${address.provinceCode}`:`${address.city}`,address?.phone&&address?.phone!==""){this.detailsTelephone.classList.remove("hidden");const phoneLink=this.detailsTelephone.querySelector("a");phoneLink.href=`tel:${address.phone}`,phoneLink.innerHTML=address.phone}else{const phoneLink=this.detailsTelephone.querySelector("a");resetValue(phoneLink,"href"),this.detailsTelephone.classList.add("hidden")}if(phoneOverride?.value&&phoneOverride?.value!==""){this.detailsTelephone.classList.remove("hidden");const phoneLink=this.detailsTelephone.querySelector("a");phoneLink.href=`tel:${phoneOverride.value}`,phoneLink.innerHTML=phoneOverride.value}if(address?.address1&&address?.address1!==""){this.detailsAddress.classList.remove("hidden");const apiProvider=SDG?.Data?.mapProvider||null,addressLink=this.detailsAddress.querySelector("a");if(apiProvider==="google_maps"){const encodedName=encodeURIComponent(name),latitude=address.latitude,longitude=address.longitude,href=`https://www.google.com/maps/search/?api=1&query=${encodedName}&query_place_id=${latitude},${longitude}`;addressLink.href=href,addressLink.innerHTML=address.address1}if(apiProvider==="apple_maps"){const href=`https://maps.apple.com/place?q=${name}&address=${address.formatted}&ll=${address.latitude},${address.longitude}`;addressLink.href=href,addressLink.innerHTML=address.address1}}else{const addressLink=this.detailsAddress.querySelector("a");resetValue(addressLink,"href"),this.detailsAddress.classList.add("hidden")}if(email?.value&&email?.value!==""){this.detailsEmail.classList.remove("hidden");const emailLink=this.detailsEmail.querySelector("a");emailLink.href=`mailto:${email.value}`,emailLink.innerHTML=email.value}else{const emailLink=this.detailsEmail.querySelector("a");resetValue(emailLink,"href"),this.detailsEmail.classList.add("hidden")}if(hours?.value&&hours?.value!==""){this.detailsHours.classList.remove("hidden");const hoursSpan=this.detailsHours.querySelector("span");hoursSpan.innerHTML=hours.value}else{const hoursSpan=this.detailsHours.querySelector("span");resetValue(hoursSpan),this.detailsHours.classList.add("hidden")}if(location?.services_html){let openAcc2=function(el){el.setAttribute("aria-expanded",!0),el.classList.add("is-active")},closeAcc2=function(el){el.setAttribute("aria-expanded",!1),el.classList.remove("is-active")};var openAcc=openAcc2,closeAcc=closeAcc2;this.detailsServices.classList.remove("hidden"),this.detailsServices.innerHTML=` `;const $accButton=this.detailsServices.querySelector(".js-acc-button"),$accDetails=this.detailsServices.querySelector(".js-acc-details"),$accIcon=this.detailsServices.querySelector(".js-acc-icon");$accButton.addEventListener("click",()=>{$accDetails.classList.contains("is-active")?(closeAcc2($accDetails),$accIcon&&closeAcc2($accIcon)):(openAcc2($accDetails),$accIcon&&openAcc2($accIcon))})}else this.detailsServices.classList.add("hidden")}}),customElements.get("my-store-locator-drawer")||customElements.define("my-store-locator-drawer",class extends HTMLElement{constructor(){super(),this.dom={storeLocatorSearch:"storeLocatorSearch",form:"storeLocatorSearchForm",storeLocator:"my-store-locator",suggestions:".js-store-locator-search-suggestions",error:".js-store-locator-search-error",loading:"storeLocatorDrawerLoading",results:"myLocationResults",resultsCount:".js-store-locator-results-count",activeResult:'.js-my-location-result[data-active="true"]',close:".js-store-locator-drawer-close",useLocationBtn:".js-store-locator-use-location-btn",resultsDistance:".js-store-locator-results-distance",selectBtn:".js-store-locator-select-btn",productInfo:".js-store-locator-product-info",acc_button:".js-acc-button",acc_icon:".js-acc-icon",acc_details:".js-acc-details"},this.cls={active:"is-active"},this.form=document.getElementById(this.dom.form),this.results=document.getElementById(this.dom.results),this.resultsCount=this.querySelector(this.dom.resultsCount),this.resultsDistance=this.querySelector(this.dom.resultsDistance),this.storeLocatorSearch=document.getElementById(this.dom.storeLocatorSearch),this.storeLocator=document.querySelector(this.dom.storeLocator),this.suggestions=this.querySelector(this.dom.suggestions),this.error=this.querySelector(this.dom.error),this.loading=document.getElementById(this.dom.loading),this.close=this.querySelector(this.dom.close),this.useLocationBtn=this.querySelector(this.dom.useLocationBtn),this.selectBtn=this.querySelector(this.dom.selectBtn),this.onBodyClick=this.handleBodyClick.bind(this),this.close.addEventListener("click",()=>{this.hide()}),this.useLocationBtn.addEventListener("click",()=>{this.useLocation()}),this.selectBtn.addEventListener("click",this.selectPreferredLocation.bind(this)),this.addEventListener("keyup",event=>{event.code.toUpperCase()==="ESCAPE"&&this.hide()}),this.init()}init(){this.form.addEventListener("submit",event=>{event.preventDefault(),this.searchLocations()}),this.resultsDistance.addEventListener("change",()=>{this.searchLocations(!0)}),this.storeLocatorSearch.onkeyup=debounce(this.storeLocatorSearchOnKeyUp.bind(this),200)}async storeLocatorSearchOnKeyUp(e){const userData=e.target.value;let emptyArray=[];if(userData&&e.code.toUpperCase()!=="ENTER")if(emptyArray=await this.getPlaceSuggestions(userData),emptyArray.length>0){const suggestionsHtml=emptyArray.map(data=>``);this.suggestions.innerHTML=suggestionsHtml.join(""),this.suggestions.querySelectorAll("button").forEach(item=>{item.addEventListener("click",e2=>{this.selectSuggestion(e2.target)})}),this.suggestions.classList.remove("hidden")}else this.suggestions.classList.add("hidden");else this.suggestions.classList.add("hidden")}getPlaceSuggestions(address){const apiProvider=SDG?.Data?.mapProvider||null;if(apiProvider==="google_maps")return new Promise((resolve,reject)=>{const autocompleteService=new google.maps.places.AutocompleteService,request={input:address};autocompleteService.getPlacePredictions(request,(predictions,status)=>{if(status===google.maps.places.PlacesServiceStatus.OK){const suggestions=predictions.map(prediction=>prediction.description);resolve(suggestions)}else resolve([])})});if(apiProvider==="apple_maps")return new Promise((resolve,reject)=>{new mapkit.Search({getsUserLocation:!0,includeAddresses:!0,includePointsOfInterest:!0,includeQueries:!1}).autocomplete(address,(error,data)=>{if(error)resolve([]);else{const suggestions=data?.results?.map(result=>result.displayLines[0]);resolve(suggestions)}})})}selectPreferredLocation(){const activeResult=this.querySelector(this.dom.activeResult);if(activeResult){const id=activeResult.dataset.id;if(this.storeLocator.allLocationsData){const location=this.storeLocator.allLocationsData.find(location2=>location2.id===id);location&&(this.storeLocator.storageAvailable("localStorage")&&localStorage.setItem("preferredStoreId",location.id),this.storeLocator.updateMyStoreWithLocation(location),this.searchLocations(!0),this.hide())}}}useLocation(){this.storeLocatorSearch.value="",this.loading.classList.remove("hidden"),navigator.geolocation?navigator.geolocation.getCurrentPosition(this.updateDrawerStoreDetails.bind(this),this.updateDrawerStoreDetails.bind(this)):this.updateDrawerStoreDetails()}updateDrawerStoreDetails(position){this.storeLocator.fetchLocations(position,!0,()=>{this.loading.classList.add("hidden")})}selectSuggestion(element){let selectData=element.textContent;this.storeLocatorSearch.value=selectData.trim(),this.suggestions.classList.add("hidden"),this.searchLocations()}getObjects(obj,key,val){return obj.filter(location=>{const locationData=location.address;return locationData&&locationData[key]?locationData[key].toLowerCase()===val?.toLowerCase():null})}async searchLocations(noErrors=!1){let allLocationsData=this.storeLocator.allLocationsData;if(this.selectedItemLocationsKey){const selectedItemLocationsData=this.storeLocator.itemLocationsData[this.selectedItemLocationsKey];selectedItemLocationsData&&(allLocationsData=selectedItemLocationsData)}let searchLocation=this.storeLocatorSearch.value;if(searchLocation=searchLocation.trim(),noErrors)this.error.classList.add("hidden");else if(searchLocation===""){this.error.classList.remove("hidden");return}else this.error.classList.add("hidden");this.loading.classList.add("hidden");const geocodedPosition=await this.geocodePosition(searchLocation);if(geocodedPosition)this.updateDrawerStoreDetails(geocodedPosition);else{let storeDetails=[],searchCity=this.getObjects(allLocationsData,"city",searchLocation),searchZipcode=this.getObjects(allLocationsData,"zip",searchLocation),searchProvince=this.getObjects(allLocationsData,"province",searchLocation),country=this.getObjects(allLocationsData,"country",searchLocation);if(searchCity.length>0||searchZipcode.length>0||searchProvince.length>0||country.length>0)searchCity.length>0?storeDetails=searchCity:searchProvince.length>0?storeDetails=searchProvince:searchZipcode.length>0?storeDetails=searchZipcode:country.length>0&&(storeDetails=country),this.updateStoreDetails(storeDetails,searchLocation);else{if(!this.suggestions.classList.contains("hidden")){const firstSuggestion=this.suggestions.querySelector("button")||null;if(firstSuggestion){this.selectSuggestion(firstSuggestion);return}}noErrors&&(storeDetails=allLocationsData),searchLocation?this.updateStoreDetails([],searchLocation):this.updateStoreDetails(storeDetails,searchLocation)}}}geocodePosition(address){const apiProvider=SDG?.Data?.mapProvider||null;if(apiProvider==="google_maps")return new Promise((resolve,reject)=>{new google.maps.Geocoder().geocode({address},(results,status)=>{if(status==="OK"){const latitude=results?.[0]?.geometry?.location?.lat(),longitude=results?.[0]?.geometry?.location?.lng();if(latitude&&longitude){const position={coords:{latitude,longitude},timestamp:Date.now()};resolve(position)}}resolve(null)})});if(apiProvider==="apple_maps"&&apiProvider==="apple_maps")return new Promise((resolve,reject)=>{new mapkit.Geocoder().lookup(address,(error,data)=>{if(!error){const result=data?.results?.[0],latitude=result?.coordinate?.latitude,longitude=result?.coordinate?.longitude;if(latitude&&longitude){const position={coords:{latitude,longitude},timestamp:Date.now()};resolve(position)}}resolve(null)})})}updateStoreDetails(locationData,nearbyValue){let resultCount=0;const{mapPage}=SDG.Data||!1,activeIndex=locationData.findIndex(location=>location.id===this.storeLocator.preferredStoreId);activeIndex>-1&&locationData.splice(0,0,locationData.splice(activeIndex,1)[0]),this.results.innerHTML="";function setCityAndStateHTML(location){const{address}=location||null;let html;if(address){if(address?.city&&address?.provinceCode)return html=`${address.city}, ${address.provinceCode}`,html;if(address?.city&&!address?.provinceCode)return html=`${address.city}`,html}}locationData.forEach(location=>{if(location.distance){if(this.resultsDistance.classList.remove("hidden"),this.resultsDistance.value!=="all"){const parsedLocationDistance=parseFloat(location.distance),parsedDistance=parseFloat(this.resultsDistance.value);if(parsedLocationDistance>parsedDistance)return}}else this.resultsDistance.classList.add("hidden");const isActive=location.id===this.storeLocator.preferredStoreId,distanceHidden=location.distance?"":" hidden";let availabilityHtml="";if(location.available){let stockHtml="",pickUpTimeTranslated="";if(location.pickUpTime){const key=location.pickUpTime,languageKey=SDG.Data.language?.toLowerCase()||"en";pickUpTimeTranslated=window.deliveryOptionsStrings?.[languageKey]?.[key]||location.pickUpTime}location.quantityAvailable<10&&(stockHtml=`
    ${this.storeLocator.dataset.lowStockHtml.replace("{{ quantity }}",location.quantityAvailable)}
    `),availabilityHtml=`
    ${pickUpTimeTranslated}
    ${stockHtml}
    `}else location.available===!1&&(availabilityHtml=`
    ${this.storeLocator.dataset.unavailableText}
    `);let itemKeyAttr="";location.itemKey&&(itemKeyAttr=`data-item-key="${location.itemKey}"`);let resultHtml;const{address,name}=location||null,apiProvider=SDG?.Data?.mapProvider||null;if(!address)return;const{latitude,longitude}=address||null;let locationImageHtml="",serviceHtml="",telephoneVal=null,calloutHref=null,addressHref=null;if(location?.services_html&&(serviceHtml=` `),location?.image_url&&(locationImageHtml=`
    ${name}
    `),location?.address?.phone&&(telephoneVal=location.address.phone),location?.phoneOverride?.value&&(telephoneVal=location.phoneOverride.value),apiProvider==="apple_maps"&&(addressHref=`https://maps.apple.com/place?q=${name}&address=${address.formatted}&ll=${address.latitude},${address.longitude}`,calloutHref=`https://maps.apple.com/place?q=${name}&address=${address.formatted}&ll=${address.latitude},${address.longitude}`),apiProvider==="google_maps"){const encodedName=encodeURIComponent(name),latitude2=address.latitude,longitude2=address.longitude;addressHref=`https://www.google.com/maps/search/?api=1&query=${encodedName}&query_place_id=${latitude2},${longitude2}`,calloutHref=`https://www.google.com/maps/search/?api=1&query=${encodedName}&query_place_id=${latitude2},${longitude2}`}if(mapPage){resultHtml=`
    ${SDG.Data.myStore}
    ${locationImageHtml}
    ${location.name}
    ${location.distance}
    ${setCityAndStateHTML(location)}
      ${location?.address?.address1?`
    • ${SDG.Data.storeAddress||"Address"}: ${location.address.address1}
    • `:""} ${telephoneVal?`
    • ${SDG.Data.storePhone||"Telephone"}: ${telephoneVal}
    • `:""} ${location?.email?.value?`
    • ${SDG.Data.storeEmail||"E-Mail"}: ${location.email.value}
    • `:""} ${location.hours?.value?`
    • ${SDG.Data.storeHours||"Hours"}: ${location.hours.value}
    • `:""}
    ${serviceHtml}
    `;const resultNode=new DOMParser().parseFromString(resultHtml,"text/html").body.childNodes[0];resultNode.querySelector(".js-make-my-store-btn").addEventListener("click",e=>{const activeResult=this.querySelector(this.dom.activeResult);activeResult&&(activeResult.dataset.active="false"),e.currentTarget.parentNode.dataset.active="true",this.selectPreferredLocation()}),this.results.append(resultNode),resultCount++}else{resultHtml=`
    ${SDG.Data.myStore}
    ${location.name}
    ${location.distance}
    ${setCityAndStateHTML(location)}
    ${availabilityHtml}
    `;const openAcc=el=>{el.setAttribute("aria-expanded",!0),el.classList.add(this.cls.active)},closeAcc=el=>{el.setAttribute("aria-expanded",!1),el.classList.remove(this.cls.active)},resultNode=new DOMParser().parseFromString(resultHtml,"text/html").body.childNodes[0],$accButton=resultNode?.querySelector(this.dom.acc_button)||null,$accIcon=resultNode?.querySelector(this.dom.acc_icon)||null,$accDetails=resultNode?.querySelector(this.dom.acc_details)||null;resultNode.addEventListener("click",e=>{const activeResult=this.querySelector(this.dom.activeResult);activeResult&&(activeResult.dataset.active="false"),e.currentTarget.dataset.active="true"}),$accButton&&$accDetails&&$accButton.addEventListener("click",()=>{$accDetails.classList.contains(this.cls.active)?(closeAcc($accDetails),$accIcon&&closeAcc($accIcon)):(openAcc($accDetails),$accIcon&&openAcc($accIcon)),$accButton.setAttribute("data-acc",!0)}),this.results.append(resultNode),resultCount++}});let resultsText="";nearbyValue===""?this.storeLocator.myCoords?resultCount>1||resultCount===0?resultsText=this.resultsCount.dataset.resultsNearYou:resultsText=this.resultsCount.dataset.resultNearYou:resultCount>1||resultCount===0?resultsText=this.resultsCount.dataset.results:resultsText=this.resultsCount.dataset.result:resultCount>1||resultCount===0?resultsText=`${this.resultsCount.dataset.resultsNear} "${nearbyValue}"`:resultsText=`${this.resultsCount.dataset.resultNear} "${nearbyValue}"`,this.resultsCount.innerHTML=`${resultCount} ${resultsText}`,resultCount===0&&(this.results.innerHTML=`
    ${this.resultsCount.dataset.noResultsFound}
    `),this.loading.classList.add("hidden"),this.results.scrollTop=0}handleBodyClick(evt){const target=evt.target;target.classList.contains("js-my-store-locator-search-drawer-launcher")||(target!==this&&!target.closest("my-store-locator-drawer")&&!target.closest(".js-my-store-locator-btn")&&!target.classList.contains("js-my-store-locator-btn")&&!target.classList.contains("js-my-store-locator-drawer-btn")&&this.hide(),this.suggestions.classList.add("hidden"))}hide(){this.removeAttribute("open"),document.body.removeEventListener("click",this.onBodyClick),document.documentElement.classList.remove("overflow-hidden"),removeTrapFocus(this.focusElement)}show(focusElement){focusElement.dataset?.itemKey?document.querySelectorAll(this.dom.productInfo).forEach(productInfo=>{productInfo.dataset.itemKey===focusElement.dataset.itemKey?productInfo.classList.remove("hidden"):productInfo.classList.add("hidden")}):focusElement.dataset?.productInfo==="false"&&document.querySelectorAll(this.dom.productInfo).forEach(productInfo=>{productInfo.classList.add("hidden")}),this.setAttribute("data-hide-availability",focusElement.dataset?.hideAvailability||!1),this.focusElement=focusElement,this.setAttribute("open",""),document.body.addEventListener("click",this.onBodyClick),document.documentElement.classList.add("overflow-hidden"),trapFocus(this)}}); //# sourceMappingURL=/cdn/shop/t/39/assets/my-store-locator.js.map?v=171361833911529329811739212717