jQuery().ready(function()
{
	if($('.images').length > 0)
	{
		function Block(element, blockSize, position, images)
		{
			var elements;
			var temp;
			this.element = element;
			this.blockSize = blockSize;
			this.position = position;
			this.images = images;
			this.element.css({ position: 'absolute', width: blockSize + 'px', height: blockSize + 'px', left: (this.position.x * (blockSize + 1)) + 'px', top: (this.position.y * (blockSize + 1)) + 'px', overflow: 'hidden', 'z-index': 1 });
			for(var i=0; i<this.images.length; i++)
			{
				var blockImage = $('<div></div>').css({ width: blockSize + 'px', height: blockSize + 'px', 'background-image': 'url(' + this.images[i] + ')', 'background-position': (this.position.x * -(blockSize+1)) + 'px ' + (this.position.y * -(blockSize+1)) + 'px' });
				this.element.append(blockImage);
				if(i > 0)
				{
					blockImage.css({ width: 0, 'margin-left': (blockSize / 2) });
				}
			}
			this.setZIndex = function(value)
			{
				this.element.css({ 'z-index': value });
			};
			this.flip = function()
			{
				elements = this.element.children('div');
				$(elements[0]).animate({ width: 0, 'margin-left': (blockSize / 2) }, 500, function()
				{
					$(this).hide().appendTo($(this).parent());
					$(elements[1]).show().animate({ width: blockSize, 'margin-left': 0 }, 500);
				});
			};
			return true;
		}
		
		function Shadow(element, position)
		{
			this.element = element;
			this.position = position;
			this.element.css({ position: 'absolute', width: '138px', height: '138px', left: (this.position.x * (blockSize + 1) - 10) + 'px', top: (this.position.y * (blockSize + 1) - 10) + 'px', 'background-image': 'url(/images/block_shadow.png)', 'z-index': 2 });
			return true;
		}
		
		if($('.images img').length > 0)
		{
			var blockSize = 118;
			var width = ($('.images').width() + 1) / (blockSize + 1);
			var height = ($('.images').height() + 1) / (blockSize + 1);
			var blockTmp = new Object();
			var imageURLs = new Array();
			$('.images img').each(function()
			{
				imageURLs.push($(this).attr('src'));
			});
			var map = $('map[name="' + $('.images img').attr('usemap').replace('#', '') + '"]');
			var blocks = new Array();
			var shadowedBlocks = new Array();
			var coords = new Object();
			var i = 0;
			var j = 0;
			for(i=0; i<height; i++)
			{
				shadowedBlocks[i] = new Array();
				for(j=0; j<width; j++)
				{
					shadowedBlocks[i][j] = false;
				}
			}
			map.children('area').each(function()
			{
				coords = $(this).attr('coords').split(',');
				if(coords.length > 1)
				{
					shadowedBlocks[coords[1]][coords[0]] = true;
				}
			});
			for(i=0; i<height; i++)
			{
				for(j=0; j<width; j++)
				{
					blocks.push(new Block($('<div></div>'), blockSize, { x: j, y: i }, imageURLs));
					$('.images').append(blocks[blocks.length-1].element);
					if(shadowedBlocks[i][j])
					{
						var testShadow = new Shadow($('<div></div>'), { x: j, y: i });
						$('.images').append(testShadow.element);
						blocks[blocks.length-1].setZIndex(3);
					}
				}
			}
			$('.images img').remove();
			
			$.extend({flipTheShizzle: function()
			{
				var timerId = 0;
				i = 0;
				timerId = setInterval(function()
				{
					if(i < blocks.length)
					{
					
						if(blocks[i] != undefined)
						{
							blocks[i].flip();
						}
						i ++;
					}
					else
					{
						clearInterval(timerId);
					}
				}, 150);
				return false;
			}});
			
			if(imageURLs.length > 1 && $('.images').hasClass('auto'))
			{
				setInterval(function()
				{
					$.flipTheShizzle();
				}, (width * height * 2 * 150));
			}
		}
	}
	if($('#visuallized_it').length > 0)
	{
		$('#visuallized_it').click(function()
		{
			if($(this).hasClass('before'))
			{
				$(this).removeClass('before').addClass('after');
			}
			else
			{
				$(this).removeClass('after').addClass('before');
			}
			$.flipTheShizzle();
			return false;
		});
	}
});