From a9bb9c49fcde1eb9ae55a6117cb85463889c6649 Mon Sep 17 00:00:00 2001 From: frankpagan Date: Tue, 24 Dec 2024 18:35:39 -0600 Subject: [PATCH] feat: reverse geocoding intergration --- demo/autocomplete.html | 481 +++++++++++------------------------------ demo/index.html | 161 ++++++++++++++ src/index.js | 56 ++++- 3 files changed, 345 insertions(+), 353 deletions(-) create mode 100644 demo/index.html diff --git a/demo/autocomplete.html b/demo/autocomplete.html index 698bda7..f47064f 100644 --- a/demo/autocomplete.html +++ b/demo/autocomplete.html @@ -1,358 +1,135 @@ - - - Google Search Autocomplete - - + + + + Google Maps API Demo + + +
+ + + + + +
- - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Establishment - -
Address 1 - -
City - - Region / Country - -
Location - - Route - -
Street Number - - Postal Code - -
Locality - - Country Code - -
State - -
Latitude - - Longitude - -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Establishment - -
Address 2 - -
City - - Region / Country - -
Location - - Route - -
Street Number - - Postal Code - -
Locality - - Country Code - -
State - -
Latitude - - Longitude - -
-
-
- -
- - - - - - - - - +
+ +
- + + - - - - + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + diff --git a/demo/index.html b/demo/index.html new file mode 100644 index 0000000..7d37c05 --- /dev/null +++ b/demo/index.html @@ -0,0 +1,161 @@ + + + + + + Google Maps API + + +
+ + + + + +
+ +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + + +
+ + + + diff --git a/src/index.js b/src/index.js index a181214..4235df4 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,6 @@ import Observer from "@cocreate/observer"; +import Actions from "@cocreate/actions"; +import Api from "@cocreate/api"; const name = "google-maps"; const GOOGLE_API_KEY = "AIzaSyCXRaA3liul4_0D5MXLybx9s3s_o_Q2opI"; @@ -93,7 +95,7 @@ const googleMapsHandlers = { autocomplete.addListener("place_changed", () => { const data = { [name]: autocomplete.getPlace() }; let form = element.closest("form"); - CoCreate.api.setData({ name, method, form }, data); + CoCreate.api.setData({ name, method, form, data }); }); } }, @@ -126,6 +128,47 @@ const googleMapsHandlers = { } }; +googleMapsHandlers.geocoder = async (action) => { + if (typeof action === "string") return; + let { method, element, key } = action; + + await loadLibrary("geocoding"); // Ensure the Geocoding library is loaded + + const geocoder = new google.maps.Geocoder(); + + // Fetch the data directly from the form or element + const form = element.closest("form"); + const data = await CoCreate.api.getData({ name, method, element, form }); + + // Directly pass the data to geocoder.geocode() + geocoder.geocode(data, (response, status) => { + if (status === "OK" && response[0]) { + const data = { + [name]: { response } + }; + CoCreate.api.setData({ + name, + method, + form, + data + }); + dispatchEvent(action); + } else { + console.error(`Geocoding failed with status: ${status}`); + } + }); +}; + +function dispatchEvent(action) { + document.dispatchEvent( + new CustomEvent(action.endEvent, { + detail: { + data: action + } + }) + ); +} + function getOrCreateMap(element, options = {}) { // Check if this element already has a map instance if (element.googleMapInstance) { @@ -158,6 +201,17 @@ Observer.init({ } }); +// Actions Integration +Actions.init([ + { + name: "googlemaps", + endEvent: "googlemaps", + callback(action) { + googleMapsHandlers[action.method](action); + } + } +]); + init(); export default { init };