var dI;
var df;
var sdf = []; //Sorted name, count
var csdf = []; //Sorted name and cumalative count
var csdfp = []; //Sorted %
var chart = null;
		
function processPC() {
	sdf = []; csdf = []; csdfp = [];
	sdf = df.sortBy(function(e) {
		return -e[1]; 
	});
	var sum = sdf.inject(0, function(acc, e) {
		var i = acc + e[1];
		csdf.push([e[0], i]);  
		return i;
	}); //alert(this.csdf.inspect());
	csdf.each(function(e) {
		csdfp.push([e[0], Math.round(100*e[1]/sum)]);
	}); //alert(this.csdfp.inspect());
}

function drawPC() {
	df = dI.getData();
	if(df){
		processPC();
	}else{
		alert("Error(s) found in your data, erroneous data is highlighted in red color. Please correct it to proceed further.")
		return false;
	};
	$("pareto-container").show();
	$("data-entry").hide();
	$("btn-edit-data").show();
	$("btn-plot-chart").hide();


	if (chart != null)
		chart.remove();
	drawChart();
	
	drawTable();
}

function drawChart() {
		chart = new EJSC.Chart("pareto-chart", {
			show_legend: false,
			allow_zoom: false,
			title: "",
			axis_right: {grid: {show: false}, min_extreme: 0, cursor_position: {show: true, caption: "%age: "}, crosshair: {show: true}, caption: "Cumm %age"},
			axis_bottom: {size: 60, caption: "Item"},
			axis_left: {caption: "Frequency"}
			}
		);
		
		var myChartSeries1 = new EJSC.BarSeries(new EJSC.ArrayDataHandler(sdf), {y_axis: "left"}
		);
		myChartSeries1.autosort = false;
		chart.addSeries(myChartSeries1);
		
		var myChartSeries2 = new EJSC.LineSeries(new EJSC.ArrayDataHandler(csdfp), {y_axis: "right"}
		);
		myChartSeries2.autosort = false;
		myChartSeries2.color = '#BC3437';
		myChartSeries2.drawPoints = true;
		myChartSeries2.lineWidth = 2;
		chart.addSeries(myChartSeries2);
}

function drawTable(x){
	var i = 0;
	var alt = true;
	$("pareto-table").childElements().each(function(el) {
		if(i>0){
			el.remove();	
		};
		i++;
	});
	i = 0;
	sdf.each(function(el){
		var dEl = (alt) ? new Element('tr') : new Element('tr', {'class': 'alternate'});
		alt = ! alt;
		
		dEl.insert(new Element('td').update(el[0]));
		dEl.insert(new Element('td').update(el[1]));
		dEl.insert(new Element('td').update(csdf[i][1]));
		dEl.insert(new Element('td').update(csdfp[i][1]+"%"));
		
		var box = new Element("div").insert(dEl);	
		$("pareto-table").insert(box.innerHTML);
		i++;
	});
}

document.observe('dom:loaded', function() {
	dI = new DataInput($("data-input"));
	$("btn-edit-data").hide();
	$("pareto-container").hide();
	
	$("btn-edit-data").observe('click',function(event){
		$("pareto-container").hide();
		$("data-entry").show();
		$("btn-edit-data").hide();
		$("btn-plot-chart").show();
	});
	
	new EditableField("inp-chart-name", "input-focus", "Click here to enter chart title");
	
 	$('btn-help').observe('click', function(obj) {
		alert("Coming soon!");
	});	
	$('btn-print').observe('click', function(obj) {
		window.print();
	});	
	$('btn-plot-chart').observe('click', drawPC);
});