/**
* $Date: 2009-05-18 17:04:49 +0200 (må, 18 maj 2009) $
* $Author: lars.huring $
* $Revision: 313 $
**/

KL.MapTypeControl = function() {
}

KL.MapTypeControl.prototype = new GControl();


// Creates a one DIV for each of the buttons and places them in a container
// DIV which is returned as our control element. We add the control to
// to the map container and return the element for the map class to
// position properly.
KL.MapTypeControl.prototype.initialize = function(map) {

	var container = document.createElement("div");

	var normal = this.createButton(G_NORMAL_MAP, map);
	container.appendChild(normal);

	var hybrid = this.createButton(G_HYBRID_MAP, map);
	container.appendChild(hybrid);

	var satellite = this.createButton(G_SATELLITE_MAP, map);
	container.appendChild(satellite);

	map.getContainer().appendChild(container);

	var mt = map.getCurrentMapType();

	$(".maptype-" + mt.getName().toLowerCase(), container).addClass("active");

	return container;
}

// By default, the control will appear in the top left corner of the
// map with 7 pixels of padding.
KL.MapTypeControl.prototype.getDefaultPosition = function()
{
	return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10, 10));
}

// Sets the proper CSS for the given button element.
KL.MapTypeControl.prototype.createButton = function(maptype, map) {

	var button = $("<div />")
	var img;

	if (maptype == G_NORMAL_MAP)
		img = "karta";

	else if (maptype == G_HYBRID_MAP)
		img = "hybrid";

	else
		img = "satellit";

	button.addClass("maptypeselect");
	button.addClass("maptype-" + maptype.getName().toLowerCase());

	button.css({
		backgroundImage: "url(" + KLParams.baseURL + "images/maps/map-g_" + img + "_map.png)",
		backgroundRepeat: "no-repeat",
		cursor: "pointer",
		width: "36px",
		height: "14px",
		float: "left",
		margin: "0 2px 0 0"
	});

	GEvent.addDomListener(button[0], "click", function() {
		map.setMapType(maptype)
		$(".maptypeselect.active").removeClass("active");
		button.addClass("active");
	});

	return button[0];

}