/*
note: the full "JQuery" function name is used instead of the traditional dollar sign to avoid conflicts with Prototype
*/
jQuery(document).ready(function(){

	//vertically align elements
	jQuery.fn.vAlign = function() {
		return this.each(function(i){
			var ah = jQuery(this).height();
			var ph = jQuery(this).parent().height();
			var mh = (ph - ah) / 2;
			jQuery(this).css('margin-top', mh);
		});
	};

	//equal height divs hack
	jQuery('.secondary-products img').load(function(){
		jQuery('.featured-product .sub').height(jQuery('.secondary-products').height());
	});
	
	//initialize lightbox
	jQuery('a[rel*=lightbox]').fancybox({
		'overlayShow': 		true,
		'overlayOpacity':	0.85
	});
	
	//use jquery to hide tooltips
	jQuery('.tooltip').removeClass('hidden').hide();
	
	//define form options object
	var formOptions={
		beforeSubmit:formSubmit,
		success:formSuccess
	};
	
	//the form to add an item is submited
	function formSubmit(formData, jqForm, options){
		//save the item's ID in a global variable
		jQuery.cartItemID=jQuery(':input[name=id]',jqForm).fieldValue()[0];
		//show the "loading" tooltip and give it a special class
		jQuery('.tooltip',jqForm)
			.addClass('isLoading')
				.show("fast")
					.find('.add-loading')
						.removeClass('hidden');	
	};
	
	//an item has successfuly been added to the cart
	function formSuccess(responseText,statusText){
		//replace cart message (i.e.: "3 items in cart") with message from ajax call
		jQuery('#cart-message').html(jQuery('#cart-message', responseText).html());
		//hide "loading" animation in tooltip
		jQuery('.isLoading .add-loading').addClass('hidden');
		//show success message in tooltip
		jQuery('.isLoading .add-success').show("fast");
		//function to hide tooltip if user clicks anywhere
		jQuery('body').one('click',function(){
			jQuery('.isLoading').hide("medium");
			jQuery('.isLoading').removeClass('isLoading');
			jQuery('.isLoading .add-success').addClass('hidden');
			clearTimeout(myTO);
		});
		//set timeout to hide tooltip after 3 seconds
		myTO=setTimeout ( function(){
			jQuery('.isLoading').hide("medium");
			jQuery('.isLoading').removeClass('isLoading');
		}, 3000 );
	};
	
	//add javascript form submission to all forms that add products
	jQuery('.add-product').ajaxForm(formOptions);

/*
Note: the cart is loaded using the jquery lightbox "fancybox" ( http://fancy.klade.lv/ ), which has some drawbacks that need to be hacked around: click events seem to be disabled inside the lightbox, and there doesn't seem to be any methods to open or close the lightbox externally. 
*/

	//load cart and open it in popup overlay
	function openCart(){
		//hide tooltip
		jQuery('.isLoading').hide();
		//ajax call for page "/cart"
		jQuery.post("/cart", function(data){
			//get cart contents and put them in a hidden div
			jQuery('#cart-overlay .container').html(jQuery('.cart',data));
			//remove some elements so that the cart occupies less screen real estate
			jQuery('.remove-link,.product-description,.intro', '#cart-overlay').remove();
			//make the headings smaller
			jQuery('h2, h3','#cart-overlay').addClass('small-title');
			//remove class 'hidden' so that Jquery can calculate lightbox height
			jQuery('#overlay-wrapper').removeClass('hidden');
			//add lightbox to a hidden link
			jQuery('#open-cart-link').fancybox({
				'overlayShow': 		true,
				'overlayOpacity':	0.85,
				'frameWidth':		600,
				'frameHeight':		jQuery('#overlay-wrapper').height()
			});
			//trigger click event on hidden link to display lightbox
			jQuery('#open-cart-link').trigger('click');
			//hide div again
			jQuery('#overlay-wrapper').addClass('hidden');
		});
		return false;
	}
	//call function "openCart" on click event
	jQuery('.open-cart').live("click",openCart);
});