/* ================================================================ 
Copyright (c) 2011 Stu Nicholls - iStu.co.uk. All rights reserved.
This script and the associated html may be modified in any 
way to fit your requirements.
=================================================================== */
$(window).load(function(){
/* just one variable to set-up */

speed = 0;

/* setting the initial state of the slideshow and first image */
var picVar = $('.iStu12 li.images div.slide div.slidePanel');

/* calculate the total width of the images and set the div.slide to match */
// acttab = new array();
i = 0;
at = 0;
acttab = new Array();

$.each((picVar), function() {
caption=$(this).attr('caption');
if(caption) { 
//	$('.iStu12 li.caption').append('<b class="button">'+caption+'</b>');
 	at=i;
} else {
//	$('.iStu12 li.caption').append('<b style="display:none;">'+caption+'</b>');
}
acttab[i]=at;
i++;
});

totPic = picVar.length;
curPicWidth = picVar.eq(0).width();
curPicHeight = picVar.eq(0).height();
totWidth = 0;

$.each((picVar), function() {
totWidth = totWidth+$(this).width();
});

$('ul.iStu12 li.images div.slide').width(totWidth);

current=0;
var captionVar = $('.iStu12 li.caption b');
tabSet ()

/* resize the containing elements, left/right arrow positions and add the first image caption */
resize(curPicWidth,curPicHeight)


/* monitor 'next' clicks */
$('.iStu12 li.next').click (function() {
	picVar = $('.iStu12 li.images div.slide div.slidePanel');

	/* animate the line of images left one photo - then remove the first image from set, make it the last image then finally move the set to absolute position left:0 */
	curPicWidth = picVar.eq(0).width();
	curPicHeight = picVar.eq(0).height();
	$('ul.iStu12 li.images div.slide').animate({left:-curPicWidth}, speed, 
		function() {
		$('ul.iStu12 li.images div.slide').find('div.slidePanel:first').remove().appendTo('ul.iStu12 li.images div.slide');
		$('ul.iStu12 li.images div.slide').css('left','0px'); 
	});
	/* get the width, height and alt for the currently displayed image */
	curPicWidth = picVar.eq(1).width();
	curPicHeight = picVar.eq(1).height();
	/* animate the containing elements and left/right arrow positions to match the current image */
	/* resize(curPicWidth,curPicHeight) */
	current++
	if(current==totPic) {current=0;}
	tabSet ()
});

$('.iStu12 li.next').dblclick (function() {
	if($.browser.mozilla) {
		$('.caption').css('MozUserSelect','none');
		$('.button').css('MozUserSelect','none');
	}
});

/* monitor 'previous' clicks */
$('.iStu12 li.prev').click (function() {
	/*  get the last image from the set and make it the fist image, then set the left position of the set to minus the width of the new first image */
	$('ul.iStu12 li.images div.slide').find('div.slidePanel:last').remove().prependTo('ul.iStu12 li.images div.slide');
	picVar = $('.iStu12 li.images div.slide div.slidePanel');

	curPicWidth = picVar.eq(0).width();
	curPicHeight = picVar.eq(0).height();

	$('ul.iStu12 li.images div.slide').css('left',-curPicWidth); 
	/* animate the first image to left = 0 */
	$('ul.iStu12 li.images div.slide').animate({left:0}, speed);

	/* animate the containing elements, left/right arrow positions to match the current image and change the caption */
	/* resize(curPicWidth,curPicHeight) */
	current--
	if(current==-1) {current=totPic-1;}
	tabSet ()

});

/* tab clicking routine */
$('.iStu12 li.caption b').click (function() {
	clicked = $(this).index()
	/* if to the right of the current tab then slide left */
	if (clicked>current) {
		rotate=clicked-current;
		picVar = $('.iStu12 li.images div.slide div.slidePanel');
		curPicWidth = 0;

		for (var i=0; i<rotate; i++) {
			curPicWidth = curPicWidth+picVar.eq(i).width();
		}
		$('ul.iStu12 li.images div.slide').animate({left:-curPicWidth},{queue:false, duration:speed,  
			complete: function() {
			for (var n=0; n<rotate; n++) {
			$('ul.iStu12 li.images div.slide').find('div.slidePanel:first').remove().appendTo('ul.iStu12 li.images div.slide');
			$('ul.iStu12 li.images div.slide').css('left','0px'); 
			}}
		});

		/* get the width, height and alt for the currently displayed image */
		curPicWidth = picVar.eq(rotate).width();
		curPicHeight = picVar.eq(rotate).height();
		/* animate the containing elements and left/right arrow positions to match the current image */
		/* resize(curPicWidth,curPicHeight) */
		current=clicked;
		tabSet ()
	}
	/* if to the left of the current tab then slide right */
	if (clicked<current) {
		rotate=current-clicked;
		picVar = $('.iStu12 li.images div.slide div.slidePanel');
		curPicWidth = 0;

		for (var i=0; i<rotate; i++) {
			curPicWidth = curPicWidth+picVar.eq(totPic-1).width();
			$('ul.iStu12 li.images div.slide').find('div.slidePanel:last').remove().prependTo('ul.iStu12 li.images div.slide');
		}

		$('ul.iStu12 li.images div.slide').css({left:-curPicWidth, 
			complete: function() {
			/* animate the first image to left = 0 */
			$('ul.iStu12 li.images div.slide').animate({left:0}, speed);
			}
		});
		/* get the width, height and alt for the currently displayed image */
		picVar = $('.iStu12 li.images div.slide div.slidePanel');
		curPicWidth = picVar.eq(0).width();
		curPicHeight = picVar.eq(0).height();
		/* animate the containing elements and left/right arrow positions to match the current image */
		/* resize(curPicWidth,curPicHeight) */
		current=clicked;
		tabSet ()
	}
});

$('.iStu12 li.caption b').mouseover (function() {
	if ($(this).index()!==current) {
 		$(this).removeClass("button");
 		$(this).addClass("button_on");
	}
}).mouseout(function(){
	if ($(this).index()!==current) {
 		$(this).removeClass("button_on");
 		$(this).addClass("button");
	}
});


function tabSet () {
	captionVar.removeClass("button_on");
	captionVar.addClass("button");
	captionVar.eq(acttab[current]).addClass("button_on");
}

/* resize the containing elements, the left/right arrow positions and update the caption */
function resize (w,h) {
	$('.iStu12').animate({width:w, height:h},speed);
	$('.iStu12 li.images').animate({width:w, height:h},speed);
}

});