app/soc/content/js/map-090420.js

   1 role_profile_gmap = new function(){
   2   // Create global variables
   3   var map;
   4   var marker;
   5   var geocoder;
   6
   7   // The following strings can be customized to reflect ids in the page.
   8   // You can also add or remove fields used for GMap Geocoding in
   9   // the JSON address object
  10
  11   var current_lat = 0;
  12   var current_lng = 0;
  13
  14   // Two different levels for zoom: Starting one and an inner that
  15   // is used when showing the map if lat and lon page fields are set
  16   var world_zoom = 0;
  17   var country_zoom = 4;
  18   var state_zoom = 6;
  19   var city_zoom = 10;
  20   var address_zoom = 13;
  21
  22   // Do not add a starting # as this JQuery selector seems
  23   // incompatible with GMap API
  24   var map_div = "role_profile_map";
  25
  26   var field_lat = "#id_latitude";
  27   var field_lng = "#id_longitude";
  28   // Need to save old values to avoid unwanted updating
  29   // of lat and lot if marker dragged and blur another time an address field
  30   var address = {
  31     street: {
  32       id: "#id_res_street",
  33       old_value: ""
  34     },
  35     city: {
  36       id: "#id_res_city",
  37       old_value: ""
  38     },
  39     state: {
  40       id: "#id_res_state",
  41       old_value: ""
  42     },
  43     country: {
  44       id: "#id_res_country",
  45       old_value: ""
  46     },
  47     postalcode: {
  48       id: "#id_res_postalcode",
  49       old_value: ""
  50     }
  51   }
  52
  53   // Save current address fields in the JSON Object
  54   function saveOldAddress() {
  55     for (var a in address) {
  56       address[a].old_value = $(address[a].id).val();
  57     }
  58   }
  59
  60   // Return true if the user has edited address fields
  61   function isNewAddress() {
  62     for (var a in address) {
  63       if ($(address[a].id).val() != address[a].old_value) return true;
  64     }
  65     return false;
  66   }
  67
  68   // Write saved lat and lng values to page fields
  69   function setLatLngFields() {
  70     $(field_lat).val(current_lat);
  71     $(field_lng).val(current_lng);
  72   }
  73
  74   // Read lat and lng fields and store them
  75   function readLatLngFields() {
  76     current_lat = $(field_lat).val();
  77     current_lng = $(field_lng).val();
  78   }
  79
  80   // This function reads address fields, merge them and uses
  81   // GMap API geocoding to find the first hit
  82   // Using geocoding http://code.google.com/intl/it-IT/apis/maps/documentation/services.html#Geocoding
  83   function calculateAddress() {
  84     // If the user has really edited address fields...
  85     if (isNewAddress()) {
  86       // Merge address fields
  87       var address_string = "";
  88       for (var a in address) {
  89         address_string+=$(address[a].id).val();
  90         if (a!=address.length-1) {address_string+=","};
  91       }
  92
  93       // Ask GMap API for geocoding
  94       geocoder.getLatLng(
  95         address_string,
  96         function(point) {
  97           // If a point is found
  98           if (point) {
  99             // Save the current address in the JSON object
 100             saveOldAddress();
 101             // Set the new zoom, map center and marker coords
 102             var zoom_set = world_zoom;
 103             if ($(address.street.id).val()!="") zoom_set = address_zoom;
 104             else if ($(address.city.id).val()!="") zoom_set = city_zoom;
 105             else if ($(address.state.id).val()!="") zoom_set = state_zoom;
 106             else if ($(address.country.id).val()!="") zoom_set = country_zoom;
 107             map.setCenter(point, zoom_set);
 108             marker.setPoint(point);
 109             map.clearOverlays();
 110             map.addOverlay(marker);
 111             // Save point coords in local variables and then update
 112             // the page lat/lng fields
 113             current_lat = point.lat();
 114             current_lng = point.lng();
 115             setLatLngFields();
 116           }
 117         }
 118       );
 119     }
 120   }
 121
 122   // Public function to load the map
 123   this.map_load = function() {
 124     // All can happen only if there is gmap compatible browser.
 125     // TODO: Fallback in case the browser is not compatible
 126     if (GBrowserIsCompatible()) {
 127       // Save the address fields. This is useful if the page is being edited
 128       // to not update blindly the lat/lng fields with GMap geocoding if
 129       // blurring an address field
 130       saveOldAddress();
 131       var starting_point;
 132       var zoom_selected = world_zoom;
 133       var show_marker = true;
 134
 135       // Create the map and add small controls
 136       map = new GMap2(document.getElementById(map_div));
 137       map.addControl(new GSmallMapControl());
 138       map.addControl(new GMapTypeControl());
 139
 140       // Instantiate a global geocoder for future use
 141       geocoder = new GClientGeocoder();
 142
 143       // If lat and lng fields are not void (the page is being edited) then
 144       // update the starting coords, modify the zoom level and tells following
 145       // code to show the marker
 146       if ($(field_lat).val()!="" && $(field_lng).val()!="") {
 147         readLatLngFields();
 148         zoom_selected = address_zoom;
 149         show_marker = true;
 150       }
 151
 152       // Set map center, marker coords and show it if this is an editing
 153       starting_point = new GLatLng(current_lat,current_lng);
 154       map.setCenter(starting_point, zoom_selected);
 155       marker = new GMarker(starting_point, {draggable:true});
 156       if (show_marker) map.addOverlay(marker);
 157
 158       // Adds a new event listener to geocode the address when an address
 159       // field is blurred
 160       for (var a in address) {
 161         $(address[a].id).blur(calculateAddress);
 162       }
 163
 164       // Adds a new event listener: if the marker has been dragged around...
 165       GEvent.addListener(marker, "dragend", function() {
 166         // Update internal variables with current marker coords...
 167         current_lat = marker.getPoint().lat();
 168         current_lng = marker.getPoint().lng();
 169         // ...and set page fields accordingly
 170         setLatLngFields();
 171       });
 172     }
 173   }
 174 };
 175
 176 org_home_gmap = new function(){
 177   // Global variables
 178   var map;
 179
 180   // HTML div tag where map needs to be inserted
 181   var map_div = "org_home_map";
 182
 183   // Geo Data to be displayed on Google Maps
 184   var geo_data = null;
 185   var geo_data_keys = [];
 186
 187   // Geocoder object for obtaining locations from city/country
 188   var geocoder = new GClientGeocoder();
 189   var numGeocoded = 0;
 190
 191   // Setup required icons
 192   var base_icon = new GIcon();
 193   base_icon.shadow = "http://www.google.com/mapfiles/shadow50.png";
 194   base_icon.iconSize = new GSize(20, 34);
 195   base_icon.shadowSize = new GSize(37, 34);
 196   base_icon.iconAnchor = new GPoint(9, 34);
 197   base_icon.infoWindowAnchor = new GPoint(9, 2);
 198   base_icon.infoShadowAnchor = new GPoint(18, 25);
 199   var student_icon = new GIcon(base_icon);
 200   student_icon.image = "http://www.google.com/mapfiles/marker.png";
 201   var mentor_icon = new GIcon(base_icon);
 202   mentor_icon.image = "/soc/content/images/mentor-marker.png";
 203
 204   Object.prototype.keys = function ()
 205   {
 206     var keys = [];
 207     for(i in this) if (this.hasOwnProperty(i))
 208     {
 209       keys.push(i);
 210     }
 211     return keys;
 212   }
 213
 214
 215   // Mark student and enable a popup box upon click
 216   function drawMarker(person) {
 217     geocoder.setBaseCountryCode(person.ccTLD);
 218     geocoder.getLocations(
 219       person.city,
 220       function(response) {
 221         var delay = 0;
 222         if (response.Status.code == 620) {
 223           // Too fast, try again, with a small pause
 224           delay = 100;
 225         } else {
 226           if (response.Status.code == 200) {
 227             // Success; do something with the address.
 228             var html = "";
 229             var marker = null;
 230
 231             place = response.Placemark[0];
 232             point = new GLatLng(place.Point.coordinates[1],
 233                                 place.Point.coordinates[0]);
 234             if (person.type == 'mentor') {
 235               marker = new GMarker(point, mentor_icon);
 236               html = "<strong>" + person.name + "</strong><br> Mentor";
 237             } else if (person.type == 'student') {
 238               marker = new GMarker(point, student_icon);
 239               html = "<strong>" + person.name + "</strong><br>";
 240               html += "<a href='"+ person.url + "'>" + person.summary + "</a><br>";
 241               html += "Mentor: " + person.mentor;
 242             }
 243
 244             GEvent.addListener(marker, "click", function() {
 245               marker.openInfoWindowHtml(html);
 246             });
 247
 248             map.addOverlay(marker);
 249           }
 250
 251           // Move onto the next address; this skips bad addresses, too.
 252           numGeocoded += 1;
 253         }
 254
 255         window.setTimeout(geocodeAll, delay);
 256       }
 257     );
 258   }
 259
 260   // Draw a polyline between two points
 261   drawPolyLine = function(from, to) {
 262     var polyline = new GPolyline([from, to], "#ff0000", 3);
 263     map.addOverlay(polyline);
 264   }
 265
 266   function geocodeAll() {
 267     if (numGeocoded < geo_data_keys.length) {
 268       drawMarker(geo_data[geo_data_keys[numGeocoded]])
 269     }
 270   }
 271
 272   // Map load function
 273   this.map_load = function(map_data) {
 274     // Check if browser is gmap compatible.
 275     if (GBrowserIsCompatible()) {
 276       geo_data = map_data;
 277
 278       // Create the map and add small controls
 279       map = new GMap2(document.getElementById(map_div));
 280       map.addControl(new GLargeMapControl());
 281       map.addControl(new GMapTypeControl());
 282
 283       // Set map center and initial zoom level
 284       map.setCenter(new GLatLng(0, 0), 1);
 285       geocoder.setCache(null);
 286       geo_data_keys = geo_data.keys()
 287       window.setTimeout(geocodeAll, 50);
 288
 289     }
 290   }
 291 };