$(document).ready(function() {

	//ACADEMIC APPEAL FORM - FORM SELECTOR
	$('form[name=appeal] div.absence').hide();
	$('form[name=appeal] div.other').hide();
	$('select.ddreveal').change(function() {
		$('form[name=appeal] div.absence').slideUp();
		$('form[name=appeal] div.other').slideUp();
		var ddval = $(this).val();
		$("div." + ddval).slideDown(300);
	});
	
	//ACADEMIC APPEAL FORM - HANDLES INITIAL MAX LENGTH SETTINGS
	$('input[name=absence_1_reason]').maxlength({
    'feedback' : '.1charsLeftAb'
  });
  
  $('input[name=absence_1_documentation]').maxlength({
    'feedback' : '.1charsLeftDoc'
  });
  
  $('textarea[name=absence_add_info]').maxlength({
    'feedback' : '.charsLeftAddInfo'
  });
  
  $('textarea[name=other_description]').maxlength({
    'feedback' : '.charsLeftOtherDesc'
  });
  
  $('textarea[name=other_documentation]').maxlength({
    'feedback' : '.charsLeftOtherDocs'
  });
  
  $('textarea[name=other_action]').maxlength({
    'feedback' : '.charsLeftOtherAction'
  });	
	
	//ACADEMIC APPEAL FORM - ADDS FIELDS FOR ABSENCES - SETS MAX LENGTHS FOR EACH ONE ADDED
	$('#addfield').click(function(){
		var id = document.getElementById("absence_count").value;
		
		id++;
		
		if (id <=12) {
		  $("div.absence>div:first").append("<fieldset><legend>Absences #" + id + ":</legend><div><div>  <label for='absence_" + id + "_date'>Absence Date:</label> <input type='text' name='absence_" + id + "_date' size='10'></div><div>  <label for='absence_" + id + "_reason'>Reason for Absence:</label> <input type='text' name='absence_" + id + "_reason'  maxlength='150' size='50'><p class='charleft'>Characters Left: <span class='" + id + "charsLeftAb'>150</span></p></div><div><label for='absence_" + id + "_documentation'>Documentation:</label> <input type='text' name='absence_" + id + "_documentation' maxlength='150' size='50'><p class='charleft'>Characters Left: <span class='" + id + "charsLeftDoc'>150</span></p></div></div></fieldset>");

      $('input[name=absence_'+ id +'_reason]').maxlength({
        'feedback' : '.'+ id +'charsLeftAb'
      });
      $('input[name=absence_'+ id +'_documentation]').maxlength({
        'feedback' : '.'+ id +'charsLeftDoc'
        

    });
    
		document.getElementById("absence_count").value = id;
		
		if (id==12) {$('#addfield').hide();};
		  
	  };
  });
	
	//ADMISSIONS YOUTH MINISTER SUBMISSION FORM - ADD FIELDS FOR EXTRA STUDENTS
	$('#addstudentfield').click(function(){
		var id = document.getElementById("form_count").value;
		
		id++;
		
		$("div.student").append("<fieldset><legend>Student #" + id +  " Information</legend><div><label for='student_" + id + "_first_name'>First Name</label> <input type='text' name='student_" + id + "_first_name' size='20' /></div><div><label for='student_" + id + "_last_name'>Last Name</label> <input type='text' name='student_" + id + "_last_name' size='20' /></div><div><label for='student_" + id + "_graduation'>Graduation Year</label> <input type='text' name='student_" + id + "_graduation' size='20' /></div><div><label for='student_" + id + "_address'>Address</label> <input name='student_" + id + "_address' size='53' /></div><div><label for='student_" + id + "_city'>City</label> <input type='text' name='student_" + id + "_city' size='20' /><label for='student_" + id + "_state'>State</label> <input type='text' name='student_" + id + "_state' size='20' /><label for='student_" + id + "_zip'>Zip</label> <input type='text' name='student_" + id + "_zip' size='5' /></div><div><label for='student_" + id + "_phone'>Phone</label> <input type='text' name='student_" + id + "_phone' size='17' /> <label for='student_" + id + "_email'>Email</label> <input type='text' name='student_" + id + "_email' size='35' /></div></fieldset>");
    
		document.getElementById("form_count").value = id;
		  
  });
  
  
  //LIBRARY REQUEST RESERVE SUBMISSION FORM - ADD FIELDS FOR EXTRA ITEMS
  $("#datepickers1").datepicker();
  $("#datepickere1").datepicker();

	$('#additemfield').click(function(){
		var id = document.getElementById("form_count").value;
		
		id++;
		
		$("div.item").append("<fieldset><legend>Item #" + id + " Information</legend> <div><label for=\"item_" + id + "_type\">Item Type:</label> <select name=\"item_" + id + "_type\">  <option value=\"-\"></option>  <option value=\"book\">Book</option>  <option value=\"video\">Video/DVD</option>  <option value=\"journal\">Journal Article</option>  <option value=\"other\">Other</option></select> </div>  <div>	<label for=\"item_" + id + "_title\">Item Title</label> <input type=\"text\" name=\"item_" + id + "_title\" size=\"30\" /> 	</div> <div>	<label for=\"item_" + id + "_num\">Item Number</label> <input type=\"text\" name=\"item_" + id + "_num\" size=\"3\" />	</div>	<div>	<label for=\"item_" + id + "_prof_copy\">Professor Copy</label> <input type=\"checkbox\" name=\"item_" + id + "_prof_copy\" /> 	</div> 	<div>	<label for=\"item_" + id + "_time\">Circulation Time:</label><br>	<input type=\"radio\" name=\"item_" + id + "_time\" value=\"two_hour\" /> Two Hour<br/>		<input type=\"radio\" name=\"item_" + id + "_time\" value=\"overnight\" /> Overnight<br/>	<input type=\"radio\" name=\"item_" + id + "_time\" value=\"one_day\" /> One Day<br/>		<input type=\"radio\" name=\"item_" + id + "_time\" value=\"three_days\" /> Three Days<br/>  		<input type=\"radio\" name=\"item_" + id + "_time\" value=\"other\" class=\"other\"/> Other <span class=\"specify\">- <label for=\"item_time_other\">Please Specify Other:</label> <input type=\"text\" name=\"item_time_other\" size=\"30\" /></span></div> 	<div>    	 <label for=\"startdate_" + id + "\">Date Item is go ON reserve:</label> <input type=\"text\" name=\"startdate_" + id + "\" size=\"10\" id=\"datepickers" + id + "\">   	</div>   	<div>    	 <label for=\"enddate_" + id + "\">Date Item is go OFF reserve:</label> <input type=\"text\" name=\"enddate_" + id + "\" size=\"10\" id=\"datepickere" + id + "\"> (Professor Copies will be returned at this time)     	</div>     </fieldset>");

		var selectstart = "#datepickers" + id;
		var selectend = "#datepickere" + id;
    
    $(selectstart).datepicker();
    $(selectend).datepicker();

    
		document.getElementById("form_count").value = id;
		  
  });

  
});