/**
 * @author aanda
 */

addLoadEvent(initFunnel);

var numSteps;
var isEditing=false; // hack for IE event model bug, prevents cascade of edit event to multiple labels

function initFunnel() {
	initLogger();
	// Ignore the Total Conversion Row
	numSteps = MochiKit.DOM.getElementsByTagAndClassName("tr",null,"conversionTableBody").length -1;	
	//alert(MochiKit.DOM.getElementsByTagAndClassName("tr",null,"conversionTable").length);
	//alert(numSteps);
	recalcWithPercents();
	var labelNode;
	var handler;
	// Format Volume Nums
	for(var i=1;i<numSteps;i++) {
		MochiKit.Signal.connect("step" + i + "p", "onchange", recalcWithPercents);
		MochiKit.Signal.connect("step" + i + "n", "onchange", recalcWithVolume);
		handler = MochiKit.Signal.connect("step" + i + "label","onclick", editLabel);
		document.getElementById("step" + i + "label").handler = handler;
	}
	//renderFunnel();
	//document.getElementById("")
	//initDebrief();
}

function clearFunnel() {
	//alert('clearing');
	for(var i=1;i<numSteps;i++) {
		document.getElementById("vizTableBody").removeChild(document.getElementById("vizTableRow" + i));	
	}	
}
function renderFunnel() {
	var rowTemplate = document.getElementById("vizTableRow0");
	rowTemplate.childNodes.item(2).innerHTML = document.getElementById("dataRow0").getElementsByTagName("td")[0].innerHTML
	rowTemplate.childNodes.item(2).setAttribute("colspan", numSteps*2+2);
	if(document.all) rowTemplate.childNodes.item(2).colSpan = numSteps*2+2;
	//rowTemplate.childNodes.item(0).)
	//alert(numSteps);
	var cloneRow;
	var baseWidth = 300;
	var pDelta = 1
	var stepConversion;
	for(var i=1;i<numSteps;i++) {
		pDelta = 1-(arN[i] / arN[i-1])  ; //
		stepConversion = arN[i] / arN[0];
		cloneRow = rowTemplate.cloneNode(true);
		//alert(i+ " " + cloneRow)
		MochiKit.DOM.setNodeAttribute(cloneRow,"id", "vizTableRow" + i);
		
		MochiKit.DOM.setNodeAttribute(cloneRow.childNodes.item(1).childNodes.item(0),
			"width", (pDelta/2 * baseWidth))// + "px");
		setColSpan(cloneRow.childNodes.item(0), i+1 );
		MochiKit.DOM.setNodeAttribute(cloneRow.childNodes.item(3).childNodes.item(0),
			"width", (pDelta/2 * baseWidth)) //+ "px");
		//alert(i + " " + (pDelta/2 * baseWidth) + " from " + pDelta + " with conversion " + stepConversion);
		setColSpan(cloneRow.childNodes.item(4),  i+1);
		cloneRow.childNodes.item(2).innerHTML = document.getElementById("dataRow" + i).getElementsByTagName("td")[0].innerHTML;
		MochiKit.DOM.setNodeAttribute(cloneRow.childNodes.item(2),
			"width", stepConversion * baseWidth - (pDelta*baseWidth)) //+ "px");
		setColSpan(cloneRow.childNodes.item(2),(numSteps*2) - (2*i) +2);
	
		//cloneRow.childNodes.item(1).innerHTML += 
		rowTemplate.parentNode.appendChild(cloneRow);
	}
}
	var arN = new Array(1);
	var arP = new Array(1);

function editLabel(e) {
	if(!isEditing) {
		isEditing = true;
	
	var labelNode = e.src();
	MochiKit.Signal.disconnect(labelNode.handler);
	//alert(e.src() + " " + e.src().nodeName + " " + e.src().id)
	var label = labelNode.innerHTML;
	labelNode.innerHTML = '<input type="text" value="' + label + '" id="editLabel">';
	$("editLabel").focus();
	var handler = MochiKit.Signal.connect("editLabel", "onblur", commitLabel);
	MochiKit.DOM.setNodeAttribute(labelNode,"handler",handler);
	}
}

function commitLabel(e) {
	var labelNode = e.src().parentNode;
	var label = document.getElementById("editLabel").value;
	MochiKit.Signal.disconnect(labelNode.handler);
	labelNode.innerHTML = label;
	var handler = MochiKit.Signal.connect(labelNode,"onclick", editLabel);
	labelNode.handler = handler;
	isEditing = false;
	clearFunnel();
	renderFunnel();
	
	
}
// Workaround for IE's colSpan attribute 
function setColSpan(node, colSpan) {
	if(document.all) {
		node.colSpan = colSpan;
	} else {
		MochiKit.DOM.setNodeAttribute(node,"colspan", colSpan)
		
	}
}

