function big (elem){
	var width = $(elem).width()*2;
	var height = $(elem).height()*2;
	if (width==180) $(elem).css({cursor:"pointer"}).width(width).height(height);
	else $(elem).css({position:"absolute",cursor:"pointer"}).width(width).height(height);
	
}

function small (elem){
	var width = $(elem).width()/2;
	var height = $(elem).height()/2;
	$(elem).css({position:""}).width(width).height(height);
}

$.fn.zoomtabs = function (zoomPercent, easing) {
	if (!zoomPercent) zoomPercent = 10;
	
	return this.each(function () {
		var $zoomtab = $(this);
		var $tabs = $zoomtab.find('.tabs');
		var height = $tabs.height();
		
		var panelIds = $tabs.find('a').map(function () {
			return this.hash;
		}).get().join(',');
		
		$zoomtab.find('> div').scrollTop(0);
		
		var $panels = $(panelIds);
		var images = [];
		
		$panels.each(function () {
			var $panel = $(this),
				bg = ($panel.css('backgroundImage') || "").match(/url\s*\(["']*(.*?)['"]*\)/),
				img = null;
			
			if (bg !== null && bg.length && bg.length > 0) {
				bg = bg[1];
				img = new Image();
				
				$panel.find('*').wrap('<div style="position: relative; z-index: 2;" />');                    
				$panel.css('backgroundImage', 'none');
				
				$(img).load(function () {
					var w = this.width;
					var wIn = w / 100 * zoomPercent;
					var h = this.height;
					var hIn = h / 100 * zoomPercent;
					var top = 0;

					var fullView = {
						height: h + 'px',
						width: w + 'px',
						top: top,
						left: 0
					};
											
					var zoomView = {
						height: (h + hIn) + 'px',
						width: (w + wIn) + 'px',
						top: top,
						left: '-' + (wIn / 2) + 'px'
					};
					
					$(this).data('fullView', fullView).data('zoomView', zoomView).css(zoomView);

				}).prependTo($panel).css({'position' : 'absolute', 'top' : 0, 'left' : 0 }).attr('src', bg);
				
				images.push(img);
			}
		});
		
		function zoomImages(zoomType, speed) {
			$(images).each(function () {
				var $image = $(this);
				if ($image.is(':visible')) {
					$image.stop().animate($image.data(zoomType), speed, easing);
				} else {
					$image.css($image.data(zoomType), speed);
				}
			});
		}
					
		$tabs.height(0).hide();
		var speed = 200;
		
		$zoomtab.hover(
			function () {
				zoomImages('fullView', speed);
				$tabs.stop().animate({ height : height }, speed, easing);
			},
			function () {
				zoomImages('zoomView', speed);
				$tabs.stop().animate({ height : 0 }, speed, easing, function () {
				  $tabs.hide();
				});
			}
		);
		
		var hoverIntent = null;
		$tabs.find('a').hover(function () {
			clearTimeout(hoverIntent);
			var el = this;
			hoverIntent = setTimeout(function () {
				$panels.hide().filter(el.hash).show();
			}, 100);
		}, function () {
			clearTimeout(hoverIntent);
		}).click(function () {
			return false;
		});
	});
};

$(function () {
	$('.zoomoutmenu').zoomtabs(15);
});