Skip to content

Instantly share code, notes, and snippets.

@ashaw
Created December 11, 2010 19:55
Show Gist options
  • Save ashaw/737609 to your computer and use it in GitHub Desktop.
Save ashaw/737609 to your computer and use it in GitHub Desktop.
<style>
#q,#shadow_q {
position:absolute;
top:5px;
left:5px;
width:500px;
height:30px;
font-size:25px;
}
#q {
z-index:999;
color:#000;
opacity:.75;
}
#shadow_q {
z-index:0;
color:#000;
}
#submit-btn {
position:absolute;
top:5px;
left:550px;
height:30px;
}
</style>
<form id="query">
<input id="q" type="text"></input>
<input id="submit-btn" type="submit" value="submit" />
<!--
important that shadow_q be the last "tabbable" element,
because the js skips focus back to first input
-->
<input id="shadow_q" type="text"></input>
</form>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
var addrs;
var accepted_suggestion = false;
var field_is_empty = function(id) {
return ($("#" + id).val() === "") ? true : false;
};
var accept_suggestion = function() {
return ( accepted_suggestion == false && !field_is_empty("q") && !field_is_empty("shadow_q") ) ? true : false;
};
var load_stored_addrs = function() {
return window.localStorage['addrs'] ? JSON.parse(window.localStorage['addrs']) : []
};
var add_addr_to_stor = function(addr) {
addrs = [];
if (window.localStorage['addrs']) {
addrs = JSON.parse(window.localStorage['addrs'])
}
addrs.push(addr);
window.localStorage['addrs'] = JSON.stringify(addrs);
};
var geocoder = new google.maps.Geocoder();
var cur_google_suggestion = '';
var get_google_suggestions = function(addr) {
if(addr == "") {
cur_google_suggestion = '';
return;
}
geocoder.geocode({'address': addr}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
console.log(results[0].formatted_address)
cur_google_suggestion = results[0].formatted_address;
} else {
console.log("uh oh");
}
});
}
$(function() {
$("#q").keyup(function() {
get_google_suggestions($("#q").val());
$("#shadow_q").val(cur_google_suggestion);
});
// accept suggestions on tab and right arrow
$("#q").keydown(function(e) {
if ( (e.keyCode === 9 || e.keyCode === 39) && accept_suggestion() ) {
e.preventDefault();
accepted_suggestion = true;
$("#q").val($("#shadow_q").val());
} else {
accepted_suggestion = false;
}
});
// if you focus on #shadow_q, move
// focus back to #q
$("#shadow_q").focus(function() {
$("#q").focus();
});
// store
$("#query").submit(function(e) {
e.preventDefault();
addr = $("#q").val();
add_addr_to_stor(addr);
$("#q").val('')
});
});
</script>
@thejefflarson
Copy link

Sweet!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment