diff --git a/src/components/LocationAutocompleteInput/GeocoderGoogleMaps.js b/src/components/LocationAutocompleteInput/GeocoderGoogleMaps.js index fa645d9e..1ba4f2a5 100644 --- a/src/components/LocationAutocompleteInput/GeocoderGoogleMaps.js +++ b/src/components/LocationAutocompleteInput/GeocoderGoogleMaps.js @@ -1,8 +1,11 @@ import React from 'react'; +// import { types as sdkTypes } from '../../util/sdkLoader'; import { getPlacePredictions, getPlaceDetails, locationBounds } from '../../util/googleMaps'; import { userLocation } from '../../util/maps'; import css from './LocationAutocompleteInput.css'; +// const { LatLng: SDKLatLng, LatLngBounds: SDKLatLngBounds } = sdkTypes; + export const CURRENT_LOCATION_ID = 'current-location'; const CURRENT_LOCATION_BOUNDS_DISTANCE = 1000; // meters @@ -10,29 +13,24 @@ const CURRENT_LOCATION_BOUNDS_DISTANCE = 1000; // meters // focuses on the autocomplete input without typing a search. This can // be used to reduce typing and Geocoding API calls for common // searches. -// -// Example: -// -// [ -// { -// place_id: 'Place ID from Google Maps Places API', -// description: 'Place name to show in the autocomplete dropdown', -// }, -// ] -// -// To know which values to set as defaults, log a real prediction -// object from the Places API call and copy the Place ID from the -// response. export const defaultPredictions = [ - // // Current user location + // Examples: + // Current user location from the browser geolocation API // { - // place_id: CURRENT_LOCATION_ID, - // // LocationAutocompleteInputImpl adds the text from the translations - // description: '', + // id: CURRENT_LOCATION_ID, + // predictionPlace: {}, // }, + // Helsinki // { - // place_id: 'ChIJkQYhlscLkkYRY_fiO4S9Ts0', - // description: 'Helsinki, Finland', + // id: 'default-helsinki', + // predictionPlace: { + // address: 'Helsinki, Finland', + // origin: new SDKLatLng(60.16985, 24.93837), + // bounds: new SDKLatLngBounds( + // new SDKLatLng(60.29783, 25.25448), + // new SDKLatLng(59.92248, 24.78287) + // ), + // }, // }, ]; @@ -81,6 +79,11 @@ class GeocoderGoogleMaps { * Get the ID of the given prediction. */ getPredictionId(prediction) { + if (prediction.predictionPlace) { + // default prediction defined above + return prediction.id; + } + // prediction from Google Maps Places API return prediction.place_id; } @@ -88,6 +91,11 @@ class GeocoderGoogleMaps { * Get the address text of the given prediction. */ getPredictionAddress(prediction) { + if (prediction.predictionPlace) { + // default prediction defined above + return prediction.predictionPlace.address; + } + // prediction from Google Maps Places API return prediction.description; } @@ -109,6 +117,10 @@ class GeocoderGoogleMaps { }); } + if (prediction.predictionPlace) { + return Promise.resolve(prediction.predictionPlace); + } + return getPlaceDetails(prediction.place_id, this.getSessionToken()).then(place => { this.sessionToken = null; return place; diff --git a/src/components/LocationAutocompleteInput/GeocoderMapbox.js b/src/components/LocationAutocompleteInput/GeocoderMapbox.js index 70c0ea47..9c545824 100644 --- a/src/components/LocationAutocompleteInput/GeocoderMapbox.js +++ b/src/components/LocationAutocompleteInput/GeocoderMapbox.js @@ -15,10 +15,6 @@ const locationBounds = (latlng, distance) => { ); }; -const placeId = prediction => prediction.id; - -const placeAddress = prediction => prediction.place_name; - const placeOrigin = prediction => { if (prediction && Array.isArray(prediction.center) && prediction.center.length === 2) { // Coordinates in Mapbox features are represented as [longitude, latitude]. @@ -42,33 +38,24 @@ const placeBounds = prediction => { // focuses on the autocomplete input without typing a search. This can // be used to reduce typing and Geocoding API calls for common // searches. -// -// Example: -// -// [ -// { -// id: 'any unique id', -// place_name: 'Place name to show in the autocomplete dropdown', -// center: [longitude, latitude], -// bbox: [minX, minY, maxX, maxY], -// }, -// ] -// -// To know which values to set as defaults, log a real prediction -// object from the Geocoding API call and check the values from the -// response. export const defaultPredictions = [ - // // Current user location + // Examples: + // Current user location from the browser geolocation API // { // id: CURRENT_LOCATION_ID, - // // LocationAutocompleteInputImpl adds the text from the translations - // place_name: '', + // predictionPlace: {}, // }, + // Helsinki // { // id: 'default-helsinki', - // place_name: 'Helsinki, Finland', - // center: [24.94861, 60.17333], - // bbox: [24.82617, 60.075361, 25.313112, 60.297839], + // predictionPlace: { + // address: 'Helsinki, Finland', + // origin: new SDKLatLng(60.16985, 24.93837), + // bounds: new SDKLatLngBounds( + // new SDKLatLng(60.29783, 25.25448), + // new SDKLatLng(59.92248, 24.78287) + // ), + // }, // }, ]; @@ -118,14 +105,19 @@ class GeocoderMapbox { * Get the ID of the given prediction. */ getPredictionId(prediction) { - return placeId(prediction); + return prediction.id; } /** * Get the address text of the given prediction. */ getPredictionAddress(prediction) { - return placeAddress(prediction); + if (prediction.predictionPlace) { + // default prediction defined above + return prediction.predictionPlace.address; + } + // prediction from Mapbox geocoding API + return prediction.place_name; } /** @@ -146,8 +138,12 @@ class GeocoderMapbox { }); } + if (prediction.predictionPlace) { + return Promise.resolve(prediction.predictionPlace); + } + return Promise.resolve({ - address: placeAddress(prediction), + address: this.getPredictionAddress(prediction), origin: placeOrigin(prediction), bounds: placeBounds(prediction), });