var gmap_address_point = null;
var products;
var map;
var gsv = null;
var haveCentered;
var redMarker;
var greenMarker;
var markerCluster;
var bounds;
var loaded;

//google map init
function initial() {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map_canvas"));
		map.setUIToDefault();
		//map.addControl(new GLargeMapControl());
		//map.addControl(new GMapTypeControl());
		//map.addControl(new GScaleControl());
		map.addControl(new GOverviewMapControl());
		map.enableScrollWheelZoom();
		var baseIcon = new GIcon();
		baseIcon.shadow = "";
		baseIcon.iconSize = new GSize(36, 36);
		baseIcon.shadowSize = new GSize(36, 36);
		baseIcon.iconAnchor = new GPoint(18, 36);
		baseIcon.infoWindowAnchor = new GPoint(18, 18);
		var redIcon = new GIcon(baseIcon);
		redIcon.image="images/Markers/Red/36/1.png";
		var greenIcon = new GIcon(baseIcon);
		greenIcon.image="images/Markers/Green/36/1.png";
		redMarker = { icon:redIcon };
		greenMarker = { icon:greenIcon };
		//Change Marker Text Color Here
		var clustererStyles = [{url:'images/Markers/Green/53/3.png',height:53,width:53,opt_anchor:[26, 53],opt_textColor: '#FF0000'},
			               {url:'images/Markers/Green/66/6.png',height:66,width:66,opt_anchor:[33, 66],opt_textColor: '#FF0000'}]
		markerCluster = new MarkerClusterer(map, null,{maxZoom: 22, gridSize: 70, styles:clustererStyles},function(clusterMarkers){
														  	clusterInfoWindow(clusterMarkers);
														  });
		haveCentered = 0;
		GDownloadUrl("phpsqlajax_genxml.php?whereFilter="+whereFilter, function(data) {
			var xml = GXml.parse(data);
			products = xml.documentElement.getElementsByTagName("product");
			loaded=0;
			var j=-1;
			for (var i = 0; i < products.length; i++) {
				if(products[i].getAttribute("product_id") == product_id)
				{
					j=i;
					usePointFromPostcode(i);
				}
			}
			for (var i = 0; i < products.length; i++) {
				if(i!=j)
					usePointFromPostcode(i);
			}
		});

	}
}
function usePointFromPostcode(i) {
	var localSearch = new GlocalSearch();
	
	localSearch.setSearchCompleteCallback(null,function() { 
		loaded+=1;     
		if (localSearch.results[0]) {
			var resultLat = localSearch.results[0].lat;
			var resultLng = localSearch.results[0].lng;
			var point = new GLatLng(resultLat,resultLng);
			var markerOptions;
			if(haveCentered)
			{
				if(!(product_id))
				{
					bounds.extend(point);
					map.setCenter(bounds.getCenter(),map.getBoundsZoomLevel(bounds));
				}
			}
			else
			{
				haveCentered = 1;
				bounds=new GLatLngBounds();
				bounds.extend(point);
				map.setCenter(point, 15);
			}
			if(products[i].getAttribute("product_id") == product_id) {
				map.setCenter(point, 17);
				gmap_address_point = point;
				markerOptions = redMarker;
			}
			else
			{
				markerOptions = greenMarker;
			}
			var marker = new GMarker(point,markerOptions);       
			marker.productIndex=i;
			marker.info=getMarkerInfo(i);
			markerCluster.addMarkers(new Array(marker));
			GEvent.addListener(marker, "click", function() {
				marker.openInfoWindowHtml(marker.info);
			});
		}
		if(loaded==products.length)
		{
			map.zoomIn();
			map.zoomOut();
		}
	});  
	
	localSearch.execute(products[i].getAttribute("zip") + ", UK");
}

