$(document).ready(function() {
	$('.kwicks').kwicks({
		max: 500
		,spacing: 10
		//,onOpenStart: onOpenStart
		//,onCloseStart: onCloseStart
		//,onOpenComplete: onOpenComplete
		//,onCloseComplete: onCloseComplete
	});

	$('.kwicks li').eq(0).hover(function(){
		var $this = $(this).children('.interior');
		$this.animate({
			width: '90%',
			height: '500px'
		},300,function(){
			$this.children('form').fadeIn();
		});
	},function(){
		var $this = $(this).children('.interior');
		$this.children('form').fadeOut('fast',function(){
			$this.animate({
				width: '166px',
				height: '85px'
			},300);
		});
	});
	
	/*
	 * Sign up form
	 */
	$('#signUp').submit(function(e){
		// temp var for the messages
		// jQuery "this" for the form
		var $form = $(this);
		// processing page
		var url = $form.attr('action');
		alert(url);
		// obj which will be submitted to the processing page
		var submitObj = {};
		// list of required fields
		var reqFields = [];
		// reference the "requiredFields" hidden form field
		// this will will list all req fields and be submitted
		// to the processing page
		var $requiredFields = $('input[name=requiredFields]',$form);
		// get array of all required fields
		var $required = $('.required',$form);
		// loop over required form fields, determine if any are left blank
		// if they are, then display an error msg.
		$required.each(function(){
			// push required field names to the required array
			reqFields.push($(this).attr('name'));
			// current form element
			$el = $(this);
			// if a required element is empty, change it's background image
			if ($el.val() == '') $el.css('background',"url('images/icon_required_active.gif') #ffffff no-repeat 100% 0px");
		});
		// set the list of required fields into the hidden form field
		$requiredFields.val(reqFields);
		// get all form fields, dump them into the form obj in prep for submission
		$('input, textarea',$form).each(function(){
			// shortcut
			$el = $(this);
			// add into the submitObj
			submitObj[$el.attr('name')] = $el.val();
		});
		// prepare the ajax call
		$.ajax({
			type: "POST",
			url: "some.php",
			data: "name=John&location=Boston",
			success: function(msg){
				alert( "Data Saved: " + msg );
			}
		});
		e.preventDefault();		
	});
	
	/*
	 * reset form field required images to default
	 */
	$('form .required').focus(function(){
		$(this).css('background',"url('images/icon_required.png') #ffffff no-repeat 100% 0px");		
	});
	
	
/**/	
	function onOpenStart(){
		
	}
	
	function onCloseStart(){

	}
	
	function onOpenComplete(){
		var $this = $(this).children('.interior');
		$this.animate({
			width: '85%',
			height: '500px'
		},300,function(){
			$this.children('form').fadeIn();
		});
	}
	
	function onCloseComplete(){
		var $this = $(this).children('.interior');
		$this.children('form').fadeOut('fast',function(){
			$this.animate({
				width: '166px',
				height: '85px'
			},300);
		});
	}
});