var map = null;
function initializeMap() {
	var myLatlng = new google.maps.LatLng(37.4419,-122.14190000000002);
	var myOptions = {
			zoom: 11,
			center: myLatlng,
			mapTypeId: google.maps.MapTypeId.ROADMAP, 
			streetViewControl:false,
			mapTypeControl:false,
			zoomControlOptions:{zoomControlStyle:'SMALL'}
	    }	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	
	//google.maps.event.addListener(map, 'zoom_changed', updateZoom);
}

function showAddress(lat, lng) {
	var image = new google.maps.MarkerImage('/mug/images/marker.png', 
			new google.maps.Size(31,41),
			new google.maps.Point(0,0),
			new google.maps.Point(12, 33));
	var shadow = new google.maps.MarkerImage('/mug/images/marker_shadow.png', 
			new google.maps.Size(47,41),
			new google.maps.Point(0,0),
			new google.maps.Point(12, 33));

	
	var point = new google.maps.LatLng(lat, lng)
	map.setCenter(point);

    mainMarker = new google.maps.Marker({
		position:point, 
		map:map, 
		icon:image,
		shadow:shadow
	});
}			

function panTo(lat, lng) {    
	var point = new GLatLng(lat, lng);
	mainMarker.setLatLng(point); 
   	map.panTo(point);
}

var overImage = new google.maps.MarkerImage('/mug/images/marker_over.png', 
		new google.maps.Size(25,37),
		new google.maps.Point(0,0),
		new google.maps.Point(12, 34));
var image = new google.maps.MarkerImage('/mug/images/marker_d.png', 
		new google.maps.Size(25,37),
		new google.maps.Point(0,0),
		new google.maps.Point(12, 34));
var shadow = new google.maps.MarkerImage('/mug/images/marker_d_shadow.png', 
		new google.maps.Size(33,37),
		new google.maps.Point(0,0),
		new google.maps.Point(12, 34));

var markers = [];
var markerObjs = [];
var iterator = 0;

var userZoom = false;

function addOtherLocs(numbered, newLocs){

	if(newLocs){
		if (markers) {
	      for (i in markers) {
	        markers[i].setMap(null);
	      }
	      markers.length = 0;
	    }
	
		otherLocs = newLocs;
	}

	var point = new google.maps.LatLng(0,0);
	
	var bounds = new google.maps.LatLngBounds();

	for(var i = 0; i < otherLocs.length; i++){
		var point = new google.maps.LatLng(otherLocs[i][0], otherLocs[i][1]);
		
		var marker = {
			position:point,
			clickable:true,
			icon:image,
			map:map,
			shadow:shadow,
			i:i
		};
		markerObjs.push(marker);
		
		if(newLocs && otherLocs.length < 50){
			marker.animation = google.maps.Animation.DROP;
		}
		
		setTimeout(function(){
			addMarker();
		}, i*25);
		
		if(numbered == true){
			var numImage = new google.maps.MarkerImage('/mug/images/marker_'+(i+1)+'.png', 
					new google.maps.Size(29,42),
					new google.maps.Point(0,0),
					new google.maps.Point(12, 37));
					
			marker.setIcon(numImage);
		}else{
			google.maps.event.addListener(marker, 'mouseover', selectLocation);
			google.maps.event.addListener(marker, 'mouseout', unselectLocation);			
			google.maps.event.addListener(marker, 'mousedown', clickLocation);
		}

		
		
		bounds.extend(point);
	}
	
	if(map.getZoom() <= 12){
		map.fitBounds(bounds)
		if(map.getZoom() < 11){
			map.setZoom(map.getZoom() + 1);
		}else if(map.getZoom() > 16){
			map.setZoom(16)
		}
	}

}

function addMarker(marker){
	//console.log('--'+markerObjs[iterator].i);

	var m = new google.maps.Marker(markerObjs[iterator]);
	markers.push(m);
	iterator++;
}

function selectLocation(){
	var nearby = ".nearby_"+Number(1+this.i);
	markers[this.i].setIcon(overImage);
	$(nearby).addClass("active");
}
function unselectLocation(){
	var nearby = ".nearby_"+Number(1+this.i);
	markers[this.i].setIcon(image);
	$(nearby).removeClass("active");
}

var overlay = false;
function clickLocation(){
	console.log('click')
	$(document).mouseup(function(e){
		$(document).unbind('mouseup', null);
		
		var x = e.pageX - 120;
		var y = e.pageY - 110;

		if(overlay){
			$('#mapoverlay').css({'left':x, 'top':y, 'opacity':1})
		}else{
			var html = '<div id="mapoverlay" style="opacity:1, top:'+y+'px; left:'+x+'px;">Map Overlay</div>';
			$('body').prepend(html);
			overlay = true;
		}

   	});

}