gmaps-autocomplete-rails 0.1.1 → 0.1.2
Sign up to get free protection for your applications and to get access to all the features.
- data/CHANGELOG +6 -0
- data/README.md +11 -3
- data/VERSION +1 -1
- data/gmaps-autocomplete-rails.gemspec +3 -2
- data/vendor/assets/javascripts/gmaps-autocomplete.js +88 -60
- metadata +4 -3
data/CHANGELOG
ADDED
data/README.md
CHANGED
@@ -40,18 +40,26 @@ defaultOptions = {
|
|
40
40
|
pos: [51.751724, -1.255284],
|
41
41
|
inputField: '#gmaps-input-address',
|
42
42
|
errorField: '#gmaps-error',
|
43
|
+
debugOn: false
|
44
|
+
};
|
45
|
+
```
|
46
|
+
|
47
|
+
The following default methods can be replaced by configuration:
|
48
|
+
|
49
|
+
```javascript
|
43
50
|
positionOutputter: this.defaultPositionOutputter,
|
44
51
|
updateUI : this.defaultUpdateUI,
|
45
52
|
updateMap : this.defaultUpdateMap
|
46
|
-
};
|
47
53
|
```
|
48
54
|
|
49
|
-
`autoCompleteInit` also takes an option hash, but currently only [region](https://developers.google.com/maps/documentation/geocoding/#RegionCodes)
|
55
|
+
`autoCompleteInit` also takes an option hash, but currently only [region](https://developers.google.com/maps/documentation/geocoding/#RegionCodes) and country can be used.
|
50
56
|
|
51
57
|
```javascript
|
52
|
-
autoCompleteInit({region: '
|
58
|
+
autoCompleteInit({region: 'DK', country: 'Denmark'});
|
53
59
|
```
|
54
60
|
|
61
|
+
Will make searches in the DK region and remove `', Denmark'` from the result.
|
62
|
+
|
55
63
|
# Examples
|
56
64
|
|
57
65
|
See `spec/index.html` for an example page using this "plugin". Note that if you set `mapElem`to null or leave out that element on the page, the autocomplete will function without attempting to update the map :)
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
0.1.
|
1
|
+
0.1.2
|
@@ -5,11 +5,11 @@
|
|
5
5
|
|
6
6
|
Gem::Specification.new do |s|
|
7
7
|
s.name = "gmaps-autocomplete-rails"
|
8
|
-
s.version = "0.1.
|
8
|
+
s.version = "0.1.2"
|
9
9
|
|
10
10
|
s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
|
11
11
|
s.authors = ["Kristian Mandrup"]
|
12
|
-
s.date = "2012-09-
|
12
|
+
s.date = "2012-09-10"
|
13
13
|
s.description = "Easily add autocomplete geo-functionality to your Rails app :)"
|
14
14
|
s.email = "kmandrup@gmail.com"
|
15
15
|
s.extra_rdoc_files = [
|
@@ -19,6 +19,7 @@ Gem::Specification.new do |s|
|
|
19
19
|
s.files = [
|
20
20
|
".document",
|
21
21
|
".rspec",
|
22
|
+
"CHANGELOG",
|
22
23
|
"Gemfile",
|
23
24
|
"Gemfile.lock",
|
24
25
|
"LICENSE.txt",
|
@@ -8,6 +8,8 @@ var GmapsAutoComplete = {
|
|
8
8
|
updateUI: null,
|
9
9
|
updateMap: null,
|
10
10
|
region: null,
|
11
|
+
country: null,
|
12
|
+
debugOn: false,
|
11
13
|
|
12
14
|
// initialise the google maps objects, and add listeners
|
13
15
|
mapElem: document.getElementById("gmaps-canvas"),
|
@@ -18,22 +20,20 @@ var GmapsAutoComplete = {
|
|
18
20
|
errorField: '#gmaps-error',
|
19
21
|
positionOutputter: this.defaultPositionOutputter,
|
20
22
|
|
23
|
+
defaultOptions: {
|
24
|
+
mapElem: "#gmaps-canvas",
|
25
|
+
zoomLevel: 2,
|
26
|
+
mapType: google.maps.MapTypeId.ROADMAP,
|
27
|
+
pos: [51.751724, -1.255284],
|
28
|
+
inputField: '#gmaps-input-address',
|
29
|
+
errorField: '#gmaps-error',
|
30
|
+
debugOn: false
|
31
|
+
},
|
32
|
+
|
21
33
|
init: function(opts){
|
22
34
|
opts = opts || {};
|
23
|
-
|
24
|
-
|
25
|
-
mapElem: "#gmaps-canvas",
|
26
|
-
zoomLevel: 2,
|
27
|
-
mapType: google.maps.MapTypeId.ROADMAP,
|
28
|
-
pos: [51.751724, -1.255284],
|
29
|
-
inputField: '#gmaps-input-address',
|
30
|
-
errorField: '#gmaps-error',
|
31
|
-
positionOutputter: this.defaultPositionOutputter,
|
32
|
-
updateUI : this.defaultUpdateUI,
|
33
|
-
updateMap : this.defaultUpdateMap
|
34
|
-
};
|
35
|
-
|
36
|
-
$.extend(opts, defaultOptions);
|
35
|
+
var callOpts = jQuery.extend(true, {}, opts);
|
36
|
+
var opts = $.extend(true, {}, this.defaultOptions, opts);
|
37
37
|
|
38
38
|
var pos = opts['pos'];
|
39
39
|
var lat = pos[0];
|
@@ -50,33 +50,43 @@ var GmapsAutoComplete = {
|
|
50
50
|
|
51
51
|
this.inputField = opts['inputField'];
|
52
52
|
this.errorField = opts['#gmaps-error'];
|
53
|
+
this.debugOn = opts['debugOn'];
|
54
|
+
|
55
|
+
this.positionOutputter = opts['positionOutputter'] || this.defaultPositionOutputter;
|
56
|
+
this.updateUI = opts['updateUI'] || this.defaultUpdateUI;
|
57
|
+
this.updateMap = opts['updateMap'] || this.defaultUpdateMap;
|
53
58
|
|
54
|
-
this.
|
55
|
-
this.
|
56
|
-
this.
|
59
|
+
this.debug('called with opts', callOpts);
|
60
|
+
this.debug('defaultOptions', this.defaultOptions);
|
61
|
+
this.debug('options after merge with defaults', opts);
|
57
62
|
|
58
63
|
// center of the universe
|
59
64
|
var latlng = new google.maps.LatLng(lat, lng);
|
65
|
+
this.debug('lat,lng', latlng);
|
60
66
|
|
61
|
-
var
|
67
|
+
var mapOptions = {
|
62
68
|
zoom: zoomLevel,
|
63
69
|
center: latlng,
|
64
70
|
mapTypeId: mapType
|
65
71
|
};
|
66
72
|
|
73
|
+
this.debug('map options', mapOptions);
|
74
|
+
|
67
75
|
// the geocoder object allows us to do latlng lookup based on address
|
68
|
-
geocoder = new google.maps.Geocoder();
|
76
|
+
this.geocoder = new google.maps.Geocoder();
|
69
77
|
|
70
78
|
var self = this;
|
71
79
|
|
72
80
|
if (typeof(mapElem) == 'undefined') {
|
73
|
-
|
81
|
+
this.showError("Map element " + opts['mapElem'] + " could not be resolved!");
|
74
82
|
}
|
75
83
|
|
84
|
+
self.debug('mapElem', this.mapElem);
|
85
|
+
|
76
86
|
if (!mapElem) { return }
|
77
87
|
|
78
88
|
// create our map object
|
79
|
-
this.map = new google.maps.Map(mapElem,
|
89
|
+
this.map = new google.maps.Map(mapElem, mapOptions);
|
80
90
|
|
81
91
|
if (!this.map) { return }
|
82
92
|
|
@@ -89,6 +99,11 @@ var GmapsAutoComplete = {
|
|
89
99
|
self.addMapListeners(this.marker, this.map);
|
90
100
|
},
|
91
101
|
|
102
|
+
debug: function(label, obj) {
|
103
|
+
if (!this.debugOn) { return }
|
104
|
+
console.log(label, obj);
|
105
|
+
},
|
106
|
+
|
92
107
|
addMapListeners: function(marker, map) {
|
93
108
|
self = this;
|
94
109
|
// event triggered when marker is dragged and dropped
|
@@ -120,7 +135,13 @@ var GmapsAutoComplete = {
|
|
120
135
|
// fill in the UI elements with new position data
|
121
136
|
defaultUpdateUI: function( address, latLng ) {
|
122
137
|
$(this.inputField).autocomplete("close");
|
123
|
-
|
138
|
+
|
139
|
+
this.debug('country', this.country);
|
140
|
+
var updateAdr = address.replace(", " + this.country, '');
|
141
|
+
var updateAdr = address;
|
142
|
+
this.debug('updateAdr', updateAdr);
|
143
|
+
|
144
|
+
$(this.inputField).val(updateAdr);
|
124
145
|
|
125
146
|
this.positionOutputter(latLng);
|
126
147
|
},
|
@@ -144,12 +165,13 @@ var GmapsAutoComplete = {
|
|
144
165
|
|
145
166
|
request = {};
|
146
167
|
request[type] = value;
|
147
|
-
var self = this;
|
148
168
|
|
149
|
-
geocoder.geocode(request, performGeocode);
|
169
|
+
this.geocoder.geocode(request, performGeocode);
|
150
170
|
},
|
151
171
|
|
152
172
|
performGeocode: function(results, status) {
|
173
|
+
this.debug('performGeocode', status);
|
174
|
+
|
153
175
|
$(self.errorField).html('');
|
154
176
|
if (status == google.maps.GeocoderStatus.OK) {
|
155
177
|
self.geocodeSuccess(results);
|
@@ -159,6 +181,7 @@ var GmapsAutoComplete = {
|
|
159
181
|
},
|
160
182
|
|
161
183
|
geocodeSuccess: function(results) {
|
184
|
+
this.debug('geocodeSuccess', results);
|
162
185
|
// Google geocoding has succeeded!
|
163
186
|
if (results[0]) {
|
164
187
|
// Always update the UI elements with new location data
|
@@ -174,6 +197,7 @@ var GmapsAutoComplete = {
|
|
174
197
|
},
|
175
198
|
|
176
199
|
geocodeFailure: function(type, value) {
|
200
|
+
this.debug('geocodeFailure', type);
|
177
201
|
// Google Geocoding has failed. Two common reasons:
|
178
202
|
// * Address not recognised (e.g. search for 'zxxzcxczxcx')
|
179
203
|
// * Location doesn't map to address (e.g. click in middle of Atlantic)
|
@@ -213,13 +237,49 @@ var GmapsAutoComplete = {
|
|
213
237
|
autoCompleteInit: function (opts) {
|
214
238
|
opts = opts || {};
|
215
239
|
this.region = opts['region'] || 'DK';
|
240
|
+
this.country = opts['country'] || 'Denmark';
|
241
|
+
this.debug('region', this.region)
|
242
|
+
|
243
|
+
var self = this;
|
216
244
|
|
217
245
|
$(this.inputField).autocomplete({
|
246
|
+
// event triggered when drop-down option selected
|
247
|
+
select: function(event,ui){
|
248
|
+
self.updateUI( ui.item.value, ui.item.geocode.geometry.location )
|
249
|
+
self.updateMap( ui.item.geocode.geometry )
|
250
|
+
},
|
251
|
+
|
218
252
|
// source is the list of input options shown in the autocomplete dropdown.
|
219
253
|
// see documentation: http://jqueryui.com/demos/autocomplete/
|
220
|
-
source:
|
221
|
-
|
222
|
-
|
254
|
+
source: function(request,response) {
|
255
|
+
// https://developers.google.com/maps/documentation/geocoding/#RegionCodes
|
256
|
+
var region_postfix = ''
|
257
|
+
var region = self.region;
|
258
|
+
|
259
|
+
if (region) {
|
260
|
+
region_postfix = ', ' + region
|
261
|
+
}
|
262
|
+
var address = request.term + region_postfix;
|
263
|
+
|
264
|
+
self.debug('geocode address', address);
|
265
|
+
|
266
|
+
var geocodeOpts = {'address': address }
|
267
|
+
|
268
|
+
// the geocode method takes an address or LatLng to search for
|
269
|
+
// and a callback function which should process the results into
|
270
|
+
// a format accepted by jqueryUI autocomplete
|
271
|
+
self.geocoder.geocode(geocodeOpts, function(results, status) {
|
272
|
+
response($.map(results, function(item) {
|
273
|
+
var uiAddress = item.formatted_address.replace(", " + self.country, '');
|
274
|
+
// var uiAddress = item.formatted_address;
|
275
|
+
return {
|
276
|
+
label: uiAddress, // appears in dropdown box
|
277
|
+
value: uiAddress, // inserted into input element when selected
|
278
|
+
geocode: item // all geocode data: used in select callback event
|
279
|
+
}
|
280
|
+
}));
|
281
|
+
})
|
282
|
+
}
|
223
283
|
});
|
224
284
|
|
225
285
|
// triggered when user presses a key in the address box
|
@@ -236,37 +296,5 @@ var GmapsAutoComplete = {
|
|
236
296
|
// re-enable if previously disabled above
|
237
297
|
$(this.inputField).autocomplete("enable")
|
238
298
|
}
|
239
|
-
}
|
240
|
-
|
241
|
-
// self grants access to caller scope
|
242
|
-
autoCompleteSelect: function(event,ui){
|
243
|
-
self.updateUI( ui.item.value, ui.item.geocode.geometry.location )
|
244
|
-
self.updateMap( ui.item.geocode.geometry )
|
245
|
-
},
|
246
|
-
|
247
|
-
// self grants access to caller scope
|
248
|
-
autoCompleteSource: function(request,response) {
|
249
|
-
// https://developers.google.com/maps/documentation/geocoding/#RegionCodes
|
250
|
-
var region_postfix = ''
|
251
|
-
var region = self.region;
|
252
|
-
|
253
|
-
if (region) {
|
254
|
-
region_postfix = ', ' + region
|
255
|
-
}
|
256
|
-
|
257
|
-
geocode_opts = {'address': request.term + region_postfix }
|
258
|
-
|
259
|
-
// the geocode method takes an address or LatLng to search for
|
260
|
-
// and a callback function which should process the results into
|
261
|
-
// a format accepted by jqueryUI autocomplete
|
262
|
-
geocoder.geocode(geocode_opts, function(results, status) {
|
263
|
-
response($.map(results, function(item) {
|
264
|
-
return {
|
265
|
-
label: item.formatted_address, // appears in dropdown box
|
266
|
-
value: item.formatted_address, // inserted into input element when selected
|
267
|
-
geocode: item // all geocode data: used in select callback event
|
268
|
-
}
|
269
|
-
}));
|
270
|
-
})
|
271
|
-
}
|
299
|
+
}
|
272
300
|
}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: gmaps-autocomplete-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.2
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2012-09-
|
12
|
+
date: 2012-09-10 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: rails
|
@@ -117,6 +117,7 @@ extra_rdoc_files:
|
|
117
117
|
files:
|
118
118
|
- .document
|
119
119
|
- .rspec
|
120
|
+
- CHANGELOG
|
120
121
|
- Gemfile
|
121
122
|
- Gemfile.lock
|
122
123
|
- LICENSE.txt
|
@@ -162,7 +163,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
162
163
|
version: '0'
|
163
164
|
segments:
|
164
165
|
- 0
|
165
|
-
hash:
|
166
|
+
hash: 3011531713176015454
|
166
167
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
167
168
|
none: false
|
168
169
|
requirements:
|