var msgHeader = 'emtpy';
var lastPage = 'id-num';

var lastFace = null;
var selectedFace = null;
var lastSelected = null;

function setMsg(el) {
   msgHeader = el.innerHTML;
   //alert('msgHeader: '+msgHeader);
   
   //$('.description-area h3').addClass('hidden');
   $('.description-area #h3_txt').attr('innerHTML', msgHeader);
   $('.desc-cont').removeClass('hidden');
   $('#sub_options').addClass('hidden');
   
   $('#f_sub_type').attr('value', msgHeader);
}


function FFShowEmotion(id) {
   if(lastFace && lastFace != selectedFace) {
      $(lastFace).css({border:"2px dotted white"});
   }
   
   if(selectedFace != '#face-'+id) {
      $('#face-'+id).css({border:"2px dotted rgb(141, 155, 166)"});
   }
   
   lastFace = '#face-'+id;
}

function FFSetEmotion(id) {

   if(selectedFace) {
      $(selectedFace).css({border:"2px dotted white"});
   }

   $('#face-'+id).css({border:"2px solid rgb(101, 105, 106)"});
   selectedFace = '#face-'+id;
   
   $("#f_rating").attr("value",id);
}

function init() {
     
   jQuery.validator.addMethod("phoneAU", function(phone_number, element) {
      phone_number = phone_number.replace(/\s+/g, ""); 
	
	  if(phone_number=="") {
	     return true;
	  }
      if(phone_number.match(/^(\+)?\d{8,12}$/)) {
        return true;
      }
      
	  return false;  
	//return this.optional(element) || phone_number.length > 9 &&
		//phone_number.match(/^(1-?)?(\([2-9]\d{2}\)|[2-9]\d{2})-?[2-9]\d{2}-?\d{4}$/);
   }, "Invalid phone number");

  
  $("#form1").validate({ 
      rules: { 
	        email: {
   	         email: true,
	            required: true
	        }, 
	        
	        phone: { 
	          required: false,
             phoneAU:true
           },
	         
	        msg: {
	           required:true,
	           minlength: 10
	        }
	         
	     },
	     messages: { 
	          email: {
	           required: "Invalid email.",
	           email: "Invalid email."
	          },
	          
	          phone: "Invalid phone no.",
	          
	          msg: {
   	          required: function(rule, element) {
   	                       return " - This field is required.";
   	                    },
   	           minlength: function(rule, element) {
   	                       return " - This field is required.";
   	                    }
	          }
	     },
	     errorPlacement: function(error, element) {
           if (element.attr("name") == "msg") {
             
             $('h3 label#cust_error').html(error);
             
           } else {
             error.insertAfter(element);
             $('h3 label#cust_error').html("");
           }
         },
         unhighlight: function(element, errorClass) {
           $(element).removeClass(errorClass);
           
           if(element.id=="ff-description") {
            $('h3 label#cust_error').html("");
           }
           
           $(element.form).find("label[for=" + element.id + "]").removeClass(errorClass);
        }


	     
	  }); 
   
   $('a.back').click(function () {
      $('#sub_options').removeClass('hidden');
      $('.desc-cont').addClass('hidden');
   
     return false;
   });
   
   
   $('.options a').click(function () {

      
      if(!$('.desc-cont').hasClass('hidden')) {
         $('#sub_options').removeClass('hidden');
         $('.desc-cont').addClass('hidden');
      }


      if(lastSelected) {
         $(lastSelected).removeClass('selected');
      }
      $(this).addClass('selected');
      lastSelected = this;
      
      //alert('hia: '+);
      
      var thisID = $(this).attr('id');
      var opts = new Array('opt-1','opt-2','opt-3','opt-4','opt-5');
      
      
      for(i=0; i<5; i++) {
         
         var elName = opts[i];
         var contName = "#"+opts[i]+'_cont';
               
         if(thisID == elName) {
            //$(contName).css({visibility: "visible"});
            $(contName).removeClass('hidden');
            $(contName).addClass('shown');
            
            var buttonName = $("#"+elName+" .btn-txt").attr("innerHTML");
            
            $("#f_type").attr("value", buttonName);
            
         } else {
            //$(contName).css({visibility: "hidden"});
            $(contName).removeClass('shown');
            $(contName).addClass('hidden');
         }   
         
      }
      
      this.blur();
      return false;
   });
   
}