// JavaScript Document

$(document).ready(function(){

	modePrimary = '';
	modeSecondary = '';

	$("#modeSelect img.mode").mouseover(function(e){ $(this).addClass('over'); });
	$("#modeSelect img.mode").mouseout(function(e){ $(this).removeClass('over'); });

	$("#modeSelect img.mode").click(function(e){
		//$('#modesTemp').html('primary is '+modePrimary+' secondary is '+modeSecondary);
		if (modePrimary == '') {
			$(this).addClass('selected1');
			modePrimary = $(this).attr("id");
			$("#modeSelect input[id^='a']").attr("checked",false);
			$("#a"+$(this).attr("id").substring(4,5)).attr("checked",true);
		} else {
			if ($(this).attr("id") == modePrimary) {
					//tb_show('That mode is already selected as primary','#TB_inline?height=0&width=300&inlineId=lessThanThree', '')
					alert('That mode is already selected as primary','#TB_inline?height=0&width=300&inlineId=lessThanThree');
			} else {
				$("#modeSelect img").removeClass('selected2');
				$(this).addClass('selected2');
				modeSecondary = $(this).attr("id");
				$("#modeSelect input[id^='b']").attr("checked",false);
				$("#b"+$(this).attr("id").substring(4,5)).attr("checked",true);
			}
		}
		//$('#modesTemp').html('primary is '+modePrimary+' secondary is '+modeSecondary);
	});


	$("#modeSelect input").click(function(e){

		//$('#modesTemp').html('primary is '+modePrimary+' secondary is '+modeSecondary);

		if($(this).attr("id").charAt(0) == 'a') { 
			/*primary row option selected
			- remove the class of selected1 to the existing primary selection image, if applicable
			- set the selected class to the this selections image
			- uncheck all of the radio boxes for the primary row
			- check this box as the primary
			*/
			if ($(this).attr("id").charAt(1) == modeSecondary.charAt(4)) {
				//tb_show('That mode is already selected as secondary','#TB_inline?height=0&width=300&inlineId=lessThanThree', '')
				alert('That mode is already selected as secondary','#TB_inline?height=0&width=300&inlineId=lessThanThree');
				numberOfPrimary = modePrimary.charAt(4);
				$("#a"+numberOfPrimary).attr("checked",true);
			} else {
				$("#modeSelect img").removeClass('selected1');
				$("#item"+$(this).attr("id").charAt(1)).addClass('selected1');
				modePrimary = "item"+$(this).attr("id").charAt(1);
				$("#modeSelect input[id^='a']").attr("checked",false);
				$("#a"+$(this).attr("id").charAt(1)).attr("checked",true);
			}
		} else {
			/*secondary row option selected
			- see if there is a primary mode selected already, if not just give an alert to pick a primary first
			- if so then
			- remove the class of selected2 to the existing secondary selection image, if applicable
			- set the selected2 class to the this selections image
			- uncheck all of the radio boxes for the secondary row
			- check this box as the secondary

			Also need to make sure that the secondary selection isnt the same as the primary selection
			*/
			if (!modePrimary) {
				//tb_show('Please select a primary mode first','#TB_inline?height=0&width=200&inlineId=lessThanThree', '')
				alert('Please select a primary mode first','#TB_inline?height=0&width=200&inlineId=lessThanThree');
			} else {
				mappedId = 'item'+$(this).attr("id").charAt(1);
				//$('#modesTemp').html('a = ' +mappedId +' b= '+ modePrimary);
				if (mappedId == modePrimary) {
					//tb_show('That mode is already selected as primary','#TB_inline?height=0&width=300&inlineId=lessThanThree', '');
					alert('That mode is already selected as primary','#TB_inline?height=0&width=300&inlineId=lessThanThree');
					if (modeSecondary != '') {
						numberOfSecondary = modeSecondary.charAt(4);
						$("#b"+numberOfSecondary).attr("checked",true);
					} else {
						$(this).attr("checked",false);
					}
				} else {
					$("#modeSelect img").removeClass('selected2');
					$("#item"+$(this).attr("id").charAt(1)).addClass('selected2');
					modeSecondary = 'item'+$(this).attr("id").charAt(1);
					$("#modeSelect input[id^='b']").attr("checked",false);
					$("#b"+$(this).attr("id").charAt(1)).attr("checked",true);
				}
			}
		}
		//$('#modesTemp').html('primary is '+modePrimary+' secondary is '+modeSecondary);

	});


	$("#ridingSelect img.ride").mouseover(function(e){ $(this).addClass('over'); });
	$("#ridingSelect img.ride").mouseout(function(e){ $(this).removeClass('over'); });

	$("#ridingSelect img.ride").click(function(e){
		if ($(this).hasClass('selected1')) {
			$("#ridingSelect img").removeClass('selected1');
			$('#ridingArea').val('');
		} else {
			$("#ridingSelect img").removeClass('selected1');
			$(this).addClass('selected1');
			$('#ridingArea').val($(this).attr("id"));
		} 
	});

});

function gotoStep4() {
	query = $("#step3Form").serialize();

	$.ajax({
		type: "POST",
		url: "process-step3.php",
		data: query,
		success: function(msg){
			if (msg == 1) { location.href = 'step4.php'; }
			else {
				$('#error').html(msg);
			}
		}
	});
	return false;
}
