diff --git a/app/javascript/controllers/application.js b/app/javascript/controllers/application.js index cff6edbe2..1213e85c7 100644 --- a/app/javascript/controllers/application.js +++ b/app/javascript/controllers/application.js @@ -6,13 +6,4 @@ const application = Application.start() application.debug = false window.Stimulus = application -// google map script tag calls this method via callback param when finished loading -// this creates a custom event that is being listened to in the view to build map -// without this google-map controller JS runs before google is available and fails -window.initMap = () => { - console.log('initMap was called'); - const event = new Event("MapLoaded", {"bubbles":true, "cancelable":false}); - window.dispatchEvent(event) -} - export { application } diff --git a/app/javascript/controllers/google_map_controller.js b/app/javascript/controllers/google_map_controller.js deleted file mode 100644 index 24188c181..000000000 --- a/app/javascript/controllers/google_map_controller.js +++ /dev/null @@ -1,52 +0,0 @@ -import { Controller } from "@hotwired/stimulus"; - -// Connects to data-controller="google-map" -export default class extends Controller { - static targets = ["map", "listings"]; - - connect() { - if (window.google) { - this.initGoogle(); - } - } - - // this also executes when the custom event is triggered by google api callback param - initGoogle() { - const map = new google.maps.Map(this.mapTarget, { - zoom: 4, - // this lat and lng centers Canada and US in the map - center: { lat: 44.368888, lng: -99.996246 }, - }); - this.addMarkers(map); - } - - addMarkers(map) { - Array.from(this.listingsTarget.children).forEach((listing) => { - const marker = new google.maps.Marker({ - position: { - lat: parseFloat(listing.dataset.lat), - lng: parseFloat(listing.dataset.lon), - }, - pet: { - name: listing.dataset.name, - breed: listing.dataset.breed, - }, - map, - }); - this.setClickableMarker(marker, map); - }); - } - - // make the marker clickable and show an info window - setClickableMarker(marker, map) { - marker.addListener("click", () => { - const infoWindow = new google.maps.InfoWindow({ - content: ` -
${marker.pet.breed}
- `, - }); - infoWindow.open(map, marker); - }); - } -}