function clusterInfoWindow(clusterMarkers)
{
	map.clusterCenter=clusterMarkers[0].marker.getLatLng();
	map.clusterMarkers=clusterMarkers;
	map.currentClusterInfo=0;
	showClusterInfoWindow();
}
function showClusterInfoWindow()
{
	var n=map.clusterMarkers.length;
	var i=map.currentClusterInfo;
	var marker=map.clusterMarkers[i].marker;
	var center=map.clusterCenter;
	var info=marker.info;
	//Change [Previous][Next] Style Here
	info = '<table width="340"><tr><td>' +
	       '<div ID="propertyCounter">' + getPageCounter(i,n) + '</div>' +
               '</td><td align="right">' +
               '<a onclick="showNextClusterInfoWindow(-1);" class="btn-prevnext">previous</a>' +
               '<a onclick="showNextClusterInfoWindow( 1);" class="btn-prevnext">next</a>' +  
	       '</td></tr></table>' + 
               '<div ID="clusterInfo">' + info + '</div>';
	map.openInfoWindowHtml(center,info);
}
function showNextClusterInfoWindow(d)
{
	var n=map.clusterMarkers.length;
	var i=map.currentClusterInfo;
	i = (i+d+n)%n;
	map.currentClusterInfo=i;
	var marker=map.clusterMarkers[i].marker;
	var center=map.clusterCenter;
	var info=marker.info;
	document.getElementById("propertyCounter").innerHTML = getPageCounter(i,n);
	document.getElementById("clusterInfo").innerHTML = info;
}
function getPageCounter(i,n)
{
	var j=i+1;
	//Change Counter Style Here
	return ('<b>Property ' + j + ' of ' + n + '</b>');
}
function getMarkerInfo(i)
{
	//Edit Info-Window Style Here
	//Add/Remove Info-Window Data Here
	return ('<div style="font-size:14px"><b>' + products[i].getAttribute("address") + ' - ' + products[i].getAttribute("zip") +'</b></div>'+
		'<table width="350"><tr>' + 
		'<td style="width: 200px">' +
		'<div style="font-size:10px">' +
		'<b>Price: </b>&pound;' + products[i].getAttribute("product_price")+'<br/>'+
		'<b>Ref: </b>' + products[i].getAttribute("product_name")+'<br/>'+
		'<b>Type: </b>' + products[i].getAttribute("building_type")+'<br/>'+
		'<b>Bedrooms: </b>' + products[i].getAttribute("beds")+'<br/><br/>'+
		'<a href="product_details.php?product_id='+ products[i].getAttribute("product_id") +'" class="btn-submit">Full Details</a>' + 
		
		'</div>'+
		'</td>' +
		'<td style="width: 152px;height: 115px">' +
		'<img src="' + products[i].getAttribute("image") + '" />' +
		'</td>' +
		'</table></tr>');
}


//google street view init
function initGStreetView(layer_id) {
	if (gmap_address_point == null) {
		GStreetViewError();
		return;
	}
	
	gsv = new GStreetviewPanorama(document.getElementById(layer_id), {
		latlng: gmap_address_point,
		features: {
			userPhotos: false
		}
	});
	
	GEvent.addListener(gsv, "error", function(errorCode) {
		if (errorCode == 603) {
			GStreetViewError("Flash is required to use Google&nbsp;Street&nbsp;View");
		} else {
			GStreetViewError();
		}
	});
	
	function GStreetViewError(message) {
		if (message == null) {
			message = "Google&nbsp;Street&nbsp;View not available";
		}
		document.getElementById(layer_id).innerHTML = '<div class="gmap_error">' + message + '</div>';
	}
}

//tabs
function divShowTab(tab) {
	for(i=1;i<=5;i++) {
		var layer = document.getElementById('tab'+i);
		var button = document.getElementById('tabhref'+i); 
		if (i == tab) {
			button.className='active';
			if (layer != null) {
				layer.style.display='block';
			}
		} else {
			button.className='';
			if (layer != null) {
				layer.style.display='none';
			}
		}
	}
}

// turn on (switch_on = true) or off (switch_on = false) the iframe hack layer when needed
function switchIframeHack(switch_on) {
	if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1) {
		var iframe_hack_tab = 3;
		var google_street = document.getElementById('tab' + iframe_hack_tab);
		var iframe_hack = document.getElementById('iframe-hack');
		
		if (iframe_hack != null) {
			if (!switch_on) {
				iframe_hack.style.display = 'none';
			} else if (google_street != null && google_street.style.display == 'block') {
				iframe_hack.style.display = 'block';
			}
		}
	}
}

//left menu
function divShowMenu() {
	divOptions=document.getElementById('options');
	arrowOptions=document.getElementById('arrow_options');
	if (divOptions.style.display=='block') {
		arrowOptions.className='expand';  
		divOptions.style.display='none'; 
	} else {
		divOptions.style.display='block';
		arrowOptions.className='collapse';  
	}
}