/*

        this.layers = new Array();

        this.layers['Wind'] = true;
        this.layers['Tides'] = false;


        this.AddLayerControl();


WFMap.prototype.AddLayerControl = function() {
        this.map.addControl(new LayerControl(this.layers, this));
}

WFMap.prototype.ToggleLayer = function(layer) {
        if (this.layers[layer]) {
                this.layers[layer] = false;
        } else {
                this.layers[layer] = true;
        }
        this.LoadMarkers();
}

*/


function LayerControl(layers, mapControl) {
	this.layers = layers;
	this.mapControl = mapControl;

	this.mapControl.layers = this.layers;
}

LayerControl.prototype = new GControl();

LayerControl.prototype.initialize = function(map) {
	this.map = map;

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

	//this.ShowMax();
	this.ShowMin();

	map.getContainer().appendChild(this.container);

	this.container.style.filter = "alpha(opacity=90)";
	this.container.style.opacity = .9;

	return this.container;
}

LayerControl.prototype.ShowMin = function() {
	var container = this.container;
	container.innerHTML = '';

	this.container.style.backgroundColor = "white";
	this.container.style.padding = "6px";

	var plusImg = document.createElement("img");
	plusImg.src = "http://www.iwindsurf.com/images/icons/frame_faster.gif";

	GEvent.bindDom(plusImg, "click", this, this.ShowMax);

	container.appendChild(plusImg);
}

LayerControl.prototype.ShowMax = function() {
	var container = this.container;
	container.innerHTML = '';

	this.container.style.backgroundColor = "white";
	this.container.style.paddingLeft = "18px";
	this.container.style.paddingRight = "6px";

	var minusImg = document.createElement("img");
	minusImg.style.position = "absolute";
	minusImg.style.left = "4px";
	minusImg.style.top = "4px";
	minusImg.src = "http://www.iwindsurf.com/images/icons/frame_slower.gif";

	GEvent.bindDom(minusImg, "click", this, this.ShowMin);
	container.appendChild(minusImg);

	container.appendChild(document.createTextNode("Overlays"));
	container.appendChild(document.createElement("br"));

	for (var layer in this.layers) {
		var isChecked = "";
		if (this.layers[layer].l) {
			if (this.layers[layer].display) {
				isChecked = "checked";
			}

			if (this.layers[layer].icon) {
				var img = document.createElement("img");
				img.src = this.layers[layer].icon;
				img.width=12;
				img.height=12;
				container.appendChild(img);
			}

			var chk = document.createElement("input");
			chk.setAttribute("type", "checkbox");
			
			container.appendChild(chk);
			container.appendChild(document.createTextNode(layer));
			container.appendChild(document.createElement("br"));

			var Handler = GEvent.callbackArgs(this, this.ToggleLayer, layer, chk);
			GEvent.addDomListener(chk, "click", Handler);

			chk.checked = isChecked;
		}
	}
}

LayerControl.prototype.ToggleLayer = function(layer, chk) {
	// TODO: Toggle layer
	this.layers[layer].display = chk.checked;
	this.mapControl.LoadMarkers();
}

LayerControl.prototype.getDefaultPosition = function () {
	return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(0, 40));
}

LayerControl.prototype.setButtonStyle_ = function(button) {
	button.style.textDecoration = "underline";
	button.style.color = "#0000cc";
	button.style.backgroundColor = "white";
	button.style.font = "small Arial";
	button.style.border = "1px solid black";
	button.style.padding = "2px";
	button.style.marginBottom = "3px";
	button.style.textAlign = "center";
	button.style.width = "6em";
	button.style.cursor = "pointer";
}