Skip to content

Instantly share code, notes, and snippets.

@meeech
Created March 10, 2011 15:38
Show Gist options
  • Save meeech/864285 to your computer and use it in GitHub Desktop.
Save meeech/864285 to your computer and use it in GitHub Desktop.
used for google maps api- rough
//Requires
//jquery and
//<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
(function() {
// Being Closure
var map = false;
geocoder = false;
currentMarker = false;
dragEndListener = false;
clickedNext = false;
intialLocation = false;
// Fields we'll be using
var fields = {
POSTAL_CODE: "#ActivityPostalCode",
ADDRESS_EN: "#ActivityLocationEn",
ADDRESS_FR: "#ActivityLocationFr",
LAT : "#ActivityLat",
LON : "#ActivityLon"
}
// A Handy place to store current values of fields
var current_values = {
address_en: $(fields.ADDRESS_EN).val(),
address_fr: $(fields.ADDRESS_FR).val(),
postal_code: $(fields.POSTAL_CODE).val(),
lat: $(fields.LAT).val(),
lon: $(fields.LON).val()
}
// Function used to initiate our map
var init = function() {
showMap();
}
// Function we use to show the map
var showMap = function(address) {
var mapOptions = {
"draggable": true,
"mapTypeControl": false,
"zoom": 14,
"mapTypeId": google.maps.MapTypeId.ROADMAP
}
$("#map_canvas").removeClass('util-hide');
$('#map_instructions').removeClass('util-hide');
map = map || initalizeMap();
geocoder = geocoder || new google.maps.Geocoder();
currentMarker = currentMarker || new google.maps.Marker({"map": map, "draggable":true});
currentMarker.setVisible(false);
// http://code.google.com/apis/maps/documentation/javascript/reference.html#MapsEventListener
if(!dragEndListener) {
dragEndListener = google.maps.event.addListener(currentMarker, 'dragend', dragEndHandler);
}
var geoOptions = {
region: 'CA' // we prefer Canadian results
}
if(address) {
geoOptions.address = address;
map.setZoom(14);
}
else if(current_values.lat && current_values.lon) {
geoOptions.address = current_values.lat+','+current_values.lon;
currentMarker.setVisible(true);
}
else if(current_values.address_en) {
geoOptions.address = current_values.address_en;
currentMarker.setVisible(true);
}
else if(current_values.address_fr) {
geoOptions.address = current_values.address_fr;
currentMarker.setVisible(true);
}
else {
geoOptions.address = 'Canada';
map.setZoom(3);
}
geocoder.geocode(geoOptions,geocodeHandler);
}
var geocodeHandler = function(results,status) {
switch(status) {
case(google.maps.GeocoderStatus.OK):
map.setCenter(results[0].geometry.location);
currentMarker.setPosition(results[0].geometry.location);
updateLatLon(results[0].geometry.location);
$.each(results[0].address_components, function(index,comp) {
if(comp.types && ('postal_code' == comp.types[0]) && comp.long_name.length > 3) {
$(fields.POSTAL_CODE).val(comp.long_name);
return false; //stop when we find first
}
});
break;
case(google.maps.GeocoderStatus.ZERO_RESULTS):
alert('There were no results for this address information. Please update your information and try again. | Il n\'y a pas de résultats pour ce adresse. S\'il vous plaît mettre à jour vos informations et essayez à nouveau.');
break;
default:
alert('We could not complete your request | Nous ne pouvions pas compléter votre demande');
break;
}
}
var initalizeMap = function() {
var mapOptions = {
"draggable": true,
"mapTypeControl": false,
"zoom": 14,
"mapTypeId": google.maps.MapTypeId.ROADMAP
};
return themap = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
}
// Function to validate a Canadian Postal Code, returns true or false
function isValidPostalCode(postal_code) {
pattern = /^[A-Z][0-9][A-Z]( )?[0-9][A-Z][0-9]$/i;
if(pattern.test(postal_code)) {
return true;
}else{
return false;
}
}
/**
* Handle the end of dragging the marker.
* RIght now, we just cause a new geocode lookup based on the latlng
* @param Object.latLng
*/
var dragEndHandler = function(o) {
//updateLatLon(o);
//Do a reverse geocode lookup based on the new lat lon to fill in the postal code.
geocoder.geocode({"region": 'CA', "location": o.latLng},geocodeHandler);
};
/**
* Used to handle updating the Lat and Lon fields of the activity submission form.
* @param LatLng Object
*/
var updateLatLon = function(LatLng) {
$(fields.LAT).val(LatLng.lat());
$(fields.LON).val(LatLng.lng());
};
var parseAddy = function() {
var addy = [];
if('' != $(fields.ADDRESS_EN).val()) {
addy.push($(fields.ADDRESS_EN).val());
}
//IF there was no en result, AND there is a french addy value, then...
if((0 == addy.length) && ('' != $(fields.ADDRESS_FR).val())) {
addy.push($(fields.ADDRESS_FR).val());
}
if('' != $(fields.POSTAL_CODE).val()) {
addy.push($(fields.POSTAL_CODE).val());
}
return addy.join(',');
};
$(document).ready(function() {
$(".next").click(function() {
if(!clickedNext) {
init();
clickedNext = true;
}
});
$(fields.ADDRESS_EN).blur(function() {
if($(this).val() == current_values.address_en) {
return false;
}else{
showMap($(this).val());
currentMarker.setVisible(true);
current_values.address_en = $(this).val();
}
});
$(fields.ADDRESS_FR).blur(function() {
if($(this).val() == current_values.address_fr) {
return false;
}else{
showMap($(this).val());
currentMarker.setVisible(true);
current_values.address_fr = $(this).val();
}
});
$(fields.POSTAL_CODE).blur(function() {
if($(this).val() == current_values.postal_code) {
return false;
}else{
showMap($(this).val());
currentMarker.setVisible(true);
current_values.postal_code = $(this).val();
}
});
});
// End Closure
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment