function BackToProvinciesControl() {}
BackToProvinciesControl.prototype = new GControl();
BackToProvinciesControl.prototype.initialize = function(map) {
	var container = document.createElement("div");
	var BackToProvinciesDiv = document.createElement("div");
	this.setButtonStyle_(BackToProvinciesDiv);
	container.appendChild(BackToProvinciesDiv);
	BackToProvinciesDiv.appendChild(document.createTextNode("Terug naar provinciekaart"));
	GEvent.addDomListener(BackToProvinciesDiv, "click", function() {
	  showProvincies();
	});
	map.getContainer().appendChild(container);
	return container;
}

BackToProvinciesControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7));
}

BackToProvinciesControl.prototype.setButtonStyle_ = function(button) {
  button.style.color = "#003376";
  button.style.backgroundColor = "white";
  button.style.fontFamily = "Arial";
  button.style.fontWeight = "bold";
  button.style.border = "1px solid #003376";
  button.style.padding = "2px";
  button.style.marginBottom = "3px";
  button.style.textAlign = "center";
  button.style.width = "175px";
  button.style.cursor = "pointer";
}

function loadArea(area) {
	$('provincie_map').hide();	
	$('map').appear( { duration: 2.0 } );
	if (GBrowserIsCompatible()) {
	  	var map = new GMap2(document.getElementById("map"));
		//map.addControl(new GSmallMapControl());
		//map.addControl(new GMapTypeControl());
		map.setMapType(G_NORMAL_MAP);
		//G_NORMAL_MAP- the default view
	    //G_SATELLITE_MAP - showing Google Earth satellite images
	    //G_HYBRID_MAP - showing a mixture of normal and satellite views
	    //G_DEFAULT_MAP_TYPES - an array of these three types, useful for iterative processing
	    //map.setCenter(new GLatLng(52.278241126812276, 5.2569580078125), 7);
  	}
	var request = GXmlHttp.create();
	request.open("GET", "scripts/getarea.php?area=" + area, true);
	request.onreadystatechange = function () {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;
			locations = xmlDoc.documentElement.getElementsByTagName("location");
			var areadata = getAreaData(area);
	  		var areamap = new GMap2(document.getElementById("map"));
			areamap.addControl(new GSmallMapControl());
	    	areamap.setCenter(new GLatLng(areadata[0], areadata[1]), areadata[2]);
			if (locations.length){
				for (var i = 0; i < locations.length; i++) {
					var html = '<ul class=\'info\'><li class=\'infoname\'>' + locations[i].getAttribute("name") + '</li><li class=\'infofield\'>' + locations[i].getAttribute("address") + '</li><li class=\'infofield\'>' + locations[i].getAttribute("zipcode") + ' ' + locations[i].getAttribute("city") + '</li><li class=\'infofield\'><span class=\'fieldlabel\'>T</span>' + locations[i].getAttribute("phone") + '</li>';
					if (locations[i].getAttribute("email") != '') {
						html += '<li class=\'infofield\'><span class=\'fieldlabel\'>E</span><a class=\'fieldlink\' href=\'mailto:' + locations[i].getAttribute("email") + '\'>'  + locations[i].getAttribute("email") +  '</a></li>';
					}
					if (locations[i].getAttribute("url") != '') {
						html += '<li class=\'infofield\'><span class=\'fieldlabel\'>W</span><a class=\'fieldlink\' href=\'http://' + locations[i].getAttribute("url") + '\'>' + locations[i].getAttribute("url") + '</li>';
					}
					html += '<li class=\'reslink\'><a class=\'fieldlink\' href=\'resultaten.php?lat=' + locations[i].getAttribute("lat") + '&amp;lng=' + locations[i].getAttribute("lng") + '\'><img src=\'images/offerte_aanvraag_button.png\' width=\'110\' height=\'18\' alt=\'\'></a>';
					html += '</ul>'; 
					var point = new GLatLng(locations[i].getAttribute("lat"),locations[i].getAttribute("lng"));
					areamap.addOverlay(createMarker(point, html));
				}
			}
		}
		map.addControl(new BackToProvinciesControl());
	}
	request.send(null);
}

function createMarker(point, html) {
	var icon = new GIcon();
	icon.image = 'images/marker.png';
	icon.iconAnchor = new GPoint(0,0);
	icon.infoWindowAnchor = new GPoint(7,1);
	var marker = new GMarker(point, icon)
	GEvent.addListener(marker, "mouseover", function() {
		marker.openInfoWindowHtml(html);
	});
	return marker;
}

function getAreaData(area) {
	var areadata = new Array();
	switch(area) {
		case 'Drenthe':
			areadata[0] = 52.92215137976296;
			areadata[1] = 6.78680419921875;
			areadata[2] = 9;
		break;
		case 'Flevoland':
			areadata[0] = 52.517892228382834;
			areadata[1] = 5.51788330078125;
			areadata[2] = 9;
		break;
		case 'Friesland':
			areadata[0] = 53.03130376554961;
			areadata[1] = 5.657958984375;
			areadata[2] = 9;
		break;
		case 'Gelderland':
			areadata[0] = 52.17393169256846;
			areadata[1] = 5.98480224609375;
			areadata[2] = 9;
		break;
		case 'Groningen':
			areadata[0] = 53.2159016302506;
			areadata[1] = 6.5643310546875;
			areadata[2] = 9;
		break;
		case 'Limburg':
			areadata[0] = 51.19139393653174;
			areadata[1] = 6.009521484375;
			areadata[2] = 9;
		break;
		case 'Noord-Brabant':
			areadata[0] = 51.59413527860747;
			areadata[1] = 5.0701904296875;
			areadata[2] = 9;
		break;
		case 'Noord-Holland':
			areadata[0] = 52.6063835896964;
			areadata[1] = 4.85595703125;
			areadata[2] = 9;
		break;
		case 'Overijssel':
			areadata[0] = 52.56633414532646;
			areadata[1] = 6.416015625;
			areadata[2] = 9;
		break;
		case 'Zuid-Holland':
			areadata[0] = 52.07612995654164;
			areadata[1] = 4.58404541015625;
			areadata[2] = 9;
		break;
		case 'Utrecht':
			areadata[0] = 52.07781801208549;
			areadata[1] = 5.2294921875;
			areadata[2] = 10;
		break;
		case 'Zeeland':
			areadata[0] = 51.48651406499528;
			areadata[1] = 3.8287353515625;
			areadata[2] = 9;
		break;
	}
	return areadata;
}

function showProvincies() {
	$('map').hide();	
	$('provincie_map').appear( { duration: 2.0 } );
	$('content_left_googlemaps').hide(); 
	$('content_left_welkom').appear({ duration: 1.5 });
	$('right_content_txt').appear({ duration: 1.5 });
}

