gistfile1.js

	var drinks;	
		
	(function($){
		
	  	$.getJSON('/test/', function(data) {
			alert('success');
			drinks = data;
		});

		var date = new Date();
	    var map = new GMap2(document.getElementById("front_map"));
		var bounds = new GLatLngBounds();
	    map.setCenter(new GLatLng(37.4419, -122.1419), 12);
	    map.setUIToDefault();
	    var markers = [];
	    var bounds = map.getBounds(); 
	    var southWest = bounds.getSouthWest(); 
	    var northEast = bounds.getNorthEast(); 
	    var lngSpan = northEast.lng() - southWest.lng(); 
	    var latSpan = northEast.lat() - southWest.lat(); 
	    for (var i = 0; i<drinks.length; i++) {
	      var point = new GLatLng(drinks[i].latitude, drinks[i].longitude);
	      marker = new GMarker(point); 
	      map.addOverlay(marker);
	 	  bounds.extend(marker.getPoint());
	      markers[i] = marker;
	    }
        map.setCenter(new GLatLng(drinks[0].latitude, drinks[0].longitude), 13);

	    //map click event listeners to all map points
	    $(markers).each(function(i,marker){ 
			
			date = humaneDate(drinks[i].date);
			
	       $("<div class='item'></div>")
				.html("<h1><a href='/profile/"+drinks[i].user_id+"/'>"+drinks[i].username+"</a> drank a <a href='/brew/"+drinks[i].brew_id+"/'>"+drinks[i].brew+"</a> <span class='date'>"+date+"")
				.mouseover(function(){ 
	            	map.displayPoint(marker.getLatLng()); 
	            }).click(function(){ 
	                displayPoint(marker.getLatLng()); 
	                }).appendTo("#drink_list").addClass("list");

		    GEvent.addListener(marker, "click", function(){
			    displayPoint(marker.getLatLng());
		    });
	
	  });
		$("#message").appendTo(map.getPane(G_MAP_FLOAT_SHADOW_PANE));
		
		function displayPoint(marker, index){
			$("#message").hide();
			
			var moveEnd = GEvent.addListener(map, "moveend", function(){
				var markerOffset = map.fromLatLngToDivPixel(marker.getLatLng());
				$("#message")
					.fadeIn()
					.css({ top:markerOffset.y, left:markerOffset.x });
			
				GEvent.removeListener(moveEnd);
			});
			map.panTo(marker.getLatLng());
		}	

	})(this.jQuery);