/**
 * @author Peter Connolly
 */
var currstep = 0;
var active_color = '#000'; // Colour of user provided text #000
var inactive_color = '#999'; // Colour of default text #999
var default_text = 'Enter Text'; 
var default_zip = '00000';
var default_phone = '(000) 000 0000';
var default_state = '-- Select State --';
var initial_value = '';/* initial value of the text box */
var error_field_is_required_text = '*** this field is required ***'

$(document).ready(function() {

	$('#lsgppq').ajaxForm();
	// Insert a default state at the start of the option list
	$('<option value='+default_state+'>'+default_state+'</option>').appendTo('select#states');
	//$(document).pngFix();
	$.ajax({
	type: "GET",
	url: "/include/states.xml",
	dataType: "xml",
		success: function(xml) {
			$(xml).find('state').each(function(){
									 
				var name_text = $(this).find('name').text()
			
				$('<option value='+name_text+'>'+name_text+'</option>').appendTo('select#states');
			});
		}
	});

	
	/*------- FORM NAVIGATION -------*/
	$('div.continue').click(function () { // Display the Continue button
		var currFields = []; // Have an array to hold current steps form elements an values
		$('#sec_0'+currstep+' :input').each(function() {
			switch(this.title){
				case "required": 
					var afield = [];
					afield[0] = this.name;
					afield[1] = $(this).val();
					currFields[currFields.length] = afield;
					break;
			}
		});
		if(currstep>=1 && validate(currFields)){
			$('#sec_0'+currstep).fadeOut("slow",showNext);
			$('#step_0'+currstep).css({ background:'url(/images/interface/psteps.png) 0 -120px no-repeat', fontWeight:'bold', color:'#333' })
			currstep++;
		} else if(currstep==0){
			$('#sec_0'+currstep).fadeOut("slow",showNext);
			$('#step_0'+currstep).css({ background:'url(/images/interface/psteps.png) 0 -120px no-repeat', fontWeight:'bold', color:'#333' })
			currstep++;
		}
    });
	
	for(var x = 1; x<9; x++){
		$('#sec_0'+x).css({display:"none"});
	}
	
	function showNext(){
		if(currstep<7){
			$('#sec_0'+currstep).fadeIn("slow");
			$('#step_0'+currstep).css({ background:'url(/images/interface/psteps.png) 0 -90px no-repeat', fontWeight:'bold', color:'#333' });
		} else {
			$('#sec_0'+currstep).fadeIn("slow");
			$('#step_0'+currstep).css({ background:'url(/images/interface/psteps.png) 0 -150px no-repeat', fontWeight:'bold', color:'#333' });
			// And now we submit the form because they have made it to the end with everything being valid
			//alert("Form has been submitted");
			$('#lsgppq').ajaxSubmit();
			return false;
		}
	}
	/*------- END FORM NAVIGATION -------*/
	
	/*------- FORM VALIDATION -------*/
	// Again very basic at the moment. Need to make more complex for the entire form.
	function validate(fields) {
		var invalid = false;
		for(var x=0; x<fields.length ; x++){
		//alert(fields[x]);
			if ((fields[x][1] != "") && (fields[x][1] != default_text) && (fields[x][1] != default_phone) && (fields[x][1] != default_zip) && (fields[x][1] != default_state) ) {
				// The field is valid - we can move on.
				$("#sec_0"+currstep+" .vrsp_"+x).animate({ opacity: 0 }, 400);
				$(":input[name="+fields[x][0]+"]").animate({ backgroundColor: "#FFFFFF", opacity: 1, color: "#333333" }, 400);
				//.animate({ background:'url(/images/interface/entF_bg.png) 0 0' })
				
			} else {
				// We still have the default value in this field. Display a message.
				$("#sec_0"+currstep+" .vrsp_"+x).text(error_field_is_required_text).show().animate({ opacity: 1,color:"#ff0000" }, 400);;
				$(":input[name="+fields[x][0]+"]").animate({ backgroundColor: "#FF0000", opacity: 0.4, color: "#FFFFFF" }, 400);
				invalid = true;
			}
			
		}
		if(invalid){
			return false;
		} else {
			return true;
		}
	};
	
	$("input.default-value").css("color", inactive_color);
  var default_values = new Array();
  $("input.default-value").focus(function() {
    // Find the initial value of the field
	initial_value = this.value;
    if ((this.value == default_text)|| (this.value == default_zip)||(this.value == default_phone)){
      this.value = '';
      this.style.color = active_color;
    }
    $(this).blur(function() {
      if (this.value == '') {
        this.style.color = inactive_color;
        this.value = initial_value;
      }
    });
  });

	 $("input, textarea").focus(function () {
	 	
		if($(this).css("background-color") != "rgb(255, 255, 255)"){
			
			$(this).next('span').animate({ opacity: 0 }, 400);
			$(this).animate({ backgroundColor: "#FFFFFF", opacity: 1, color: "#333333" }, 400);
		}
		
	});
	
	/*------- END FORM VALIDATION -------*/
	
		
});