var map;
var geocoder;

// Create our "tiny" marker icon
var pinIcon = new GIcon();
pinIcon.image = "/assets/img/pin.png";
pinIcon.transparent = "/assets/img/pin-trans.png";
pinIcon.imageMap = [0,0, 63,0, 63,43, 0,43];
pinIcon.iconSize = GSize(63, 43);
pinIcon.iconAnchor = new GPoint(30, 40);
pinIcon.infoWindowAnchor = new GPoint(30, 40);

// Icon.image = '/images/pin_blue.png';
// Icon.transparent = '/images/pin_transparent.png';
// Icon.imageMap = [14,0, 27,5, 20,15, 23,19, 19,24, 13,24, 5,18, 9,12,
// 13,5, 12,3];
//
// Icon.iconSize = new GSize(32, 32);
// Icon.shadowSize = new GSize(59, 32);
// Icon.iconAnchor = new GPoint(10, 31);
// Icon.infoWindowAnchor = new GPoint(15, 6);


// Set up our GMarkerOptions object
var markerOptions = { icon:pinIcon };

function initialize() {

	if (GBrowserIsCompatible()) {

		map = new GMap2(document.getElementById("map"));
		map.addControl(new GLargeMapControl());
		map.clearOnMove = true;

		GEvent.addListener(map,"moveend", refreshmap );

		map.setCenter(new GLatLng(40, -100), 3);
		refreshmap();

		geocoder = new GClientGeocoder();

	}

}

function refreshmap(){

	if (map.clearOnMove == true){

		var zoom = map.getZoom();

		var bounds = map.getBounds();
		var southWest = bounds.getSouthWest();
		var northEast = bounds.getNorthEast();

		if ( northEast.lng() < southWest.lng()){
			var lng1 = northEast.lng();
			var lng2 = southWest.lng();
		} else {
			var lng1 = southWest.lng();
			var lng2 = northEast.lng();
		}

		if ( northEast.lng() < southWest.lng()){
			var lat1 = northEast.lat();
			var lat2 = southWest.lat();
		} else {
			var lat1 = southWest.lat();
			var lat2 = northEast.lat();
		}

		if (zoom < 10){

			var req = newXMLHttpRequest();
			var handlerFunction = getReadyStateHandler(req, catchPoints);
			req.onreadystatechange = handlerFunction;

			// get a response back from this request
			req.open("POST", "getZipcodes.php", true);
			req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
			req.send('lng1=' + lng1 + '&lng2=' + lng2 + '&lat1=' + lat1 + '&lat2=' + lat2);

		} else {

			var req = newXMLHttpRequest();
			var handlerFunction = getReadyStateHandler(req, catchPoints);
			req.onreadystatechange = handlerFunction;

			// get a response back from this request
			req.open("POST", "getPoints.php", true);
			req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
			req.send('lng1=' + lng1 + '&lng2=' + lng2 + '&lat1=' + lat1 + '&lat2=' + lat2);

		}

	} else {
		setTimeout('map.clearOnMove = true;',300);
	}

}

function catchPoints( responseXML ){

	map.clearOverlays();

	var points = responseXML.getElementsByTagName('point')

	for (i=0;i<points.length;i++){

		map.addOverlay( makeMarker(points[i]) );

	}

}

function makeMarker(point){

	var latlag = new GLatLng( point.getAttribute('lat'), point.getAttribute('lng') );
	var marker = new GMarker( latlag, markerOptions );

	var bounds = map.getBounds();
	var southWest = bounds.getSouthWest();
	var northEast = bounds.getNorthEast();
	var lngSpan = northEast.lng() - southWest.lng();
	var latSpan = northEast.lat() - southWest.lat();

// 	alert( ( point.lat() + (latSpan/2) ) );
// 	alert( (point.lng()*1) + (lngSpan/2)  );

	var pan = new GLatLng( (latlag.lat()*1) + (latSpan * .25), (latlag.lng()*1) + (latSpan * .05) );

	GEvent.addListener(marker,"click", function() {
		map.clearOnMove = false;
		marker.openInfoWindowHtml( makeInfoWall(point) ); ;
		map.panTo(pan);
	} );

	return marker;

}

function makeInfoWall(point){

	if (point.getElementsByTagName('name')[0].firstChild){
		var name =  point.getElementsByTagName('name')[0].firstChild.nodeValue;
	} else {
		var name = '';
	}

	if (point.getElementsByTagName('location')[0].firstChild){
		var location =  point.getElementsByTagName('location')[0].firstChild.nodeValue;
	} else {
		var location = '';
	}

	if (point.getElementsByTagName('image')[0]){
		var image = point.getElementsByTagName('image')[0].firstChild.nodeValue;
	} else if (point.getElementsByTagName('video')[0]){
		var video = point.getElementsByTagName('video')[0].firstChild.nodeValue
	}

	if (point.getElementsByTagName('message')[0].firstChild) {
		var message = point.getElementsByTagName('message')[0].firstChild.nodeValue;
	} else {
		var message = '';
	}

	var HTML = "<div style='height: 200px; width: 380px;'>";

	if (video){
		HTML += "<div style='float:left; width: 280px;'><object width='260' height='195'><param name='movie' value='http://www.youtube.com/v/" + video + "&amp;autoplay=2' /><param name='wmode' value='transparent' /><embed src='http://www.youtube.com/v/" + video + "&amp;autoplay=2' type='application/x-shockwave-flash' wmode='transparent' width='260' height='195'></embed></object></div>";
	} else if (image){
		HTML += "<div style='float:left; width: 280px;'><img src='/assets/popup/" + image + "' /></div>";
	}

	HTML += "<div style='float:left; padding-top: 10px; text-align:left; width: 100px;'><b>" + name + '</b><br/>' + location + '<br/>' + message + "</div>";
	HTML += '</dvi>';

	return HTML;

}

function showAddress(address) {
	if (geocoder) {
		geocoder.getLatLng(
		address,
		function(point) {
			if (!point) {
			alert(address + " not found");
			} else {
			map.setCenter(point, 13);
			alert (point.x + ' ' + point.y);
			var marker = new GMarker(point);
			map.addOverlay(marker);
			// marker.openInfoWindowHtml('HERE');
			}
		}
		);
	}
}
