gmaps-autocomplete-rails 0.1.2.1 → 0.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/README.md +265 -50
- data/gmaps-autocomplete-rails.gemspec +7 -32
- data/vendor/assets/javascripts/gmaps-auto-complete.js +297 -0
- metadata +20 -63
- data/.document +0 -5
- data/.rspec +0 -1
- data/CHANGELOG +0 -6
- data/Gemfile.lock +0 -109
- data/Rakefile +0 -49
- data/VERSION +0 -1
- data/spec/index.html +0 -64
- data/spec/init.js +0 -4
- data/spec/jquery-ui/images/ui-bg_flat_0_aaaaaa_40x100.png +0 -0
- data/spec/jquery-ui/images/ui-bg_glass_55_fbf9ee_1x400.png +0 -0
- data/spec/jquery-ui/images/ui-bg_glass_65_ffffff_1x400.png +0 -0
- data/spec/jquery-ui/images/ui-bg_glass_75_dadada_1x400.png +0 -0
- data/spec/jquery-ui/images/ui-bg_glass_75_e6e6e6_1x400.png +0 -0
- data/spec/jquery-ui/images/ui-bg_glass_75_ffffff_1x400.png +0 -0
- data/spec/jquery-ui/images/ui-bg_highlight-soft_75_cccccc_1x100.png +0 -0
- data/spec/jquery-ui/images/ui-bg_inset-soft_95_fef1ec_1x100.png +0 -0
- data/spec/jquery-ui/images/ui-icons_222222_256x240.png +0 -0
- data/spec/jquery-ui/images/ui-icons_2e83ff_256x240.png +0 -0
- data/spec/jquery-ui/images/ui-icons_454545_256x240.png +0 -0
- data/spec/jquery-ui/images/ui-icons_888888_256x240.png +0 -0
- data/spec/jquery-ui/images/ui-icons_cd0a0a_256x240.png +0 -0
- data/spec/jquery-ui/images/ui-icons_f6cf3b_256x240.png +0 -0
- data/spec/jquery-ui/jquery-ui-1.8.16.custom.css +0 -1320
- data/spec/jquery-ui/jquery.ui.1.8.16.ie.css +0 -6
- data/spec/main.css +0 -89
- data/spec/spec_helper.rb +0 -12
- data/vendor/assets/javascripts/gmaps-autocomplete.js +0 -300
@@ -1,6 +0,0 @@
|
|
1
|
-
|
2
|
-
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-left, .ui-corner-bottom{ border-radius:0px;}
|
3
|
-
.ui-state-active,.ui-tabs-selected { border-radius:0px;}
|
4
|
-
.ui-tabs-selected { border-radius:0px;}
|
5
|
-
.ui-tabs .ui-tabs-nav li{ filter:none;}
|
6
|
-
.ui-tabs .ui-tabs-nav li a { border-radius:0px; }
|
data/spec/main.css
DELETED
@@ -1,89 +0,0 @@
|
|
1
|
-
html {
|
2
|
-
margin:0;
|
3
|
-
padding:0;
|
4
|
-
border:0;
|
5
|
-
}
|
6
|
-
|
7
|
-
body, div, span, object, iframe,
|
8
|
-
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
9
|
-
a, abbr, acronym, address, code,
|
10
|
-
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
|
11
|
-
fieldset, form, label, legend,
|
12
|
-
table, caption, tbody, tfoot, thead, tr, th, td,
|
13
|
-
article, aside, dialog, figure, footer, header,
|
14
|
-
hgroup, nav, section {
|
15
|
-
margin: 0;
|
16
|
-
padding: 0;
|
17
|
-
border: 0;
|
18
|
-
font-size: 100%;
|
19
|
-
font: inherit;
|
20
|
-
vertical-align: baseline;
|
21
|
-
}
|
22
|
-
|
23
|
-
body {
|
24
|
-
color: #333;
|
25
|
-
margin: 50px;
|
26
|
-
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:13px;
|
27
|
-
}
|
28
|
-
|
29
|
-
#gmaps-canvas {
|
30
|
-
height: 400px;
|
31
|
-
|
32
|
-
border: 1px solid #999;
|
33
|
-
-moz-box-shadow: 0px 0px 5px #ccc;
|
34
|
-
-webkit-box-shadow: 0px 0px 5px #ccc;
|
35
|
-
box-shadow: 0px 0px 5px #ccc;
|
36
|
-
}
|
37
|
-
|
38
|
-
#gmaps-error {
|
39
|
-
color: #cc0000;
|
40
|
-
}
|
41
|
-
|
42
|
-
h1 {
|
43
|
-
font-weight: bold;
|
44
|
-
padding-top: 5px;
|
45
|
-
padding-bottom: 5px;
|
46
|
-
}
|
47
|
-
|
48
|
-
p {
|
49
|
-
padding-top: 5px;
|
50
|
-
padding-bottom: 5px;
|
51
|
-
}
|
52
|
-
|
53
|
-
hr {
|
54
|
-
border: none;
|
55
|
-
padding: 5px;
|
56
|
-
border-bottom: 1px solid #efefef;
|
57
|
-
}
|
58
|
-
|
59
|
-
#container {
|
60
|
-
width: 80%;
|
61
|
-
margin-left: auto;
|
62
|
-
margin-right: auto;
|
63
|
-
margin-top: 30px;
|
64
|
-
padding: 25px;
|
65
|
-
border: 1px solid #999;
|
66
|
-
-moz-box-shadow: 0px 0px 15px #ccc;
|
67
|
-
-webkit-box-shadow: 0px 0px 15px #ccc;
|
68
|
-
box-shadow: 0px 0px 15px #ccc;
|
69
|
-
}
|
70
|
-
|
71
|
-
input {
|
72
|
-
width: 500px;
|
73
|
-
}
|
74
|
-
|
75
|
-
#results {
|
76
|
-
color: #555;
|
77
|
-
padding-top: 10px;
|
78
|
-
}
|
79
|
-
|
80
|
-
#input {
|
81
|
-
padding-top: 20px;
|
82
|
-
padding-bottom: 20px;
|
83
|
-
color: #ccc;
|
84
|
-
}
|
85
|
-
#input #gmaps-output-latitude, #input #gmaps-output-longitude {
|
86
|
-
color: green;
|
87
|
-
}
|
88
|
-
|
89
|
-
.download { float: right; }
|
data/spec/spec_helper.rb
DELETED
@@ -1,12 +0,0 @@
|
|
1
|
-
$LOAD_PATH.unshift(File.join(File.dirname(__FILE__), '..', 'lib'))
|
2
|
-
$LOAD_PATH.unshift(File.dirname(__FILE__))
|
3
|
-
require 'rspec'
|
4
|
-
require 'gmaps-autocomplete-rails'
|
5
|
-
|
6
|
-
# Requires supporting files with custom matchers and macros, etc,
|
7
|
-
# in ./support/ and its subdirectories.
|
8
|
-
Dir["#{File.dirname(__FILE__)}/support/**/*.rb"].each {|f| require f}
|
9
|
-
|
10
|
-
RSpec.configure do |config|
|
11
|
-
|
12
|
-
end
|
@@ -1,300 +0,0 @@
|
|
1
|
-
var GmapsAutoComplete = {
|
2
|
-
geocoder: null,
|
3
|
-
map: null,
|
4
|
-
marker: null,
|
5
|
-
inputField: null,
|
6
|
-
errorField: null,
|
7
|
-
positionOutputter: null,
|
8
|
-
updateUI: null,
|
9
|
-
updateMap: null,
|
10
|
-
region: null,
|
11
|
-
country: null,
|
12
|
-
debugOn: false,
|
13
|
-
|
14
|
-
// initialise the google maps objects, and add listeners
|
15
|
-
mapElem: document.getElementById("gmaps-canvas"),
|
16
|
-
zoomLevel: 2,
|
17
|
-
mapType: google.maps.MapTypeId.ROADMAP,
|
18
|
-
pos: [51.751724, -1.255284],
|
19
|
-
inputField: '#gmaps-input-address',
|
20
|
-
errorField: '#gmaps-error',
|
21
|
-
positionOutputter: this.defaultPositionOutputter,
|
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
|
-
|
33
|
-
init: function(opts){
|
34
|
-
opts = opts || {};
|
35
|
-
var callOpts = jQuery.extend(true, {}, opts);
|
36
|
-
var opts = $.extend(true, {}, this.defaultOptions, opts);
|
37
|
-
|
38
|
-
var pos = opts['pos'];
|
39
|
-
var lat = pos[0];
|
40
|
-
var lng = pos[1];
|
41
|
-
|
42
|
-
var mapType = opts['mapType'];
|
43
|
-
var mapElem = null;
|
44
|
-
|
45
|
-
if (opts['mapElem']) {
|
46
|
-
mapElem = $(opts['mapElem']).get(0);
|
47
|
-
}
|
48
|
-
|
49
|
-
var zoomLevel = opts['zoomLevel'];
|
50
|
-
|
51
|
-
this.inputField = opts['inputField'];
|
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;
|
58
|
-
|
59
|
-
this.debug('called with opts', callOpts);
|
60
|
-
this.debug('defaultOptions', this.defaultOptions);
|
61
|
-
this.debug('options after merge with defaults', opts);
|
62
|
-
|
63
|
-
// center of the universe
|
64
|
-
var latlng = new google.maps.LatLng(lat, lng);
|
65
|
-
this.debug('lat,lng', latlng);
|
66
|
-
|
67
|
-
var mapOptions = {
|
68
|
-
zoom: zoomLevel,
|
69
|
-
center: latlng,
|
70
|
-
mapTypeId: mapType
|
71
|
-
};
|
72
|
-
|
73
|
-
this.debug('map options', mapOptions);
|
74
|
-
|
75
|
-
// the geocoder object allows us to do latlng lookup based on address
|
76
|
-
this.geocoder = new google.maps.Geocoder();
|
77
|
-
|
78
|
-
var self = this;
|
79
|
-
|
80
|
-
if (typeof(mapElem) == 'undefined') {
|
81
|
-
this.showError("Map element " + opts['mapElem'] + " could not be resolved!");
|
82
|
-
}
|
83
|
-
|
84
|
-
self.debug('mapElem', this.mapElem);
|
85
|
-
|
86
|
-
if (!mapElem) { return }
|
87
|
-
|
88
|
-
// create our map object
|
89
|
-
this.map = new google.maps.Map(mapElem, mapOptions);
|
90
|
-
|
91
|
-
if (!this.map) { return }
|
92
|
-
|
93
|
-
// the marker shows us the position of the latest address
|
94
|
-
this.marker = new google.maps.Marker({
|
95
|
-
map: this.map,
|
96
|
-
draggable: true
|
97
|
-
});
|
98
|
-
|
99
|
-
self.addMapListeners(this.marker, this.map);
|
100
|
-
},
|
101
|
-
|
102
|
-
debug: function(label, obj) {
|
103
|
-
if (!this.debugOn) { return }
|
104
|
-
console.log(label, obj);
|
105
|
-
},
|
106
|
-
|
107
|
-
addMapListeners: function(marker, map) {
|
108
|
-
self = this;
|
109
|
-
// event triggered when marker is dragged and dropped
|
110
|
-
google.maps.event.addListener(marker, 'dragend', function() {
|
111
|
-
self.geocodeLookup( 'latLng', marker.getPosition() );
|
112
|
-
});
|
113
|
-
|
114
|
-
// event triggered when map is clicked
|
115
|
-
google.maps.event.addListener(map, 'click', function(event) {
|
116
|
-
marker.setPosition(event.latLng)
|
117
|
-
self.geocodeLookup( 'latLng', event.latLng );
|
118
|
-
});
|
119
|
-
},
|
120
|
-
|
121
|
-
// move the marker to a new position, and center the map on it
|
122
|
-
defaultUpdateMap: function( geometry ) {
|
123
|
-
var map = this.map;
|
124
|
-
var marker = this.marker;
|
125
|
-
|
126
|
-
if (map) {
|
127
|
-
map.fitBounds( geometry.viewport )
|
128
|
-
}
|
129
|
-
|
130
|
-
if (marker) {
|
131
|
-
marker.setPosition( geometry.location )
|
132
|
-
}
|
133
|
-
},
|
134
|
-
|
135
|
-
// fill in the UI elements with new position data
|
136
|
-
defaultUpdateUI: function( address, latLng ) {
|
137
|
-
$(this.inputField).autocomplete("close");
|
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);
|
145
|
-
|
146
|
-
this.positionOutputter(latLng);
|
147
|
-
},
|
148
|
-
|
149
|
-
defaultPositionOutputter: function(latLng) {
|
150
|
-
$('#gmaps-output-latitude').html(latLng.lat());
|
151
|
-
$('#gmaps-output-longitude').html(latLng.lng());
|
152
|
-
},
|
153
|
-
|
154
|
-
// Query the Google geocode object
|
155
|
-
//
|
156
|
-
// type: 'address' for search by address
|
157
|
-
// 'latLng' for search by latLng (reverse lookup)
|
158
|
-
//
|
159
|
-
// value: search query
|
160
|
-
//
|
161
|
-
// update: should we update the map (center map and position marker)?
|
162
|
-
geocodeLookup: function( type, value, update ) {
|
163
|
-
// default value: update = false
|
164
|
-
update = typeof update !== 'undefined' ? update : false;
|
165
|
-
|
166
|
-
request = {};
|
167
|
-
request[type] = value;
|
168
|
-
|
169
|
-
this.geocoder.geocode(request, performGeocode);
|
170
|
-
},
|
171
|
-
|
172
|
-
performGeocode: function(results, status) {
|
173
|
-
this.debug('performGeocode', status);
|
174
|
-
|
175
|
-
$(self.errorField).html('');
|
176
|
-
if (status == google.maps.GeocoderStatus.OK) {
|
177
|
-
self.geocodeSuccess(results);
|
178
|
-
} else {
|
179
|
-
self.geocodeFailure(type, value);
|
180
|
-
};
|
181
|
-
},
|
182
|
-
|
183
|
-
geocodeSuccess: function(results) {
|
184
|
-
this.debug('geocodeSuccess', results);
|
185
|
-
// Google geocoding has succeeded!
|
186
|
-
if (results[0]) {
|
187
|
-
// Always update the UI elements with new location data
|
188
|
-
this.updateUI( results[0].formatted_address,
|
189
|
-
results[0].geometry.location )
|
190
|
-
|
191
|
-
// Only update the map (position marker and center map) if requested
|
192
|
-
if( update ) { this.updateMap( results[0].geometry ) }
|
193
|
-
} else {
|
194
|
-
// Geocoder status ok but no results!?
|
195
|
-
this.showError( this.geocodeErrorMsg() );
|
196
|
-
}
|
197
|
-
},
|
198
|
-
|
199
|
-
geocodeFailure: function(type, value) {
|
200
|
-
this.debug('geocodeFailure', type);
|
201
|
-
// Google Geocoding has failed. Two common reasons:
|
202
|
-
// * Address not recognised (e.g. search for 'zxxzcxczxcx')
|
203
|
-
// * Location doesn't map to address (e.g. click in middle of Atlantic)
|
204
|
-
if( type == 'address' ) {
|
205
|
-
// User has typed in an address which we can't geocode to a location
|
206
|
-
this.showError( this.invalidAddressMsg(value) );
|
207
|
-
} else {
|
208
|
-
// User has clicked or dragged marker to somewhere that Google can't do a reverse lookup for
|
209
|
-
// In this case we display a warning, clear the address box, but fill in LatLng
|
210
|
-
this.showError( this.noAddressFoundMsg() );
|
211
|
-
this.updateUI('', value)
|
212
|
-
}
|
213
|
-
},
|
214
|
-
|
215
|
-
geocodeErrorMsg: function() {
|
216
|
-
"Sorry, something went wrong. Try again!"
|
217
|
-
},
|
218
|
-
|
219
|
-
invalidAddressMsg: function(value) {
|
220
|
-
"Sorry! We couldn't find " + value + ". Try a different search term, or click the map."
|
221
|
-
},
|
222
|
-
|
223
|
-
noAddressFoundMsg: function() {
|
224
|
-
"Woah... that's pretty remote! You're going to have to manually enter a place name."
|
225
|
-
},
|
226
|
-
|
227
|
-
showError: function(msg) {
|
228
|
-
$(this.errorField).html(msg);
|
229
|
-
$(this.errorField).show();
|
230
|
-
|
231
|
-
setTimeout(function(){
|
232
|
-
$(this.errorField).hide();
|
233
|
-
}, 1000);
|
234
|
-
},
|
235
|
-
|
236
|
-
// initialise the jqueryUI autocomplete element
|
237
|
-
autoCompleteInit: function (opts) {
|
238
|
-
opts = opts || {};
|
239
|
-
this.region = opts['region'] || 'DK';
|
240
|
-
this.country = opts['country'] || 'Denmark';
|
241
|
-
this.debug('region', this.region)
|
242
|
-
|
243
|
-
var self = this;
|
244
|
-
|
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
|
-
|
252
|
-
// source is the list of input options shown in the autocomplete dropdown.
|
253
|
-
// see documentation: http://jqueryui.com/demos/autocomplete/
|
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
|
-
}
|
283
|
-
});
|
284
|
-
|
285
|
-
// triggered when user presses a key in the address box
|
286
|
-
$(self.inputField).bind('keydown', this.keyDownHandler);
|
287
|
-
}, // autocomplete_init
|
288
|
-
|
289
|
-
keyDownHandler: function(event) {
|
290
|
-
if(event.keyCode == 13) {
|
291
|
-
this.geocodeLookup( 'address', $(self.inputField).val(), true );
|
292
|
-
|
293
|
-
// ensures dropdown disappears when enter is pressed
|
294
|
-
$(this.inputField).autocomplete("disable")
|
295
|
-
} else {
|
296
|
-
// re-enable if previously disabled above
|
297
|
-
$(this.inputField).autocomplete("enable")
|
298
|
-
}
|
299
|
-
}
|
300
|
-
}
|