var map;
var markers_bucket = [];
var mc = null;

function addEvents() {
	//document.getElementById("region").onchange= function() { doAJAX('action=getNeighbourhoods&region_id=' + this.value); };
	document.getElementById("region").onchange= function() { 
		document.getElementById('neighbourhood').options[0].selected = 'true';
		buildGMap(); 
	};
	document.getElementById("neighbourhood").onchange = function() { 
		document.getElementById('region').options[0].selected = 'true';
		buildGMap(); 
	};
	document.getElementById("min_price").onchange = function() { buildGMap(); };
	document.getElementById("max_price").onchange = function() { buildGMap(); };
	document.getElementById("min_bedrooms").onchange = function() { buildGMap(); };
	document.getElementById("max_bedrooms").onchange = function() { buildGMap(); };
	
	document.getElementById("aListView").href = "javascript: listView()";
}

	
function listView() {
	document.getElementById("frmSearch").submit();
};

function ResetControl(controlDiv, map) {
	var resetDiv = document.createElement("div");
	resetDiv.id = 'divResetMap';
	resetDiv.className = 'classResetMap';
	controlDiv.appendChild(resetDiv);
	resetDiv.appendChild(document.createTextNode("Reset"));
	
	google.maps.event.addDomListener(resetDiv, "click", function() {
		resetMap();
	});
	
	google.maps.event.addDomListener(resetDiv, 'mouseover', function() {
		this.className = 'classResetMapOver';
	});
	google.maps.event.addDomListener(resetDiv, 'mouseout', function() {
		this.className = 'classResetMap';
	});
}

function initGMaps() {
	
	var latlng = new google.maps.LatLng(49.88871,-97.106781);
	var myOptions = {
		zoom: 10,
		center: latlng,
		mapTypeId: google.maps.MapTypeId.ROADMAP
	};
	map = new google.maps.Map(document.getElementById("map"), myOptions);
	var resetControlDiv = document.createElement("div");
	var resetControl = new ResetControl(resetControlDiv,map);
	resetControl.index = 1;
	map.controls[google.maps.ControlPosition.TOP_LEFT].push(resetControlDiv);
	
	buildGMap();
}

function buildGMap() {
	
	//clear out old markers
	//map.clearOverlays();
	
	// have to clear any existing overlays manually
	
	//
	//get the parameters for the house search
	params = 'action=getGMapsHomesXML';
	params+= '&region=' + document.getElementById('region').value;
	params+= '&neighbourhood=' + document.getElementById('neighbourhood').value;
	params+= '&min-price=' + document.getElementById('min_price').value;
	params+= '&max-price=' + document.getElementById('max_price').value;
	params+= '&min-bedrooms=' + document.getElementById('min_bedrooms').value;
	params+= '&max-bedrooms=' + document.getElementById('max_bedrooms').value;
	params+= '&category=' + document.getElementById('category').value;
	//read the data from XML string
	doAJAX(params,showMarkers);
}

function changeOption(optType, optId) {
	obj = document.getElementById(optType);
	for(var i=0; i<obj.length; i++) {
		if(obj.options[i].value == optId) {
			obj.options[i].selected = 'true';
			break;
		}
	}
}

//remove any markers currently being displayed
function clearOverlays() {
  if (markers_bucket) {
    for (i in markers_bucket) {
      markers_bucket[i].setMap(null);
    }
  }
  if (mc) {
	mc.clearMarkers();
  }
}
function showMarkers(xml) {
	
	

	
	function makeMarker(options){
		var pushPin = new google.maps.Marker(options);
		google.maps.event.addListener(pushPin, 'click', function(){
			infoWindow.setOptions(options);
			infoWindow.open(map, pushPin);
		});
		
		google.maps.event.addListener(pushPin, "mouseover",  function() {
			drc(options.summary,'');
			return true;
		});
		google.maps.event.addListener(pushPin, "mouseout", function() {
			nd(); 
			return true;
		});
		return pushPin;
	}
	
	var customMarker = new google.maps.MarkerImage('/images/googlemaps/homemarker.png',
						       new google.maps.Size(20,34),
						       new google.maps.Point(0,0)
						       );
	
	var customMarkerShadow = new google.maps.MarkerImage('http://www.google.com/mapfiles/shadow50.png',
							     new google.maps.Size(50,34),
							     new google.maps.Point(0,0),
							     new google.maps.Point(12,34) 
							     );
	
	var infoWindow = new google.maps.InfoWindow({autoScroll:false});
	
	google.maps.event.addListener(map, 'click', function(){
		infoWindow.close();
	});
	
		
	
	var MapLevel = xml.getElementsByTagName("MapLevel");
	cLat = parseFloat(MapLevel[0].getAttribute("lat"));
	cLng = parseFloat(MapLevel[0].getAttribute("lng"));
	zoom = parseInt(MapLevel[0].getAttribute("zoom"));
	map.setCenter(new google.maps.LatLng(cLat, cLng));
	map.setZoom(zoom);
	

	document.getElementById('number_properties').innerHTML = '<h4>' + xml.getElementsByTagName('HomesCount')[0].childNodes[0].nodeValue + ' properties</h4>';
	clearOverlays();
	
	// obtain the array of markers and loop through it
	var markers = xml.getElementsByTagName("Home");
	markers_bucket = [];
	
	for (var i = 0; i < markers.length; i++) {
		var lat = parseFloat(markers[i].getAttribute("lat"));
		var lng = parseFloat(markers[i].getAttribute("lng"));
		var optId = parseInt(markers[i].getElementsByTagName("id")[0].childNodes[0].nodeValue);
		if(!isNaN(lat) && !isNaN(lng)) {
			var html = markers[i].getElementsByTagName("html")[0].childNodes[0].nodeValue;
			var bedrooms = markers[i].getElementsByTagName("bedrooms")[0].childNodes[0].nodeValue;
			var price = markers[i].getElementsByTagName("price")[0].childNodes[0].nodeValue;
			var address = (markers[i].getElementsByTagName("address")[0].childNodes[0] != null) ? markers[i].getElementsByTagName("address")[0].childNodes[0].nodeValue : '';
			
			markers_bucket.push(makeMarker({
				position: new google.maps.LatLng(lat,lng),
				summary: address + ': ' + bedrooms + ' beds $' + price,
				content: html,
				shadow: customMarkerShadow,
				icon: customMarker
			}));				
		}
	}
	
	var mcOptions = {gridSize: 40, maxZoom: 13, styles: [{url: '/images/googlemaps/multiplehomemarker.png', width: 40, height: 35, anchor:[5,0], textColor: 'white'}]};
	mc = new MarkerClusterer(map, markers_bucket, mcOptions);
	
	
}


function resetMap() {
	document.getElementById('neighbourhood').options[0].selected = 'true';
	document.getElementById('region').options[0].selected = 'true';
	document.getElementById("min_price").options[0].selected = 'true';
	document.getElementById("max_price").options[0].selected = 'true';
	document.getElementById("min_bedrooms").options[0].selected = 'true';
	document.getElementById("max_bedrooms").options[0].selected = 'true';
	buildGMap();
}

addLoadEvent(addEvents);
addLoadEvent(initGMaps);