Skip to content

Commit

Permalink
google address auto complete improvements
Browse files Browse the repository at this point in the history
  • Loading branch information
RensTillmann committed Jan 6, 2021
1 parent da4b172 commit 4f17634
Show file tree
Hide file tree
Showing 8 changed files with 187 additions and 59 deletions.
8 changes: 7 additions & 1 deletion docs/changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,13 @@

- [PDF Generator Add-on](https://renstillmann.github.io/super-forms/#/pdf-generator-add-on)

## Jan 04, 2020 - Version 4.9.572

## Jan 06, 2021 - Version 4.9.573

- **Added:** Option for google autocomplete to return `The place's name`, `Formatted phone number`, `International phone number` and `Website of the business`
- **Improved:** When using google autocomplete the code will now determine what data is being used in your form, and strip out any unnecessary data from the API request which could considerably reduce costs

## Jan 04, 2021 - Version 4.9.572

- **Fix:** Builder UI scrolling bug in Firefox browser causing a continues scroll
- **Fix:** When selecting default items for `Dropdown` element it would still display the placeholder instead of the actual selected item
Expand Down
12 changes: 7 additions & 5 deletions src/assets/css/backend/create-form.css
Original file line number Diff line number Diff line change
Expand Up @@ -1513,7 +1513,7 @@
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #F9F9F9;
padding: 5px 5px 30px 5px;
padding: 5px 5px 5px 5px;
margin-bottom: 5px;
position: relative;
min-height: 60px;
Expand All @@ -1532,12 +1532,14 @@
}

.super-element-settings .super-multi-items.address-auto-popuplate-item>strong {
width: 100px;
max-width: 33%;
width: 100%;
max-width: 100%;
margin: 0px 0px 5px 0px;
font-size: 12px;
}

.super-element-settings .super-multi-items.address-auto-popuplate-item * {
width: 33%;
width: 48%;
}

