{"version":3,"file":"alpine-b5053b4c.js","sources":["../../../../../plugins/soil/src/Core/Blocks/Content/common/locations/alpine.js","../../../../../plugins/soil/node_modules/alpinejs/dist/module.esm.js","../../../../../plugins/soil/node_modules/@alpinejs/collapse/dist/module.esm.js","../../../../../plugins/soil/node_modules/@alpinejs/focus/dist/module.esm.js","../../../../../plugins/soil/assets/js/alpine.js"],"sourcesContent":["if (typeof alpineData !== \"undefined\") {\n function googleReady() {\n document.dispatchEvent(new Event(\"google:init\"));\n }\n document.addEventListener(\"alpine:init\", () => {\n Alpine.data(\"googlePlacesAutocomplete\", () => ({\n showClusters: alpineData.clusters,\n nearestLocation: alpineData.nearest_location,\n linkToLocationPage: alpineData.link_to_location_page,\n panToMarker: alpineData.pan_to_marker,\n panToMarkerZoomlevel: alpineData.pan_to_marker_zoom_level,\n google: {},\n locationsStyle: \"\",\n locations: [],\n markers: [],\n infowindow: null,\n markerCluster: null,\n address: \"\",\n map: null,\n autocomplete: null,\n init() {\n if (typeof window.google === \"undefined\") {\n document.addEventListener(\"google:init\", () => {\n this.initAutocomplete();\n });\n } else {\n this.initAutocomplete();\n }\n },\n async initAutocomplete() {\n const { LatLng, LatLngBounds } = await google.maps.importLibrary(\"core\");\n const { Geocoder } = await google.maps.importLibrary(\"geocoding\");\n const { Map } = await google.maps.importLibrary(\"maps\");\n const { Marker } = await google.maps.importLibrary(\"marker\");\n const { Autocomplete } = await google.maps.importLibrary(\"places\");\n const { InfoWindow } = await google.maps.importLibrary(\"streetView\");\n this.google = {\n LatLng,\n LatLngBounds,\n Geocoder,\n Map,\n Marker,\n Autocomplete,\n InfoWindow,\n };\n\n this.autocomplete = new this.google.Autocomplete(this.$refs.googleAutocomplete, {\n componentRestrictions: {\n country: [\"nl\"],\n },\n });\n this.autocomplete.addListener(\"place_changed\", () => this.handleResponse(this.autocomplete.getPlace()));\n\n this.map = new this.google.Map(this.$refs.googleMap, {\n zoom: 10,\n center: { lat: 52.9640223, lng: 5.7975938 },\n });\n\n this.infowindow = new this.google.InfoWindow();\n this.markerCluster =\n this.showClusters && typeof MarkerClusterer !== \"undefined\"\n ? new MarkerClusterer(this.map, [], {\n styles: [\n {\n textColor: \"white\",\n height: 53,\n width: 53,\n url: alpineData.custom_cluster_image,\n },\n ],\n })\n : null;\n\n // Listen to the resize event for styling the location list.\n window.addEventListener(\"resize\", this.resizeListBox(), { passive: true });\n\n this.getLocations();\n\n if (this.nearestLocation && navigator.geolocation) {\n navigator.geolocation.getCurrentPosition((position) => {\n const geocoder = new this.google.Geocoder();\n const pos = {\n lat: position.coords.latitude,\n lng: position.coords.longitude,\n };\n this.geocodeLatLng(geocoder, pos);\n });\n }\n },\n handleResponse(addressData) {\n // Add a custom marker for the searched location.\n this.pushCustomMarker(\n addressData.formatted_address,\n addressData.geometry.location.lat(),\n addressData.geometry.location.lng(),\n );\n },\n pushCustomMarker(address, lat, lng) {\n // Remove our custom marker if it exists, so we don't have duplicates.\n this.markers = this.markers.filter((marker) => {\n if (marker.custom === true && marker.marker) {\n marker.marker.setVisible(false);\n marker.marker.setMap(null);\n marker.marker.setPosition(null);\n marker.marker = null;\n\n return false;\n }\n\n return true;\n });\n\n const html =\n 'Eigen locatie' +\n address +\n \"\";\n const newMarker = {\n custom: true,\n position: {\n lat,\n lng,\n },\n marker: this.createMarker(lat, lng, html, true, true),\n };\n this.markers.push(newMarker);\n\n this.refreshMap();\n },\n createMarker(lat, lng, html, setMap = false, customIcon = false) {\n const marker = new this.google.Marker({\n position: new this.google.LatLng(lat, lng),\n map: null,\n icon: customIcon ? alpineData.custom_marker_image : null,\n title: html,\n });\n setMap && marker.setMap(this.map);\n\n marker.addListener(\"click\", () => {\n this.infowindow.setContent(html);\n this.infowindow.open(this.map, marker);\n });\n\n return marker;\n },\n refreshMap() {\n if (this.markers.length < 1) {\n return;\n }\n\n const lastMarker = this.markers[this.markers.length - 1];\n if (lastMarker.custom) {\n this.locations = this.locations\n .map((el) => ({\n ...el,\n distance: Math.round(this.haversineDistance(lastMarker.position, el.position) * 1e2) / 1e2,\n }))\n .sort((a, b) => a.distance - b.distance);\n }\n\n // Get the bounds of each marker and fit them to map.\n const bounds = new this.google.LatLngBounds();\n this.locations.forEach((location) => {\n bounds.extend(location.position);\n });\n bounds.extend(lastMarker.position);\n this.map.fitBounds(bounds);\n },\n resultsListClick(location, map, linkToLocationPage, panToMarker, panToMarkerZoomlevel) {\n if (linkToLocationPage) {\n window.location = location.link;\n }\n\n if (!this.linkToLocationPage && panToMarker) {\n map.setZoom(parseInt(panToMarkerZoomlevel));\n map.panTo({\n lat: parseFloat(location.position.lat),\n lng: parseFloat(location.position.lng),\n });\n }\n },\n geocodeLatLng(geocoder, map) {\n geocoder.geocode(\n {\n location: map,\n },\n (results, status) => {\n if (status === \"OK\") {\n if (results[0]) {\n this.address = results[0].formatted_address;\n this.pushCustomMarker(results[0].formatted_address, map.lat, map.lng);\n } else {\n console.log(\"Geen resulaten gevonden.\");\n }\n } else {\n console.log(`Geocoder mislukt: ${status}`);\n }\n },\n );\n },\n getLocations() {\n let locations = alpineData.locations;\n // Add a marker for each location.\n locations.forEach((item) => {\n const location = {\n custom: false,\n id: item.id,\n title: item.title,\n excerpt: item.excerpt,\n thumbnail: item.thumbnail,\n link: item.link,\n address: item.address ?? \"\",\n position: {\n lat: parseFloat(item.acf.map.lat),\n lng: parseFloat(item.acf.map.lng),\n },\n };\n this.locations.push(location);\n\n const html =\n '' +\n location.title +\n '' +\n location.address +\n \"\";\n const newMarker = {\n custom: false,\n position: {\n lat: parseFloat(item.acf.map.lat),\n lng: parseFloat(item.acf.map.lng),\n },\n marker: this.createMarker(\n parseFloat(item.acf.map.lat),\n parseFloat(item.acf.map.lng),\n html,\n !this.showClusters,\n ),\n };\n this.markers.push(newMarker);\n this.showClusters && this.markerCluster?.addMarker(newMarker.marker, item.title);\n });\n\n this.refreshMap();\n },\n resizeListBox() {\n const heightString = this.$refs.locations.clientHeight - 32 + \"px\";\n this.locationsStyle = {\n overflowY: \"scroll\",\n height: heightString,\n };\n },\n haversineDistance(coords1, coords2) {\n function toRad(x) {\n return (x * Math.PI) / 180;\n }\n\n const lat1 = coords1.lat;\n const lon1 = coords1.lng;\n const lat2 = coords2.lat;\n const lon2 = coords2.lng;\n\n const R = 6371; // km\n\n const x1 = lat2 - lat1;\n const dLat = toRad(x1);\n const x2 = lon2 - lon1;\n const dLon = toRad(x2);\n const a =\n Math.sin(dLat / 2) * Math.sin(dLat / 2) +\n Math.cos(toRad(lat1)) * Math.cos(toRad(lat2)) * Math.sin(dLon / 2) * Math.sin(dLon / 2);\n const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));\n const d = R * c;\n\n return d;\n },\n }));\n });\n}\n","// packages/alpinejs/src/scheduler.js\nvar flushPending = false;\nvar flushing = false;\nvar queue = [];\nvar lastFlushedIndex = -1;\nfunction scheduler(callback) {\n queueJob(callback);\n}\nfunction queueJob(job) {\n if (!queue.includes(job))\n queue.push(job);\n queueFlush();\n}\nfunction dequeueJob(job) {\n let index = queue.indexOf(job);\n if (index !== -1 && index > lastFlushedIndex)\n queue.splice(index, 1);\n}\nfunction queueFlush() {\n if (!flushing && !flushPending) {\n flushPending = true;\n queueMicrotask(flushJobs);\n }\n}\nfunction flushJobs() {\n flushPending = false;\n flushing = true;\n for (let i = 0; i < queue.length; i++) {\n queue[i]();\n lastFlushedIndex = i;\n }\n queue.length = 0;\n lastFlushedIndex = -1;\n flushing = false;\n}\n\n// packages/alpinejs/src/reactivity.js\nvar reactive;\nvar effect;\nvar release;\nvar raw;\nvar shouldSchedule = true;\nfunction disableEffectScheduling(callback) {\n shouldSchedule = false;\n callback();\n shouldSchedule = true;\n}\nfunction setReactivityEngine(engine) {\n reactive = engine.reactive;\n release = engine.release;\n effect = (callback) => engine.effect(callback, { scheduler: (task) => {\n if (shouldSchedule) {\n scheduler(task);\n } else {\n task();\n }\n } });\n raw = engine.raw;\n}\nfunction overrideEffect(override) {\n effect = override;\n}\nfunction elementBoundEffect(el) {\n let cleanup2 = () => {\n };\n let wrappedEffect = (callback) => {\n let effectReference = effect(callback);\n if (!el._x_effects) {\n el._x_effects = /* @__PURE__ */ new Set();\n el._x_runEffects = () => {\n el._x_effects.forEach((i) => i());\n };\n }\n el._x_effects.add(effectReference);\n cleanup2 = () => {\n if (effectReference === void 0)\n return;\n el._x_effects.delete(effectReference);\n release(effectReference);\n };\n return effectReference;\n };\n return [wrappedEffect, () => {\n cleanup2();\n }];\n}\nfunction watch(getter, callback) {\n let firstTime = true;\n let oldValue;\n let effectReference = effect(() => {\n let value = getter();\n JSON.stringify(value);\n if (!firstTime) {\n queueMicrotask(() => {\n callback(value, oldValue);\n oldValue = value;\n });\n } else {\n oldValue = value;\n }\n firstTime = false;\n });\n return () => release(effectReference);\n}\n\n// packages/alpinejs/src/utils/dispatch.js\nfunction dispatch(el, name, detail = {}) {\n el.dispatchEvent(\n new CustomEvent(name, {\n detail,\n bubbles: true,\n // Allows events to pass the shadow DOM barrier.\n composed: true,\n cancelable: true\n })\n );\n}\n\n// packages/alpinejs/src/utils/walk.js\nfunction walk(el, callback) {\n if (typeof ShadowRoot === \"function\" && el instanceof ShadowRoot) {\n Array.from(el.children).forEach((el2) => walk(el2, callback));\n return;\n }\n let skip = false;\n callback(el, () => skip = true);\n if (skip)\n return;\n let node = el.firstElementChild;\n while (node) {\n walk(node, callback, false);\n node = node.nextElementSibling;\n }\n}\n\n// packages/alpinejs/src/utils/warn.js\nfunction warn(message, ...args) {\n console.warn(`Alpine Warning: ${message}`, ...args);\n}\n\n// packages/alpinejs/src/lifecycle.js\nvar started = false;\nfunction start() {\n if (started)\n warn(\"Alpine has already been initialized on this page. Calling Alpine.start() more than once can cause problems.\");\n started = true;\n if (!document.body)\n warn(\"Unable to initialize. Trying to load Alpine before `
` is available. Did you forget to add `defer` in Alpine's `