$(document).ready( function() {

	Init();
	
	// Add event to first dropdown
	$("#q1").change(function() {
		ClearSelect(2);
		var itemval = $("#q1 option[@selected]").val();
		var itemtext = $("#q1 option[@selected]").html();
		PopulateDropDown(2, itemval, "");
		$("#q1_val").val(itemtext);
		$("#q1_id").val(itemval);
		ClearSelect(3);
		ClearSelect(4);
		ClearSelect(5);
		$("#add").attr("disabled", "disabled");
	});	
	
	// Add event to second dropdown
	$("#q2").change(function() {
		ClearSelect(3);
		var itemval = $("#q2 option[@selected]").val();
		var itemtext = $("#q2 option[@selected]").html();
		PopulateDropDown(3, itemval, "");
		$("#q2_val").val(itemtext);
		$("#q2_id").val(itemval);
		ClearSelect(4);
		ClearSelect(5);
		$("#add").attr("disabled", "disabled");
	});		
	
	// Add event to third dropdown
	$("#q3").change(function() {
		ClearSelect(4);
		var itemval = $("#q3 option[@selected]").val();	
		var itemtext = $("#q3 option[@selected]").html();
		PopulateDropDown(4, itemval, "");
		$("#q3_val").val(itemtext);
		$("#q3_id").val(itemval);
		ClearSelect(5);
		$("#add").attr("disabled", "disabled");
	});		
	
	// Add event to fourth dropdown
	$("#q4").change(function() {
		ClearSelect(5);
		var itemval = $("#q4 option[@selected]").val();
		var itemtext = $("#q4 option[@selected]").html();
		PopulateDropDown(5, itemval, "");
		$("#q4_val").val(itemtext);
		$("#q4_id").val(itemval);
		$("#add").attr("disabled", "disabled");
	});	
	
	// Add event to fifth dropdown
	$("#q5").change(function() {
		var itemtext = $("#q5 option[@selected]").html();
		var itemval = $("#q5 option[@selected]").val();		
		$("#q5_val").val(itemtext);
		$("#q5_id").val(itemval);
		$("#add").attr("disabled", "");
	});	
	
	
	
});

function Init() {
	PopulateDropDown(1, "", "");
	ClearSelect(2);
	ClearSelect(3);
	ClearSelect(4);
	ClearSelect(5);	
	$("#add").attr("disabled", "disabled");
}

function PopulateDropDown(step, value, selected) {
	
	var randomnumber=Math.floor(Math.random()*12345678)
	
	$("#q" + step).ajaxAddOption("/ajax/sample_json.asp", {"s":step,"v":value, "s1": $("#q1 option[@selected]").val(), "r" : randomnumber}, true, function() {$("#q" + step).selectOptions(selected, null);}, null)
	$("#q" + step).attr("disabled", "");
}

// Clear a select
function ClearSelect(step) {
	$("#q" + step).html('<option value="">Select an option</option>');	
	$("#q" + step + "_val").val('');
	$("#q" + step + "_id").val('');
	$("#q" + step).attr("disabled", "disabled");
}

function addSample() {
	
	var gutterprofile = $("#q1 option[@selected]").html();
	var guttersize = $("#q2 option[@selected]").html();
	var pipeprofile = $("#q3 option[@selected]").html();
	var pipesize = $("#q4 option[@selected]").html();
	var finish = $("#q5 option[@selected]").html();
	
	
	var data = "action=add&gutterprofile="+escape(gutterprofile)+"&guttersize="+escape(guttersize)+"&pipeprofile="+escape(pipeprofile)+"&pipesize="+escape(pipesize)+"&finish="+escape(finish);
	
	$.ajax({	type: "POST", url: '/sample/', data: data, dataType: "html", success: function(msg) { updateSamples(msg); }, error: function() { alert("Error"); }	});
	
	Init();
}

function getSamples() {

	var data = "action=getsamples";
	
	$.ajax({	type: "POST", url: '/sample/', data: data, dataType: "html", success: function(msg) { updateSamples(msg); }, error: function() { alert("Error"); }	});
}	

// ------------------------------------------------------------------------------------------------
	
function removeSample(i) {
	var data = "action=remove&i="+i
	$.ajax({	type: "POST", url: '/sample/', data: data, dataType: "html", success: function(msg) { updateSamples(msg); }, error: function() { alert("Error"); }	});
}

// ------------------------------------------------------------------------------------------------
	
function updateSamples(html) {
	$("#samplelist").html(html);
}