$(document).ready(function() {
	
	//modify book images that overflow
	$(".image").each(function(index, callback) {
	imageLoader($(this),index);
	});

	function imageLoader(loader,index){

	var	img_src	= loader.find('img').attr('src');
	var img			= $('<img></img>');
		img.hide();

		img.load(function() {
			loader.find('img').attr('src',img_src);

			//remove constraining css values
			loader.find('img').css('position','relative').css('height','170px').css('margin-top','10px').css('margin-bottom','20px');
			loader.find('img').css('max-width', 'none').css('bottom', '0px');
			//loader.parent().find('.coming').addClass('soon');
			//loader.find('.coming').css('bottom', '0px');

			var parent_w	= loader.parent().width();
			var element_w	= loader.width();
			var overlap		= parent_w - 3;
			var img_width = loader.find('img').width();
			var img_height = loader.find('img').height();
			var idx	= (index+1) % books_per_row;

			//loader.parent().find('.author').html( img_width );

			if (img_width > element_w) {
				//add expansion arrow
				var content = loader.html();
				loader.html('<div class="expander"></div>');
				loader.children().html( content );
				loader.children().find('a').append('<div class="expander_arrow"><p>&raquo;</p></div>');

				//steal margins and shadow from image
				var margin_top	= loader.find('img').css('margin-top');
				var margin_bot	= loader.find('img').css('margin-bottom');
				var shadow		= loader.find('img').css('box-shadow');
				loader.find('img').css('margin-top',0).css('margin-bottom',0).css('box-shadow','auto');
				loader.find('.expander').css('margin-top',margin_top).css('margin-bottom',margin_bot).css('box-shadow',shadow);

				//set animations
				loader.mouseover(function() {
					var img_width = loader.find('img').width();
					var div_width = loader.width();

					loader.css('z-index',100);
					loader.children().stop().animate({
							width: img_width
						}, 'fast', function() {
						// Animation complete.
					});
					loader.find('.expander_arrow').stop().animate({
							opacity: 0
						}, 'fast', function() {
						// Animation complete.
						loader.find('.expander_arrow').hide();
						if ((idx > 0) && (img_width > overlap)) { //if not on the end of the row
							$(".image img:eq("+ (index+1) +")").stop().animate({
									opacity: 0.5
								}, 'slow', function() {
								// Animation complete.
							});
						}
					});

				}).mouseout(function() {
					var img_width = loader.find('img').width();
					var div_width = loader.width();

					loader.css('z-index',1);
					loader.children().stop().animate({
							width: div_width
						}, 0, function() {
						// Animation complete.
					});
					loader.find('.expander_arrow').show();
					loader.find('.expander_arrow').stop().animate({
							opacity: 0.5
						}, 'slow', function() {
						// Animation complete.
					});
					if ((idx > 0) && (img_width > overlap)) { //if not on the end of the row
						$(".image img:eq("+ (index+1) +")").stop().animate({
								opacity: 1
							}, 'fast', function() {
							// Animation complete.
						});
					}
				});
			} else { //reset oversized shadows
				loader.parent().find('.image').css('width',img_width+'px');
				loader.parent().find('.coming').addClass('soon');
			}
		
		})
		.error(function () {
			loader.find('img').attr('src', '/images/nocover.png');
			loader.parent().find('.coming').addClass('soon');
		})
		.attr('src', img_src)
	}


});