var map = null;
var geocoder;
var markerStash = new Array();
var listings = new Array();
var initialPoint;

google.load("maps", "2.x");
$("map").setStyle("width", document.getSize().x - 420);
$("map").setStyle("height", document.getSize().y - 100);
$("list").setStyle("height", document.getSize().y - 120);

// Call this function when the page has been loaded
function initialize() {
	/*
	$("shit").addEvent("click", function (){
		alert(window.frames[0].document.getElementById('list').innerHTML); 
		return false;
	});
	*/
  initialPoint = new GLatLng(initialLat, initialLng);

	if(GBrowserIsCompatible())  {
		geocoder = new GClientGeocoder();

		map = new google.maps.Map2($("map"));
		// if this is not right after the map is instantiated, the event doesnt fire...
		GEvent.addListener(map, "load", function (){
			if(markerStash.length > 0)
				{
				for (var i=0; i<markerStash.length; i++)
					{
					var marker = markerStash[i];
					map.addOverlay(marker);
					marker.setImage("http://www.google.com/ig/modules/re_marker" + marker.rezideID + "_green.png");
					}
				}

			});

		map.setCenter(initialPoint, 13);
		var marker = new GMarker(initialPoint);
		map.addOverlay(marker);
		marker.openInfoWindowHtml('<div style="width: 350px;">' + 
				'<h1>Welcome to Rezide,</h1>'+
				'<p>View the featured listings to the right or perform your own search above. To do so:</p>' +
				'<p>1.  Enter a city or address around where you would like to buy or rent a home.</p>' +
        '<p>2.  Click "Get Map"</p>' + 
        '<p>3.  Click one of the other buttons to search for sales or rentals on the map.</p>' +
				'<p>You can drag the map or zoom in to refine or narrow your search area.  Click the for sale / rent buttons again to research.</p></div>');

		// TODO: add street view
		var mapControl = new GMapTypeControl();
		map.addControl(mapControl);
		map.addControl(new GLargeMapControl());

		$("search").addEvent("click", function (){
			showAddress($("location").get("value"));
			return false;
			});

		$("sale").addEvent("click", function (){
			search("sale");
			return false;
			});

		$("rent").addEvent("click", function (){
			search("rent");
			return false;
			});


    $$("ul#list li").each(function(li){
      li.addEvent("mouseover", function(){
        li.addClass("over");
        });
      li.addEvent("mouseout", function(){
        li.removeClass("over");
        });
      li.addEvent("click", function(){
        showWindow(this.id.substr(7));
        });
      });

		/*
		$("foreclosure").addEvent("click", function (){
			search("foreclosure");
			return false;
			});
		*/
		}
	}

function showAddress(address) {
	geocoder.getLatLng(address,	function(point) {
		if (!point) {
			alert(address + " not found");
			} 
		else {
			map.setCenter(point, 16);
			var marker = new GMarker(point);
			map.addOverlay(marker);
			marker.openInfoWindowHtml(address);
			return false;
			}
		});
	}

function search(type)
	{
	markerStash = new Array();
	var bounds = map.getBounds();
	var sw = bounds.getSouthWest();
	var ne = bounds.getNorthEast();
	
	var url = "/list/?min=" + $("min").get("value") + "&max=" + $("max").get("value") + "&swlat=" + escape(sw.lat()) + "&swlng=" + escape(sw.lng()) + "&nelat=" + escape(ne.lat()) + "&nelng=" + escape(ne.lng()) + "&type=" + type + "&start=1";
	if(!$("listingBox").iframe)
		{
		var iframe = new IFrame({    styles: {
        width: 400,
        height: document.getSize().y - 100,
        border: 'none'}
				});
		$("listingBox").iframe = iframe
		$("listingBox").set("html", "");
		$("listingBox").grab(iframe);
		}

	$("listingBox").iframe.src = url;

	return;
	}

function pushListing(listingIN)
	{
	var listing = JSON.decode(listingIN);
	listings[listing.id] = listing;

	var marker = new GMarker(new GLatLng(listing.lat, listing.lng));
	marker.rezideID = listing.id;
	markerStash.push(marker);
	GEvent.addListener(marker, "click", function (){
		showWindow(this.rezideID);
		});

	if (map)
		{
		map.addOverlay(marker);
		marker.setImage("http://www.google.com/ig/modules/re_marker" + listing.id + "_green.png");
		}
	}

function showWindow(id)
	{
	var listing = listings[id];
	var marker = markerStash[id-1];

	marker.openInfoWindowHtml("<div style='height: 140px;'>" + 
														"<img src=http://base.googlehosted.com/base_media?q=" + listing.img + "&size=3><br>" + 
														"<a href='"+ unescape(listing.link) + "' target='_blank'>View Listing</a><br>" +
														"</div>");
	}

function clearMap()
	{
	if(map)
		map.clearOverlays();

	markerStash = new Array();
	}

google.setOnLoadCallback(initialize);
