|
Line 0
Link Here
|
|
|
1 |
function GoogleMapsInitIntranet(){ |
| 2 |
/* Pages pour API GOOGLE*/ |
| 3 |
var affectedPages = ['memberentry', 'supplier', 'branches', 'cities']; |
| 4 |
|
| 5 |
/* page memberentry Adresse principale */ |
| 6 |
var inputs_memberenty_main = ['streetnumber', 'address', 'city', 'state', 'zipcode']; |
| 7 |
var page_memberenty_main_input = 'address'; |
| 8 |
/* page memberentry Autre adresse */ |
| 9 |
var inputs_memberenty_alternate = ['B_streetnumber', 'B_address', 'B_city', 'B_state', 'B_country', 'B_zipcode']; |
| 10 |
var page_memberenty_alternate_input = 'B_address'; |
| 11 |
/* page memberentry Autre contact */ |
| 12 |
var inputs_memberenty_contact = ['altcontactaddress1', 'altcontactcity', 'altcontactstate', 'altcontactzipcode']; |
| 13 |
var page_memberenty_contact_input = 'altcontactaddress1'; |
| 14 |
/* page supplier Adresse postale*/ |
| 15 |
var page_supplier_input1 = 'company_postal'; |
| 16 |
/* page supplier Adresse physique*/ |
| 17 |
var page_supplier_input2 = 'physical'; |
| 18 |
/* page supplier ranches */ |
| 19 |
var inputs_branches = ['branchaddress1', 'branchcity', 'branchstate', 'branchcountry', 'branchzip']; |
| 20 |
var page_branches_input = 'branchaddress1'; |
| 21 |
/* page cities */ |
| 22 |
var inputs_cities = ['city_name', 'city_state', 'city_country', 'city_zipcode']; |
| 23 |
var page_cities_input = 'city_name'; |
| 24 |
|
| 25 |
// Si on tombe sur une de ces pages |
| 26 |
if (affectedPages.indexOf(getPageName()) >= 0) { |
| 27 |
|
| 28 |
//Dictionaire pour comparer notre form (input->id) avec type API Google |
| 29 |
var builder_dictionary = { |
| 30 |
/* form_input_id : type_google */ |
| 31 |
/* page memberentry Adresse principale */ |
| 32 |
'streetnumber' : ['street_number'], |
| 33 |
'address' : ['route'], |
| 34 |
'city' : ['locality'], |
| 35 |
'state' : ['administrative_area_level_1'], |
| 36 |
'zipcode' : ['postal_code'], |
| 37 |
/* page memberentry Autre adresse */ |
| 38 |
'B_streetnumber' : ['street_number'], |
| 39 |
'B_address' : ['route'], |
| 40 |
'B_city' : ['locality'], |
| 41 |
'B_state' : ['administrative_area_level_1'], |
| 42 |
'B_zipcode' : ['postal_code'], |
| 43 |
/* page memberentry Autre contact */ |
| 44 |
'altcontactaddress1' : ['street_number','route'], |
| 45 |
'delimiter_altcontactaddress1' : ', ', |
| 46 |
'altcontactcity' : ['locality'], |
| 47 |
'altcontactstate' : ['administrative_area_level_1'], |
| 48 |
'altcontactzipcode' : ['postal_code'] |
| 49 |
}; |
| 50 |
|
| 51 |
// Format de sortie composantes d'une adresse Google Maps pour notre form |
| 52 |
var format_api_google = { |
| 53 |
'street_number': 'short_name', |
| 54 |
'route': 'long_name', |
| 55 |
'locality': 'long_name', |
| 56 |
'administrative_area_level_1': 'short_name', |
| 57 |
'country': 'long_name', |
| 58 |
'postal_code': 'short_name', |
| 59 |
'postal_code_prefix': 'short_name' |
| 60 |
}; |
| 61 |
|
| 62 |
/* Pages avec les champes pour changer */ |
| 63 |
function initAutocomplete() { |
| 64 |
/* Option pour Autocomplete de Google */ |
| 65 |
var t = 0; |
| 66 |
options = { |
| 67 |
types: ['geocode'], |
| 68 |
// Localisation de départ près de Montréal pour une recherch |
| 69 |
// plus efficace si la géolocalisation est désactivée |
| 70 |
bounds: new google.maps.LatLngBounds( |
| 71 |
new google.maps.LatLng(45.5053543, -73.733018), |
| 72 |
), |
| 73 |
componentRestrictions: {country: ['us', 'ca']} |
| 74 |
}; |
| 75 |
/* Verifier une page */ |
| 76 |
switch (getPageName()) { |
| 77 |
case 'memberentry': |
| 78 |
initAutocompleteMemberentry(); |
| 79 |
break; |
| 80 |
case 'supplier': |
| 81 |
initAutocompleteSupplier(); |
| 82 |
break; |
| 83 |
case 'branches': |
| 84 |
initAutocompleteBranches(); |
| 85 |
break; |
| 86 |
case 'cities': |
| 87 |
initAutocompleteCities(); |
| 88 |
break; |
| 89 |
default: |
| 90 |
console.log ("This page is " + page); |
| 91 |
break; |
| 92 |
} |
| 93 |
}; |
| 94 |
|
| 95 |
/* page memberentry */ |
| 96 |
function initAutocompleteMemberentry(){ |
| 97 |
/* Adresse principale */ |
| 98 |
primaryAutocomplete = new google.maps.places.Autocomplete( |
| 99 |
/** @type {!HTMLInputElement} */(document.getElementById(page_memberenty_main_input)), options); |
| 100 |
// Remplir les champs lorsque l'utilisateur a choisi l'adresse |
| 101 |
primaryAutocomplete.addListener('place_changed', |
| 102 |
function () { |
| 103 |
fillInAddress(primaryAutocomplete, inputs_memberenty_main); |
| 104 |
} |
| 105 |
); |
| 106 |
$('#'+page_memberenty_main_input).focus( |
| 107 |
function () { |
| 108 |
primaryAutocomplete |
| 109 |
} |
| 110 |
); |
| 111 |
/* Autre adresse */ |
| 112 |
B_autocomplete = new google.maps.places.Autocomplete( |
| 113 |
/** @type {!HTMLInputElement} */(document.getElementById(page_memberenty_alternate_input)), options); |
| 114 |
B_autocomplete.addListener('place_changed', |
| 115 |
function () { |
| 116 |
fillInAddress(B_autocomplete, inputs_memberenty_alternate); |
| 117 |
} |
| 118 |
); |
| 119 |
$('#'+page_memberenty_alternate_input).focus( |
| 120 |
function () { |
| 121 |
B_autocomplete; |
| 122 |
} |
| 123 |
); |
| 124 |
/* Autre contact */ |
| 125 |
altcontactaddress1 = new google.maps.places.Autocomplete( |
| 126 |
/** @type {!HTMLInputElement} */(document.getElementById(page_memberenty_contact_input)), options); |
| 127 |
altcontactaddress1.addListener('place_changed', |
| 128 |
function () { |
| 129 |
fillInAddress(altcontactaddress1, inputs_memberenty_contact); |
| 130 |
} |
| 131 |
); |
| 132 |
$('#'+page_memberenty_contact_input).focus( |
| 133 |
function () { |
| 134 |
B_autocomplete; |
| 135 |
} |
| 136 |
); |
| 137 |
} |
| 138 |
|
| 139 |
/* page branches */ |
| 140 |
function initAutocompleteBranches(){ |
| 141 |
branchAutocomplete = new google.maps.places.Autocomplete( |
| 142 |
/** @type {!HTMLInputElement} */(document.getElementById(page_branches_input)), options); |
| 143 |
branchAutocomplete.addListener('place_changed', |
| 144 |
function () { |
| 145 |
fillInAddress(branchAutocomplete, inputs_branches); |
| 146 |
} |
| 147 |
); |
| 148 |
$('#'+page_branches_input).focus( |
| 149 |
function () { |
| 150 |
branchAutocomplete |
| 151 |
} |
| 152 |
); |
| 153 |
} |
| 154 |
|
| 155 |
/* page cities */ |
| 156 |
function initAutocompleteCities(){ |
| 157 |
componentPlace = page_cities; |
| 158 |
cityTownAutocomplete = new google.maps.places.Autocomplete( |
| 159 |
/** @type {!HTMLInputElement} */(document.getElementById(page_cities_input)), options); |
| 160 |
cityTownAutocomplete.addListener('place_changed', |
| 161 |
function () { |
| 162 |
fillInAddress(cityTownAutocomplete, inputs_cities); |
| 163 |
} |
| 164 |
); |
| 165 |
$('#'+page_cities_input).focus( |
| 166 |
function () { |
| 167 |
cityTownAutocomplete |
| 168 |
} |
| 169 |
); |
| 170 |
} |
| 171 |
|
| 172 |
/* page supplier */ |
| 173 |
function initAutocompleteSupplier(){ |
| 174 |
postalAutocomplete = new google.maps.places.Autocomplete( |
| 175 |
/** @type {!HTMLInputElement} */(document.getElementById(page_supplier_input1)), options); |
| 176 |
physicalAutocomplete = new google.maps.places.Autocomplete( |
| 177 |
/** @type {!HTMLInputElement} */(document.getElementById(page_supplier_input2)), options); |
| 178 |
$('#'+page_supplier_input1).focus( |
| 179 |
function () { |
| 180 |
postalAutocomplete; |
| 181 |
} |
| 182 |
); |
| 183 |
$('#'+page_supplier_input2).focus( |
| 184 |
function () { |
| 185 |
physicalAutocomplete; |
| 186 |
} |
| 187 |
); |
| 188 |
} |
| 189 |
|
| 190 |
function fillInAddress(autocomplete, componentPlace) { |
| 191 |
//new |
| 192 |
// Obtenir les infos de l'adresse |
| 193 |
let place = autocomplete.getPlace(); |
| 194 |
|
| 195 |
//Verifier notre dictionaire |
| 196 |
for (let i = 0; i < componentPlace.length; i++) |
| 197 |
{ |
| 198 |
if (componentPlace[i] != null && document.getElementById(componentPlace[i]) != null) |
| 199 |
{ |
| 200 |
let form_input_id = ''; |
| 201 |
CompPlace = document.getElementById(componentPlace[i]); |
| 202 |
CompPlace.value = ''; |
| 203 |
|
| 204 |
form_input_id = Object.keys(builder_dictionary).find(key => key === componentPlace[i]); |
| 205 |
let type_google = builder_dictionary[form_input_id]; |
| 206 |
switch (type_google.length) { |
| 207 |
case 1: |
| 208 |
for (let j = 0; j < place.address_components.length; j++) { |
| 209 |
if (type_google[0] == place.address_components[j].types[0]){ |
| 210 |
CompPlace.value = place.address_components[j][format_api_google[type_google[0]]]; |
| 211 |
} |
| 212 |
} |
| 213 |
break; |
| 214 |
default: |
| 215 |
var str_output = ''; |
| 216 |
var delimit = 'delimiter_' + form_input_id; |
| 217 |
for (let b = 0; b < type_google.length; b++) { |
| 218 |
for (let j = 0; j < place.address_components.length; j++) { |
| 219 |
if (type_google[b] == place.address_components[j].types[0]){ |
| 220 |
str_output += place.address_components[j][format_api_google[type_google[b]]] + builder_dictionary[delimit]; |
| 221 |
} |
| 222 |
} |
| 223 |
} |
| 224 |
str_output = str_output.slice(0, -Math.abs(builder_dictionary[delimit].length)); |
| 225 |
CompPlace.value = str_output; |
| 226 |
break; |
| 227 |
} |
| 228 |
} |
| 229 |
} |
| 230 |
} |
| 231 |
|
| 232 |
// Chercher le script de l'API |
| 233 |
jQuery.ajax({ |
| 234 |
url: '/cgi-bin/koha/api/api-google-places.pl?lang=' + $('html').attr('lang'), |
| 235 |
dataType: 'script', |
| 236 |
success: initAutocomplete, |
| 237 |
async: true, |
| 238 |
defer: true |
| 239 |
}); |
| 240 |
} |
| 241 |
|
| 242 |
//Retourne le nom de la page sans extension et paramètres |
| 243 |
function getPageName() { |
| 244 |
var url = window.location.pathname; |
| 245 |
var index = url.lastIndexOf("/") + 1; |
| 246 |
var pageNameWithExtension = url.substr(index); |
| 247 |
var pageName = pageNameWithExtension.split(".")[0]; |
| 248 |
return pageName; |
| 249 |
} |
| 250 |
} |
| 251 |
|
| 252 |
GoogleMapsInitIntranet(); |