{
  "version": 3,
  "sources": ["../../../../Frontend/src/scripts/frontend/office-overview.js"],
  "sourcesContent": ["\uFEFFlet map;\r\nlet previousInfowindow = null;\r\nlet markers = [];\r\nconst centerOfBelgium = {\r\n\tlat: 50.503887,\r\n\tlng: 4.469936\r\n}\r\nconst mapMarker = document.currentScript.dataset.mapMarker;\r\nconst tooltipAddress = document.currentScript.dataset.tooltipAddress;\r\nconst tooltipEmail = document.currentScript.dataset.tooltipEmail;\r\nconst tooltipPhoneNumber = document.currentScript.dataset.tooltipPhoneNumber;\r\nconst tooltipButtonColor = document.currentScript.dataset.tooltipButtonColor;\r\nconst tooltipButton = document.currentScript.dataset.tooltipButton;\r\n\r\nfunction initMap() {\r\n\tmap = new google.maps.Map(document.getElementById(\"map\"), {\r\n\t\tzoom: 8,\r\n\t\tcenter: centerOfBelgium\r\n\t});\r\n\r\n\tdocument.querySelectorAll('*[data-umb-id]').forEach((element) => {\r\n\t\tconst dataset = element.dataset;\r\n\t\tconst coords = {\r\n\t\t\tlat: parseFloat(dataset.lat),\r\n\t\t\tlng: parseFloat(dataset.lng),\r\n\t\t};\r\n\r\n\r\n\t\tlet contentString = `\r\n        <div class=\"flex flex-col gap-4 text-left\">\r\n            <span class=\"font-semibold text-lg text-primary\">${dataset.name}</span>\r\n\r\n            <div class=\"flex flex-col\">\r\n                <span class=\"font-medium\">${tooltipAddress}</span>\r\n                <a class=\"flex flex-col w-fit underline\" href=\"https://www.google.com/maps/dir/?api=1&destination=${dataset.street}%2C+${dataset.city}\" target=\"_blank\">\r\n                \t<span>${dataset.street}</span>\r\n                \t<span>${dataset.postalcode} ${dataset.city}</span>\r\n\t\t\t\t</a>\r\n            </div>\r\n\t\t\t\r\n\t\t\t${dataset.email &&\r\n\t\t\t`<div class=\"flex flex-col\">\r\n\t\t\t\t<span class=\"font-medium\">${tooltipEmail}</span>\r\n\t\t\t\t<a class=\"underline\" href=\"mailto:${dataset.email}\">\r\n\t\t\t\t\t${dataset.email}\r\n\t\t\t\t</a>\r\n\t\t\t</div>`\r\n\t\t\t}\r\n\r\n            <div class=\"flex flex-col\">\r\n                <span class=\"font-medium\">${tooltipPhoneNumber}</span>\r\n                <a class=\"underline\" href=\"tel:${dataset.phonenumber}\">\r\n                \t${dataset.phonenumber}\r\n                </a>\r\n            </div>\r\n\r\n            <a \r\n            href=\"${dataset.url}\"\r\n            style=\"--markerTooltipButtonColor:  #${tooltipButtonColor}\"\r\n            class=\"office-tooltipButton\">\r\n                ${tooltipButton}\r\n            </a>\r\n        </div>\r\n        `;\r\n\r\n\t\tconst infowindow = new google.maps.InfoWindow({\r\n\t\t\tcontent: contentString\r\n\t\t});\r\n\r\n\r\n\t\tconst marker = new google.maps.Marker({\r\n\t\t\tposition: coords,\r\n\t\t\tmap,\r\n\t\t\ticon: mapMarker,\r\n\t\t});\r\n\r\n\t\tlistenMarker(marker, map, infowindow);\r\n\t\tmarkers.push(marker);\r\n\t});\r\n}\r\n\r\nfunction listenMarker(marker, map, infowindow) {\r\n\tgoogle.maps.event.addListener(marker, 'click', function () {\r\n\t\tif (previousInfowindow) {\r\n\r\n\t\t\tpreviousInfowindow.close()\r\n\t\t}\r\n\r\n\t\tpreviousInfowindow = infowindow;\r\n\r\n\t\tinfowindow.open(map, marker);\r\n\t});\r\n}\r\n\r\nwindow.initOfficeOverviewMap = initMap;\r\n\r\ndocument.addEventListener('alpine:init', () => {\r\n\tAlpine.data('googleMaps', () => ({\r\n\t\tlocation: '',\r\n\t\tlatitude: 0,\r\n\t\tlongitude: 0,\r\n\t\tfindMyLocationLoading: false,\r\n\t\tshowLocationError: false,\r\n\r\n\t\tasync init() {\r\n\t\t\tif (typeof window.google === 'undefined') {\r\n\t\t\t\tdocument.addEventListener('google:init', async () => {\r\n\t\t\t\t\tawait this.initAutocomplete();\r\n\t\t\t\t})\r\n\t\t\t} else {\r\n\t\t\t\tawait this.initAutocomplete();\r\n\t\t\t}\r\n\t\t},\r\n\r\n\t\tasync initAutocomplete() {\r\n\t\t\tawait agilitas.googleMaps.initialize((place) => {\r\n\t\t\t\tthis.showLocationError = false;\r\n\t\t\t\tthis.location = place.name;\r\n\r\n\t\t\t\tmap.setZoom(12);\r\n\t\t\t\tmap.panTo({ lat: place.lat, lng: place.lng })\r\n\t\t\t\tthis.latitude = 0;\r\n\t\t\t\tthis.longitude = 0;\r\n\t\t\t});\r\n\t\t},\r\n\r\n\t\tasync findMyLocation() {\r\n\t\t\tthis.showLocationError = false;\r\n\r\n\t\t\ttry {\r\n\t\t\t\tthis.findMyLocationLoading = true;\r\n\t\t\t\tconst { name, latitude, longitude } = await agilitas.googleMaps.getLocation();\r\n\r\n\t\t\t\tthis.location = name;\r\n\r\n\t\t\t\tmap.setZoom(12);\r\n\t\t\t\tmap.panTo({ lat: latitude, lng: longitude })\r\n\t\t\t} catch (error) {\r\n\t\t\t\tconsole.error('An error occured while retrieving current location', error);\r\n\t\t\t} finally {\r\n\t\t\t\tthis.findMyLocationLoading = false;\r\n\t\t\t\tthis.latitude = 0;\r\n\t\t\t\tthis.longitude = 0;\r\n\t\t\t}\r\n\t\t},\r\n\t\tsearchLocation() {\r\n\t\t\tthis.showLocationError = false;\r\n\r\n\t\t\tif (this.latitude === 0 && this.longitude === 0) {\r\n\t\t\t\tconst geocoder = new google.maps.Geocoder();\r\n\t\t\t\tgeocoder.geocode({ 'address': this.location }, (results, status) => {\r\n\t\t\t\t\tif (status === \"OK\") {\r\n\t\t\t\t\t\tmap.setZoom(12);\r\n\t\t\t\t\t\tmap.panTo(results[0].geometry.location)\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tthis.showLocationError = true\r\n\t\t\t\t\t}\r\n\t\t\t\t})\r\n\t\t\t}\r\n\t\t},\r\n\t}));\r\n});"],
  "mappings": "MAAC,IAAIA,EACDC,EAAqB,KACrBC,EAAU,CAAC,EACTC,EAAkB,CACvB,IAAK,UACL,IAAK,QACN,EACMC,EAAY,SAAS,cAAc,QAAQ,UAC3CC,EAAiB,SAAS,cAAc,QAAQ,eAChDC,EAAe,SAAS,cAAc,QAAQ,aAC9CC,EAAqB,SAAS,cAAc,QAAQ,mBACpDC,EAAqB,SAAS,cAAc,QAAQ,mBACpDC,EAAgB,SAAS,cAAc,QAAQ,cAErD,SAASC,GAAU,CAClBV,EAAM,IAAI,OAAO,KAAK,IAAI,SAAS,eAAe,KAAK,EAAG,CACzD,KAAM,EACN,OAAQG,CACT,CAAC,EAED,SAAS,iBAAiB,gBAAgB,EAAE,QAASQ,GAAY,CAChE,IAAMC,EAAUD,EAAQ,QAClBE,EAAS,CACd,IAAK,WAAWD,EAAQ,GAAG,EAC3B,IAAK,WAAWA,EAAQ,GAAG,CAC5B,EAGIE,EAAgB;AAAA;AAAA,+DAEyCF,EAAQ;AAAA;AAAA;AAAA,4CAG3BP;AAAA,oHACwEO,EAAQ,aAAaA,EAAQ;AAAA,yBACxHA,EAAQ;AAAA,yBACRA,EAAQ,cAAcA,EAAQ;AAAA;AAAA;AAAA;AAAA,KAIlDA,EAAQ,OACV;AAAA,gCAC6BN;AAAA,wCACQM,EAAQ;AAAA,OACzCA,EAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,4CAM6BL;AAAA,iDACKK,EAAQ;AAAA,mBACtCA,EAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKPA,EAAQ;AAAA,mDACuBJ;AAAA;AAAA,kBAEjCC;AAAA;AAAA;AAAA,UAKVM,EAAa,IAAI,OAAO,KAAK,WAAW,CAC7C,QAASD,CACV,CAAC,EAGKE,EAAS,IAAI,OAAO,KAAK,OAAO,CACrC,SAAUH,EACV,IAAAb,EACA,KAAMI,CACP,CAAC,EAEDa,EAAaD,EAAQhB,EAAKe,CAAU,EACpCb,EAAQ,KAAKc,CAAM,CACpB,CAAC,CACF,CAEA,SAASC,EAAaD,EAAQhB,EAAKe,EAAY,CAC9C,OAAO,KAAK,MAAM,YAAYC,EAAQ,QAAS,UAAY,CACtDf,GAEHA,EAAmB,MAAM,EAG1BA,EAAqBc,EAErBA,EAAW,KAAKf,EAAKgB,CAAM,CAC5B,CAAC,CACF,CAEA,OAAO,sBAAwBN,EAE/B,SAAS,iBAAiB,cAAe,IAAM,CAC9C,OAAO,KAAK,aAAc,KAAO,CAChC,SAAU,GACV,SAAU,EACV,UAAW,EACX,sBAAuB,GACvB,kBAAmB,GAEnB,MAAM,MAAO,CACR,OAAO,OAAO,OAAW,IAC5B,SAAS,iBAAiB,cAAe,SAAY,CACpD,MAAM,KAAK,iBAAiB,CAC7B,CAAC,EAED,MAAM,KAAK,iBAAiB,CAE9B,EAEA,MAAM,kBAAmB,CACxB,MAAM,SAAS,WAAW,WAAYQ,GAAU,CAC/C,KAAK,kBAAoB,GACzB,KAAK,SAAWA,EAAM,KAEtBlB,EAAI,QAAQ,EAAE,EACdA,EAAI,MAAM,CAAE,IAAKkB,EAAM,IAAK,IAAKA,EAAM,GAAI,CAAC,EAC5C,KAAK,SAAW,EAChB,KAAK,UAAY,CAClB,CAAC,CACF,EAEA,MAAM,gBAAiB,CACtB,KAAK,kBAAoB,GAEzB,GAAI,CACH,KAAK,sBAAwB,GAC7B,GAAM,CAAE,KAAAC,EAAM,SAAAC,EAAU,UAAAC,CAAU,EAAI,MAAM,SAAS,WAAW,YAAY,EAE5E,KAAK,SAAWF,EAEhBnB,EAAI,QAAQ,EAAE,EACdA,EAAI,MAAM,CAAE,IAAKoB,EAAU,IAAKC,CAAU,CAAC,CAC5C,OAASC,EAAP,CACD,QAAQ,MAAM,qDAAsDA,CAAK,CAC1E,QAAE,CACD,KAAK,sBAAwB,GAC7B,KAAK,SAAW,EAChB,KAAK,UAAY,CAClB,CACD,EACA,gBAAiB,CAChB,KAAK,kBAAoB,GAErB,KAAK,WAAa,GAAK,KAAK,YAAc,GAC5B,IAAI,OAAO,KAAK,SAAS,EACjC,QAAQ,CAAE,QAAW,KAAK,QAAS,EAAG,CAACC,EAASC,IAAW,CAC/DA,IAAW,MACdxB,EAAI,QAAQ,EAAE,EACdA,EAAI,MAAMuB,EAAQ,CAAC,EAAE,SAAS,QAAQ,GAEtC,KAAK,kBAAoB,EAE3B,CAAC,CAEH,CACD,EAAE,CACH,CAAC",
  "names": ["map", "previousInfowindow", "markers", "centerOfBelgium", "mapMarker", "tooltipAddress", "tooltipEmail", "tooltipPhoneNumber", "tooltipButtonColor", "tooltipButton", "initMap", "element", "dataset", "coords", "contentString", "infowindow", "marker", "listenMarker", "place", "name", "latitude", "longitude", "error", "results", "status"]
}