var thumbList = new Array();
var thumbOffset = 164; // Width of item plus right margin
var timeIntBubble;

jQuery(document).ready(function($) {

	/* Remove urls */
	$('#MiniGallery .LeftButton, #MiniGallery .RightButton').attr('href','javascript:void(0)');
	
	/* Remove urls from the portfolio thumbs - this may change later! */
///	$('#MiniGallery li > a').attr('href','javascript:void(0)');
								
	/* Left/Right Button Hover State */
	$('#MiniGallery .LeftButton, #MiniGallery .RightButton').each(
		function(){
			// Add the nohover class which overrides the base css :hover state
			$(this).addClass('NoHover');
			// Add the hover state
			$(this).append('<span class="Hover" />');
		}
	).hover(
		function(){
			$(this).find('span.Hover').css({'opacity':0,'display':'block'});
			$(this).find('span.Hover').animate({opacity: 1},200,'swing');
		},
		function(){
			$(this).find('span.Hover').animate({opacity: 0},250,'swing');	
		}
	);
	
	/* Left/Right Button Clicky */
	$('#MiniGallery .LeftButton').click(function(){mg_moveThumbs('left');});
	$('#MiniGallery .RightButton').click(function(){mg_moveThumbs('right');});
	
	/* Portfolio Thumb Scrolling */
	/* First we need to re-arrange the thumbs so that they are absolutely positioned and give each of them a position */
	/* We also need to wang them all in array to preserve ordering (for below) */
	var curPos = 0;
	$('#MiniGallery_Viewport li').each(
		function(){
			$(this).addClass('JS').css('left',curPos);
			curPos += thumbOffset;
			thumbList.push($(this));
		}
	);

});

function mg_moveThumbs(direction){
	var offset = (direction == 'left') ? thumbOffset : -thumbOffset;
	
	/* Work out the start point for moved thumbs  - This is the position of the farthest thing in the direction we are moving */
	var startPoint = 0;
	for(var i = 0;i < thumbList.length;i++){
		$(thumbList[i]).stop(false,true);
		if(direction == "left"){
			var myPos = $(thumbList[i]).position().left;
			if(myPos < startPoint){
				startPoint = myPos;	
			}
		}else{
			var myPos = $(thumbList[i]).position().left + thumbOffset;
			if(myPos > startPoint){
				startPoint = myPos;	
			}
		}
	}
	
	
	/* Move anything we need to move to correct end - we use the array of thumbs here to preserve their order. */
	var curPoint = startPoint;
	if(direction == "left"){
		for(var i = thumbList.length-1;i >= 0;i--){
			var $this = $(thumbList[i]);
			if(parseInt($this.css('left')) > thumbOffset*3){
				$this.css('left',curPoint - offset);
				curPoint -= Math.abs(offset);
			}
		}		
	}else{
		for(var i = thumbList.length-1;i >= 0;i--){
			var $this = $(thumbList[i]);
			if(parseInt($this.css('left')) < 0){
				$this.css('left',curPoint);
				curPoint += Math.abs(offset);
			}
		}
	}

	/* Do the animation */	
	$('#MiniGallery_Viewport li').each(
		function(){
			var newPos = parseInt($(this).css('left'));
			newPos += offset;
			$(this).stop(false,true);
			$(this).animate({left: newPos},{duration: 400, queue: true, easing: 'swing'});

		}
	);
	
	
}
