(function($) {
	
	var opt, imgs, btnImgs;
	var numImgs;
	var numSlots = 5;
	var startPos = 1;
	var mainImgPos = 2; // index of center image
	var tier_1, tier_2, tier_3;
	var centerX = 0, centerY = 0;
	
	$.fn.extend({
		
		tabCarousel: function(options) { 
				
			opt = $.extend({},$.tabCarouselSetup.defaults, options);
			centerX = parseInt(opt.containerWidth / 2);
			tier_1 = $.tabCarouselSetup.tier1;
			tier_2 = $.tabCarouselSetup.tier2;
			tier_3 = $.tabCarouselSetup.tier3;
			
			$('#tabCarousel').show();
			imgs = $('#tabCarousel > img');
			
			btnImgs = $.tabCarouselSetup.btnImages;
			numImgs = imgs.length;

			imgs.each(function(i) { new $.imageSetUp($(this), i); fillCarousel(); });			
			new $.tabCarouselSetup();
        }
	});
	
	$.tabCarouselSetup = function() {
		
		if (opt.btnPrev) { 
			$(opt.btnPrev)
				.css('cursor', 'pointer')
				.click(shiftLeft)
				.hover(function() {
					$(this).attr('src', btnImgs.prevOn);
				},
				function() {
					$(this).attr('src', btnImgs.prevOff);
				});
		}
		
		if (opt.btnNext) {
			$(opt.btnNext)
				.css('cursor', 'pointer')
				.click(shiftRight)
				.hover(function() {
					$(this).attr('src', btnImgs.nextOn);	
				},
				function() {
					$(this).attr('src', btnImgs.nextOff);
				});
		}
    };

	$.imageSetUp = function(img, index) {
		
		img.css('visibility', 'hidden');
		
		var _left, _top;
		
		if (index == 2) {

			_left = centerX - (tier_1.width / 2);
			setImageStyle(img, tier_1, _left, 0);
		}
		else if (index == 1 || index == 3) {
						
			if (index == 3)	_left = centerX - (tier_1.width / 2) - (tier_2.width / 3);
			else			_left = centerX + (tier_1.width / 2) + (tier_2.width / 3) - tier_2.width;
			
			_top = centerY + (tier_1.height - tier_2.height)/2;
			
			setImageStyle(img, tier_2, _left, _top);
		}
		
		// If there are more than 5 images, use the 5-image carousel
		if (numImgs >= 5)
		{
			if (index == 0 || index > 4) {
							
				if (index > 4) _left = centerX - (tier_1.width / 2) - (tier_2.width / 3) - (tier_3.width / 3);
				else			_left = centerX + (tier_1.width / 2) + (tier_2.width / 3) + (tier_3.width /3) - tier_3.width;
				
				_top = centerY + (tier_1.height - tier_3.height)/2;
				
				setImageStyle(img, tier_3, _left, _top);
			}
		}
	};
	
	function animateShift(img, index) {
		
		var _left, _top;
		
		// Set image (tier CSS classes) according to their index.  Current configuration has the images
		// laid out as [img4][img3][img2][img1][img0].
		
		// Tier 1 Image
		if (index == 2) {
		
			_left = centerX - (tier_1.width / 2);
			
			img.animate({ 'left': _left, 'width': tier_1.width, 
				'height': tier_1.height, 'top': 0, 'z-index': tier_1.zIndex },
				'slow', 'swing', function() {
					setImageStyle(img, tier_1, _left, 0);
					$('.CarouselMenu .Title').text(img.attr('alt')).fadeIn('slow');
				});
			
			if (img.hasClass('link') && img.attr('longdesc') != '') {
				img.unbind('click')
				   .click(function() {window.open($(this).attr('longdesc'))});
		    $('#CarouselTitle').unbind('click')
		    .click(function() {window.open(img.attr('longdesc'))});
			}
		}
		// Tier 2 Image
		else if (index == 1 || index == 3) {
				
			if (index == 3)	_left = centerX - (tier_1.width / 2) - (tier_2.width / 3);
			else			_left = centerX + (tier_1.width / 2) + (tier_2.width / 3) - tier_2.width;
			
			_top = centerY + (tier_1.height - tier_2.height)/2;
			
			img.animate({ 'left': _left, 'width': tier_2.width, 
				'height': tier_2.height, 'top': _top, 'z-index': tier_2.zIndex },
				'slow', 'swing', function() {
					setImageStyle(img, tier_2, _left, _top);
				});

			img.unbind('click')
			   .click(function() {
					shiftTo(index);
			});
		}
		
		if (numImgs >= 5)
		{
			// Tier 3 Image
			if (index == 0 || index == 4) {
							
				if (index == 4) _left = centerX - (tier_1.width / 2) - (tier_2.width / 3) - (tier_3.width / 3);
				else			_left = centerX + (tier_1.width / 2) + (tier_2.width / 3) + (tier_3.width /3) - tier_3.width;
				
				_top = centerY + (tier_1.height - tier_3.height)/2;
				
				img.animate({ 'left': _left, 'width': tier_3.width, 
					'height': tier_3.height, 'top': _top, 'z-index': tier_3.zIndex },
					'slow', 'swing', function() {
						setImageStyle(img, tier_3, _left, _top);
					});
				
				img.unbind('click')
				.click(function() {
						shiftTo(index);
				});
			}
		}
	};
	
	function setImageStyle(img, tier, l, t) {
		img.css('width', tier.width + 'px')
		.css('height', tier.height + 'px')
		.css('position', 'absolute')
		.css('left', l + 'px')
		.css('top', t + 'px')
		.css('opacity', tier.opacity)
		.css('z-index', tier.zIndex)
		.css('cursor', 'pointer')
		.css('visibility', 'visible');
	}
    
    // Shifts the carousel images left (clockwise).
    function shiftLeft() {
		startPos = (startPos == 1 ? numImgs : startPos - 1);				
		fillCarousel();
    }
    
    // Shifts the carousel images right (counter-clockwise).
    function shiftRight(n) {
		startPos = (startPos == numImgs ? 1 : startPos + 1);
		fillCarousel();
    }
    
    // Shifts the carousel so that the image at index i is moved to the main position.
    function shiftTo(n) {
		if (n < mainImgPos) {
			for (var i=0; i < mainImgPos - n; i++) {
				shiftLeft();
			}
		} else if (n > mainImgPos) {
			for (var i=0; i < n - mainImgPos; i++) {
				shiftRight();
			}
		}
    }
    
    // Fill the carousel images.
    function fillCarousel() {
		
		var j = 0;
		imgs.each(function() { $(this).hide() });
		
		for (var i = startPos; i < startPos + numSlots; i++) {
			var index = (i % numImgs) - 1;
			if (index < 0) index = numImgs - 1;			
			animateShift(imgs.eq(index), j);
			j++;
		}
    }
    
    // Image tier styles
    $.tabCarouselSetup.tier1 = { width: 192, height: 126, opacity: 1,	 zIndex: 10 };
    $.tabCarouselSetup.tier2 = { width: 123, height: 81,  opacity: 0.75, zIndex: 5  };
    $.tabCarouselSetup.tier3 = { width: 79,  height: 52,  opacity: 0.5,	 zIndex: 1  };
    
    // Navigation button images
    $.tabCarouselSetup.btnImages = {
		prevOff: 'ecms.aspx/$tabus/Images/Carousel/carousel_left_off.jpg',
		prevOn: 'ecms.aspx/$tabus/Images/Carousel/carousel_left_on.jpg',
		nextOff: 'ecms.aspx/$tabus/Images/Carousel/carousel_right_off.jpg',
		nextOn: 'ecms.aspx/$tabus/Images/Carousel/carousel_right_on.jpg'
    }
    
    // Default plugin settings
    $.tabCarouselSetup.defaults = {
		btnPrev: null,
		btnNext: null,
		containerWidth: 200
    };

})(jQuery);