/*
 * Creates and Manages the Layers Properties Dialog Box
 */

function LayerDialog (DialogTitle, Layers) {
	var DialogObject = new Dialog(600,300,'Layer Properties');
	DialogObject.addCloseBar();

//	DialogObject.addWinControls();
	DialogObject.getContent().style.overflow = 'scroll';

	var LayersParent = null;
	var myself = this;

	var DragAndDrop = new DragAndDropLibrary('DragAndDrop');

	this.onDrop = function(source, target) {
		var tgtIndex = Layers[target.id].getIndex();
		var srcIndex = Layers[source.id].getIndex();
		var operator = 1;
		if(tgtIndex == getMinIndex()) { // Typically "0"
			Layers[source.id].setIndex(tgtIndex);
			Layers[target.id].setIndex(tgtIndex+1);
		} else { // Normal Move.
			if(tgtIndex < srcIndex) {
				operator = -1;
			}
			Layers[source.id].setIndex(tgtIndex+operator);
		}
		//alert(target.id+' '+Layers[target.id].getIndex()+'\n'+source.id+' '+Layers[source.id].getIndex());
		updateLayerOrder();
		dropHandles();
		createLayerHandles();
	}

	DragAndDrop.onDrop = this.onDrop;
	DragAndDrop.ListStyle = true;

	function createLayersParent() {
		LayersParent = DialogObject.getContent();
	}

	function createDialogFrame() {
		LayersParent = DialogObject.getContent();
		DragAndDrop.Container = DialogObject.getDialog();
		LayersParent.onmousemove = function (e) {
			if(window.event) { e = window.event; }
			DragAndDrop.dragContainer(e, this);
		}
	}

	function createIcon(imageUrl, onclickAction) {
		var icon = document.createElement('img');
		icon.src = imageUrl;
		icon.onclick = onclickAction;
		return icon;
	}

	function alertFn(msg) {
		var fn = function () { alert(msg); };
		return fn;
	}

	function confirmAction(msg, action) {
		var fn = function () {
			if(confirm(msg)) {
				eval(action);
			}
		}
		return fn;
	}


	function setIconToggle(icon, toggleValue) {
		if(!toggleValue) {
			setOpacity(icon, 50);
		} else {
			setOpacity(icon, 100);
		}
	}

	function setToggleCycle(icon, layerName) {
		Layers[layerName].active = !Layers[layerName].active;
		setIconToggle(icon, Layers[layerName].active);
	}

	function getEvalHandle (evalString) {
		var fn = function() {
			eval(evalString);
		}
		return fn;
	}

	function setParameter(handleName, parameterName, pValue) {
		Layers[handleName].setParameter(parameterName, pValue);
	}



	function createHandle(handleName) {
		var handle = document.createElement('div');
		handle.id = handleName;
		handle.className = 'LayerLine';
		//handle.appendChild(createIcon('arrange.png', alertFn('Arrange Fade '+handleName)));
		var dragHandle = document.createElement('input');
		dragHandle.type = 'image';
		dragHandle.src = 'arrange.png';
		dragHandle.onmousedown = function (event) { DragAndDrop.startDragging(event,this.parentNode, handleName); }
		handle.appendChild(dragHandle);

		handle.appendChild(document.createTextNode(handleName));
		var tools = document.createElement('span');
		tools.className = 'Tools';
		
		var addParam = document.createElement('a');
		addParam.appendChild(document.createTextNode('+'));
		tools.appendChild(addParam);
		addParam.onclick = function () {
			var resp = prompt('Name of Layer Param?');
			if(resp) {
				Layers[handleName].setParameter(resp,'0');
			}
		}

		tools.appendChild(createIcon('fade.png', function() { changeLayerOpacity(handleName, -10); logDebugMessage('Layer Properties',false,'Fade '+handleName);}));
		tools.appendChild(createIcon('unfade.png', function() { changeLayerOpacity(handleName, 10); logDebugMessage('Layer Properties', false,'UnFade '+handleName);}));

		var cycleIcon = createIcon('cycle.png', null);
		cycleIcon.onclick = function () {
			setToggleCycle(cycleIcon, handleName);
		}

		tools.appendChild(cycleIcon);
		if(!Layers[handleName].active) {
			setOpacity(cycleIcon, 50);
		}
		var dataIcon = createIcon('data.png', null);
		dataIcon.onclick = function() {
			Layers[handleName].data = !Layers[handleName].data;
			setIconToggle(dataIcon, Layers[handleName].data);
		}

		tools.appendChild(dataIcon);
		if(!Layers[handleName].data) {
			setOpacity(dataIcon, 50);
		}
		tools.appendChild(createIcon('trash.png', confirmAction('Are you sure you want to remove '+handleName+'?', "removeMapLayer('"+handleName+"'); this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode)")));
		handle.appendChild(tools);

		var layerParams = document.createElement('div');
		var params = Layers[handleName].getLayerParams();
		for(var p in params) {
			layerParams.appendChild(document.createTextNode(p+': '));
			var inpt = document.createElement('input');
			inpt.value = params[p];
			inpt.name = p;
			inpt.onchange = function () {
				setParameter(handleName, this.name, this.value);
			}
			layerParams.appendChild(inpt);
			layerParams.appendChild(document.createElement('br'));	
			handle.appendChild(layerParams);
		}	
		DragAndDrop.addTarget(handle);
		return handle;
	}

	function getLayerName(unknownLayer) {	
		for(var l in Layers) {
			if(Layers[l] == unknownLayer) {
				return l;
			}
		}
		return l;
	}

	function dropHandles() {
		var divs = LayersParent.getElementsByTagName('div');
		for(var d = divs.length - 1; d >= 0; d--) {
			LayersParent.removeChild(divs[d]);
		}
	}

	function createLayerHandles() {
		var arr = sortLayersByIndex(getVisibleLayers());
		for(var i = arr.length-1; i >= 0; i--) {
			LayersParent.appendChild(createHandle(getLayerName(arr[i])));
		}
	}

	this.open = function() {
		createDialogFrame();
		createLayerHandles();
		return DialogObject.getDialog();
	}
}

