65 lines
1.6 KiB
JavaScript
65 lines
1.6 KiB
JavaScript
/**
|
|
* @license
|
|
* Copyright 2019 Google LLC. All Rights Reserved.
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
|
|
let autocomplete;
|
|
let address1Field;
|
|
let address2Field;
|
|
let postalField;
|
|
|
|
function initAutocomplete() {
|
|
address1Field = document.querySelector("#subscriber_address_1");
|
|
address2Field = document.querySelector("#subscriber_address_2");
|
|
postalField = document.querySelector("#subscriber_zip");
|
|
autocomplete = new google.maps.places.Autocomplete(address1Field, {
|
|
componentRestrictions: { country: ["us", "ca"] },
|
|
fields: ["address_components", "geometry"],
|
|
types: ["address"],
|
|
});
|
|
address1Field.focus();
|
|
autocomplete.addListener("place_changed", fillInAddress);
|
|
}
|
|
|
|
function fillInAddress() {
|
|
const place = autocomplete.getPlace();
|
|
let address1 = "";
|
|
let postcode = "";
|
|
|
|
for (const component of place.address_components) {
|
|
const componentType = component.types[0];
|
|
|
|
switch (componentType) {
|
|
case "street_number": {
|
|
address1 = `${component.long_name} ${address1}`;
|
|
break;
|
|
}
|
|
|
|
case "route": {
|
|
address1 += component.short_name;
|
|
break;
|
|
}
|
|
|
|
case "postal_code": {
|
|
postcode = `${component.long_name}${postcode}`;
|
|
break;
|
|
}
|
|
|
|
case "locality":
|
|
document.querySelector("#subscriber_city").value = component.long_name;
|
|
break;
|
|
case "administrative_area_level_1": {
|
|
document.querySelector("#subscriber_state").value = component.short_name;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
address1Field.value = address1;
|
|
postalField.value = postcode;
|
|
address2Field.focus();
|
|
}
|
|
|
|
window.initAutocomplete = initAutocomplete;
|