function rebuildDataIds() {
	
	var rows = $("conversionTableBody").getElementsByTagName("tr");
	//alert(rows.length + " with " + $("conversionTableBody"));
	for(var h=1;h<rows.length-1;h++) {
		MochiKit.DOM.setNodeAttribute(rows[h], "id", "dataRow" + h );
		var cells = rows[h].getElementsByTagName("td");
		//cells = rows[i].getElementsByTagName("td");
		//alert("Rebuilding row " + h + " of  " + cells.length + " cells ");
		MochiKit.DOM.setNodeAttribute(cells[0], "id", "step" + h + "label");
		MochiKit.DOM.setNodeAttribute(cells[1].getElementsByTagName("input")[0], "id", "step" + h + "p");
		//alert(cells[1].getElementsByTagName("input")[0].id);
		MochiKit.DOM.setNodeAttribute(cells[2].getElementsByTagName("input")[0], "id", "step" + h + "n");
		// Header + footer row don't have add/delete and final row is summary
		if(h < (rows.length-3) ) {
			//alert("at " + h + " of " + rows.length + " cell 3 is " + cells[3].nodeName + " " + cells[3].innerHTML);
			MochiKit.DOM.setNodeAttribute(cells[3].getElementsByTagName("a")[0], "onclick", "addDataRow("+h+")");
			MochiKit.DOM.setNodeAttribute(cells[3].getElementsByTagName("a")[1], "onclick", "deleteDataRow("+h+")");
		}
	}
	
	
}
function deleteDataRow(y) {
	var rowNode = $("conversionTableBody").getElementsByTagName("tr")[y];
	//alert(rowNode.nodeName + rowNode.id + rowNode.getElementsByTagName("td")[0].id);
	if(confirm("Are you sure you want to delete the step " + rowNode.getElementsByTagName("td")[0].innerHTML + "?") ) {
		clearFunnel();
		//alert("Cleared Funnel");
		rowNode.parentNode.removeChild(rowNode);
		arN[i] = new Array(1);
		arP[i] = new Array(1);
		numSteps = numSteps -1;
		rebuildDataIds();
		recalcWithPercents();
	}	
	return false;
	
}

function addDataRow(i) {
	//alert(i);
	var tableBody = $("conversionTableBody");
	var cells;
	if(i) { var rowTemplate = $("dataRow"+i);
	} else {
		var rowTemplate = $("dataRow"+1);
	}

	//alert(rowNode.nodeName + rowNode.id + rowNode.getElementsByTagName("td")[0].id);
		clearFunnel();
		//alert("Cleared Funnel");
		
		cloneRow = rowTemplate.cloneNode(true);
		//alert(i+ " " + cloneRow)
		MochiKit.DOM.setNodeAttribute(cloneRow, "id", "vizTableRow" );
		//alert($("dataRow" + (i-1)).id);
		rowTemplate.parentNode.insertBefore(cloneRow,$("dataRow"+(i + 1)));
		cells = cloneRow.getElementsByTagName("td");
		cells[0].innerHTML = "Unnamed Step";
		MochiKit.Signal.disconnectAll(cells[1].getElementsByTagName("input")[0]);
		MochiKit.Signal.disconnectAll(cells[2].getElementsByTagName("input")[0]);
		
		MochiKit.Signal.connect(cells[1].getElementsByTagName("input")[0], "onchange", recalcWithPercents);
		MochiKit.Signal.connect(cells[2].getElementsByTagName("input")[0], "onchange", recalcWithVolume);
		MochiKit.Signal.disconnectAll(cells[0]);
		handler = MochiKit.Signal.connect(cells[0],"onclick", editLabel);
		cells[0].handler = handler;
		arN[i] = new Array(1);
		arP[i] = new Array(1);
		numSteps = numSteps +1;
		rebuildDataIds();
		recalcWithPercents();
		return false;
	
}


function recalcData() {
	//alert("Recalcing data for " + numSteps);
	for(var i=0;i<numSteps;i++) {
		//alert(i + "" + $("step" + i + "n").value + "," + $("step" + i + "p").value );
		arN[i] = $("step" + i + "n").value;
		arP[i] = parseInt($("step" + i + "p").value)/100;		
	}
	//alert(arN + ' ' + arP)
}	

function recalcWithPercents() {
	var curN, curP;
	modelChanged = false;	
	//var Nformatter = MochiKit.Format.numberFormatter("thousands","","EN_us");
	recalcData();
	for(var i=1;i<numSteps;i++){
		//alert(arN[i-1] + ' times ' + (arP[i]))
		arN[i] = Math.round(arN[i-1] * (arP[i]));
		$("step" + i + "n").value = arN[i]; //Nformatter(arP[i]);
	}
	//alert(i);
	//alert(i + "" + document.getElementById("step" + i + "n").value + "," + $("step" + 0 + "n").value );

	$("totalConversion").value = twoDigitFloat( arN[i-1] / arN[0] * 100) ;	
	if($("vizTableBody").childNodes.length > 3) clearFunnel();
	renderFunnel();
	
}


function recalcWithVolume() {
	var curN, curP;
	modelChanged = true;
	//var Nformatter = MochiKit.Format.numberFormatter("thousands","","EN_us");
	recalcData();
	for(var i=1;i<numSteps;i++){
		//art(arN[i-1] + ' times ' + (arP[i]))
		arP[i] = (arN[i] /  arN[i-1])*100;
		$("step" + i + "p").value = twoDigitFloat( arP[i]); //Nformatter(arP[i]);
	}
	//alert(i);
	//alert(i + "" + document.getElementById("step" + i + "n").value + "," + document.getElementById("step" + 0 + "n").value );

	$("totalConversion").value = arN[i-1] / arN[0] * 100;	
	clearFunnel();
	renderFunnel();
	
	
}