.super-element-settings .super-multi-items>p {
Expand Down Expand Up @@ -2668,4 +2670,4 @@
.super-secrets input.super-error {
border:1px solid #ff3939;
background-color:#ffecec;
}
}
2 changes: 2 additions & 0 deletions src/assets/js/backend/create-form.js
Original file line number Diff line number Diff line change
Expand Up @@ -1924,8 +1924,10 @@
if ($minimized === 'undefined') $minimized = 'no';
if ($minimized == 'yes') {
$this.attr('data-minimized', 'no').removeClass('super-minimized');
$(this).tooltipster('content', 'Minimize');
} else {
$this.attr('data-minimized', 'yes').addClass('super-minimized');
$(this).tooltipster('content', 'Maximize');
}
SUPER.init_resize_element_labels();
SUPER.init_drag_and_drop();
Expand Down
204 changes: 156 additions & 48 deletions src/assets/js/common.js
Original file line number Diff line number Diff line change
Expand Up @@ -4651,6 +4651,51 @@ function SUPERreCaptcha(){
field.classList.add('super-autopopulate-init');
obj = {};
var autocomplete = new google.maps.places.Autocomplete( field );

var mapping = {
street_number: 'street_number',
route: 'street_name',
locality: 'city',
administrative_area_level_2: 'municipality',
administrative_area_level_1: 'state',
country: 'country',
postal_code: 'postal_code',
lat: 'lat',
lng: 'lng'
};

// Check if any of the address components is mapped
var $returnAddressComponent = false;
for (var key in mapping) {
if($(field).data('map-'+mapping[key])){
$returnAddressComponent = true;
}
}

var $returnName = false;
if($(field).data('map-name')) $returnName = true;

mapping.formatted_phone_number = 'formatted_phone_number';
var $returnFormattedPhoneNumber = false;
if($(field).data('map-formatted_phone_number')) $returnFormattedPhoneNumber = true;

mapping.international_phone_number = 'international_phone_number';
var $returnInternationalPhoneNumber = false;
if($(field).data('map-international_phone_number')) $returnInternationalPhoneNumber = true;

mapping.website = 'website';
var $returnWebsite = false;
if($(field).data('map-website')) $returnWebsite = true;

var fields = ['formatted_address', 'geometry.location']; // This data is always used
if($returnAddressComponent) fields.push('address_components');
if($returnName) fields.push('name');
if($returnFormattedPhoneNumber) fields.push('formatted_phone_number');
if($returnInternationalPhoneNumber) fields.push('international_phone_number');
if($returnWebsite) fields.push('website');

autocomplete.setFields(fields);

s = $(field).data('countries'); // Could be empty or a comma seperated string e.g: fr,nl,de
if(s){
x = s.split(',');
Expand All @@ -4677,17 +4722,6 @@ function SUPERreCaptcha(){
field.value = place.formatted_address;
SUPER.calculate_distance({el: field});

var mapping = {
street_number: 'street_number',
route: 'street_name',
locality: 'city',
administrative_area_level_2: 'municipality',
administrative_area_level_1: 'state',
country: 'country',
postal_code: 'postal_code',
lat: 'lat',
lng: 'lng'
};
var street_data = {
number: {
long: '',
Expand All @@ -4714,46 +4748,120 @@ function SUPERreCaptcha(){
var $val;
var $address;

place.address_components.push({
long_name: lat,
short_name: lat,
types: ["lat"]
});
place.address_components.push({
long_name: lng,
short_name: lng,
types: ["lng"]
});
for (var i = 0; i < place.address_components.length; i++) {
var item = place.address_components[i];
var long = item.long_name;
var short = item.short_name;
var types = item.types;
// Street number
if(types.indexOf('street_number')!==-1){
street_data.number.long = long;
street_data.number.short = short;
if($returnAddressComponent){
place.address_components.push({
long_name: lat,
short_name: lat,
types: ["lat"]
});
place.address_components.push({
long_name: lng,
short_name: lng,
types: ["lng"]
});
for (var i = 0; i < place.address_components.length; i++) {
var item = place.address_components[i];
var long = item.long_name;
var short = item.short_name;
var types = item.types;
// Street number
if(types.indexOf('street_number')!==-1){
street_data.number.long = long;
street_data.number.short = short;
}
// Street name
if(types.indexOf('route')!==-1){
street_data.name.long = long;
street_data.name.short = short;
}
$attribute = $(field).data('map-'+mapping[types[0]]);
if(typeof $attribute !=='undefined'){
$attribute = $attribute.split('|');
inputField = SUPER.field(args.form, $attribute[0]);
if(inputField){
if($attribute[1]==='') $attribute[1] = 'long';
$val = place.address_components[i][$attribute[1]+'_name'];
inputField.value = $val;
if($val===''){
inputField.closest('.super-shortcode').classList.remove('super-filled');
}else{
inputField.closest('.super-shortcode').classList.add('super-filled');
}
SUPER.after_dropdown_change_hook({el: inputField}); // @since 3.1.0 - trigger hooks after changing the value
}
}
}
}

// Name of the place
$attribute = $(field).data('map-name');
if(typeof $attribute !=='undefined'){
$attribute = $attribute.split('|');
inputField = SUPER.field(args.form, $attribute[0]);
if(inputField){
if($attribute[1]==='') $attribute[1] = 'long';
$val = place.name;
inputField.value = $val;
if($val===''){
inputField.closest('.super-shortcode').classList.remove('super-filled');
}else{
inputField.closest('.super-shortcode').classList.add('super-filled');
}
SUPER.after_dropdown_change_hook({el: inputField}); // @since 3.1.0 - trigger hooks after changing the value
}
// Street name
if(types.indexOf('route')!==-1){
street_data.name.long = long;
street_data.name.short = short;
}

// Formatted phone number
$attribute = $(field).data('map-formatted_phone_number');
if(typeof $attribute !=='undefined'){
$attribute = $attribute.split('|');
inputField = SUPER.field(args.form, $attribute[0]);
if(inputField){
if($attribute[1]==='') $attribute[1] = 'long';
$val = place.formatted_phone_number;
inputField.value = $val;
if($val===''){
inputField.closest('.super-shortcode').classList.remove('super-filled');
}else{
inputField.closest('.super-shortcode').classList.add('super-filled');
}
SUPER.after_dropdown_change_hook({el: inputField}); // @since 3.1.0 - trigger hooks after changing the value
}
$attribute = $(field).data('map-'+mapping[types[0]]);
if(typeof $attribute !=='undefined'){
$attribute = $attribute.split('|');
inputField = SUPER.field(args.form, $attribute[0]);
if(inputField){
if($attribute[1]==='') $attribute[1] = 'long';
$val = place.address_components[i][$attribute[1]+'_name'];
inputField.value = $val;
if($val===''){
inputField.closest('.super-shortcode').classList.remove('super-filled');
}else{
inputField.closest('.super-shortcode').classList.add('super-filled');
}
SUPER.after_dropdown_change_hook({el: inputField}); // @since 3.1.0 - trigger hooks after changing the value
}

// International phone number
$attribute = $(field).data('map-international_phone_number');
if(typeof $attribute !=='undefined'){
$attribute = $attribute.split('|');
inputField = SUPER.field(args.form, $attribute[0]);
if(inputField){
if($attribute[1]==='') $attribute[1] = 'long';
$val = place.international_phone_number;
inputField.value = $val;
if($val===''){
inputField.closest('.super-shortcode').classList.remove('super-filled');
}else{
inputField.closest('.super-shortcode').classList.add('super-filled');
}
SUPER.after_dropdown_change_hook({el: inputField}); // @since 3.1.0 - trigger hooks after changing the value
}
}

// Busniness website
$attribute = $(field).data('map-website');
if(typeof $attribute !=='undefined'){
$attribute = $attribute.split('|');
inputField = SUPER.field(args.form, $attribute[0]);
if(inputField){
if($attribute[1]==='') $attribute[1] = 'long';
$val = place.website;
inputField.value = $val;
if($val===''){
inputField.closest('.super-shortcode').classList.remove('super-filled');
}else{
inputField.closest('.super-shortcode').classList.add('super-filled');
}
SUPER.after_dropdown_change_hook({el: inputField}); // @since 3.1.0 - trigger hooks after changing the value
}
}

Expand Down
8 changes: 7 additions & 1 deletion src/docs/changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,13 @@

- [PDF Generator Add-on](https://renstillmann.github.io/super-forms/#/pdf-generator-add-on)

## Jan 04, 2020 - Version 4.9.572

## Jan 06, 2021 - Version 4.9.573

- **Added:** Option for google autocomplete to return `The place's name`, `Formatted phone number`, `International phone number` and `Website of the business`
- **Improved:** When using google autocomplete the code will now determine what data is being used in your form, and strip out any unnecessary data from the API request which could considerably reduce costs

## Jan 04, 2021 - Version 4.9.572

- **Fix:** Builder UI scrolling bug in Firefox browser causing a continues scroll
- **Fix:** When selecting default items for `Dropdown` element it would still display the placeholder instead of the actual selected item
Expand Down
4 changes: 4 additions & 0 deletions src/includes/class-field-types.php
Original file line number Diff line number Diff line change
Expand Up @@ -479,6 +479,10 @@ public static function textarea( $id, $field ) {
// address_auto_complete
public static function address_auto_populate( $id, $field, $data ) {
$mappings = array(
'name' => esc_html__( 'Name of place', 'super-forms' ),
'formatted_phone_number' => esc_html__( 'The Place\'s phone number, formatted according to the number\'s regional convention.', 'super-forms' ),
'international_phone_number' => esc_html__( 'The Place\'s phone number in international format', 'super-forms' ),
'website' => esc_html__( 'The authoritative website for this Place, such as a business\' homepage', 'super-forms' ),
'street_number' => esc_html__( 'Street number', 'super-forms' ),
'street_name' => esc_html__( 'Street name', 'super-forms' ),
'street_name_number' => esc_html__( 'Street name + nr', 'super-forms' ),
Expand Down
4 changes: 2 additions & 2 deletions src/includes/shortcodes/form-elements.php
Original file line number Diff line number Diff line change
Expand Up @@ -647,11 +647,11 @@
'required'=>true,
),
'enable_address_auto_populate' => array(
'desc' => esc_html__( 'Auto populate address fields', 'super-forms' ),
'desc' => esc_html__( 'Auto populate data with fields', 'super-forms' ),
'default'=> ( !isset( $attributes['enable_address_auto_populate'] ) ? '' : $attributes['enable_address_auto_populate'] ),
'type' => 'checkbox',
'values' => array(
'true' => esc_html__( 'Enable address auto populate', 'super-forms' ),
'true' => esc_html__( 'Map data with form fields', 'super-forms' ),
),
'filter'=>true,
'parent'=>'enable_address_auto_complete',
Expand Down
4 changes: 2 additions & 2 deletions src/super-forms.php
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
* Plugin Name: Super Forms - Drag & Drop Form Builder
* Plugin URI: http://codecanyon.net/user/feeling4design
* Description: The most advanced, flexible and easy to use form builder for WordPress!
* Version: 4.9.572
* Version: 4.9.573
* Author: feeling4design
* Author URI: http://codecanyon.net/user/feeling4design
* Text Domain: super-forms
Expand All @@ -41,7 +41,7 @@ final class SUPER_Forms {
*
* @since 1.0.0
*/
public $version = '4.9.572';
public $version = '4.9.573';
public $slug = 'super-forms';
public $apiUrl = 'https://api.super-forms.com/';
public $apiVersion = 'v1';
Expand Down

0 comments on commit 4f17634

Please sign in to comment.