jQuery(function($){
	
	duration = (typeof(duration) != "undefined")?duration:4;
	
	var timer;
	var tempWidth;
	var performance; // this variable is used for the status of showing and hidding the informatino pannels.
	var reminingTime; // this variable informs the time of rest of events
	var acting; // this variable obatins info of events (next, prev, index)
	
	jQuery(document).ready(function(){
		/* shift a item to left or to right */
		var moveItem = function(action){
			var index;
			// get event info
			var left;
			// fixed find width for calculating for remining time
			if($('.carousel').css('left') == 'auto'){
				left = 0;
			}else{
				left = parseFloat($('.carousel').css('left'));
			}
			reminingTime = duration*1000 + 3*1000;
			acting = action;
			stopTimer();
			$(".carousel").stop();
			$(".carousel-info").stop();
			// if the events starts
         if(left == 0){
				if(currentIndex == itemLenth) currentIndex = 0;
				if(currentIndex == -1) currentIndex = itemLenth-1;
				
				$('.carousel-info').removeClass('shown');
				$('.carousel-info').removeAttr('style');
				
				$('.carousel-button > a').removeClass('tabup');			
				$('.carousel-button > a.carouselIndex_'+currentIndex).addClass('tabup');
			}
			/* shift a item to right*/
			if(action == "next"){
				itemWidth = $('.carousel li:nth-child(1) img').width() + 10;
				var tempDuration = (itemWidth + left)/itemWidth;
				$('.carousel').animate({left: -itemWidth}, duration/6*1000*tempDuration, function(){
					var prevClass = $('.carousel li:nth-child(1)').attr("class");
					var prev = $('.carousel li:nth-child(1)').html();
					$('.carousel li:nth-child(1)').remove();
					$('.carousel').append('<li class="'+prevClass+'">'+prev+'</li>');
					$('.carousel').css("left","0");
					performance = "showInfo";
					showInfo(0);
					setUpTimer();
				});
			}else if (action == "initial"){
			/*beginging*/
				performance = "showInfo";
				showInfo(0);
				setUpTimer();
			}else if (action == "prev"){
			/*shift to left*/
				var prevClass = $('.carousel li:nth-child('+itemLenth+')').attr("class");
				var prev = $('.carousel li:nth-child('+itemLenth+')').html();
				itemWidth = $(prev).width()+10;
				$('.carousel li:nth-child('+itemLenth+')').remove();
				$('.carousel').prepend('<li class="'+prevClass+'">'+prev+'</li>');
				$('.carousel').css("left",-itemWidth);
				$('.carousel').animate({left: 0}, duration/6*1000, function(){
					performance = "showInfo";
					showInfo(0);
					setUpTimer();
				});			
			}else if(action == "index"){
			/*shift items to right*/
				var isFound = 0;
				var tempItems = new Array();
				itemWidth = 0;
				
				//store prev images above the current image
				$('.carousel li').each(function(index){
					var tempItem = new Array();
					
					tempItem.content = $(this).html();
					tempItem.itemClass = $(this).attr("class");
					tempItem.index = tempItem.itemClass.split('_')[1];
		
					if(tempItem.index == currentIndex ){isFound = 1;}
		
					if(!isFound){
						if($(this).children("img").attr("width") == null){
							itemWidth += $(this).children("a").children("img").attr("width") +10;
						}else{
							itemWidth += $(this).children("img").attr("width") + 10;
		
						}
						tempItems.push(tempItem);
					}
				});
				/* if items found */
				if(isFound){
					var tempDuration = (itemWidth + left)/itemWidth;
					$('.carousel').animate({left: -itemWidth}, duration/6*1000*tempDuration, function(){
						$(tempItems).each(function(index, temp){
							$('.carousel li:nth-child(1)').remove();
							$('.carousel').append('<li class="'+temp.itemClass+'">'+temp.content+'</li>');
							$('.carousel').css("left","0");
						});
						performance = "showInfo";
						showInfo(0);
						setUpTimer();
					});	
				}else{
					performance = "showInfo";
					showInfo(0);
					setUpTimer();
				}
			}
		}
		
		
		/* show item detail */
		var showInfo = function(width){
			var CurrentCarouseInfo = $('.carousel li:nth-child(1) .carousel-info');
			if(CurrentCarouseInfo != null) {
				$(CurrentCarouseInfo).show();
				
				// get width of the info pannel
				var temp = $('.carousel li:nth-child(1) .carousel-info .carousel-info-content').css('width');
				infoWidth = parseFloat(temp);
				if(performance == 'showInfo'){
					if(infoWidth > 0){
						$(CurrentCarouseInfo).css('width',width);
						$('.carousel li:nth-child(1) .carousel-info .carousel-info-backgroud').css('opacity','0.7');
						
						// calculate the remining time
						var tempDuration = (infoWidth - width)/infoWidth;
						reminingTime = duration/3*1000*tempDuration + 3*1000 + duration/3*1000;
						$(CurrentCarouseInfo).animate({width:(infoWidth+20)}, duration/3*1000*tempDuration, function(){
							performance = "stayInfo";
							$(CurrentCarouseInfo).animate({width:(infoWidth+20)}, 3*1000, function(){
								performance = "hideInfo";
								$(CurrentCarouseInfo).animate({width:0}, duration/3*1000, function(){$(CurrentCarouseInfo).hide(); performance = "moveItem";});
							});
						});
					}
				}else if (performance == 'stayInfo'){
					// calculate the remining time
					reminingTime = 1.5*1000 + duration/3*1000;
					$(CurrentCarouseInfo).animate({width:(infoWidth+20)}, 2*1000, function(){
						performance = "hideInfo";
						$(CurrentCarouseInfo).animate({width:0}, duration/3*1000, function(){$(CurrentCarouseInfo).hide(); performance = "moveItem";});
					});
				}else if (performance == 'hideInfo'){
					if(infoWidth > 0){
						// calculate the remining time
						$(CurrentCarouseInfo).css('width',width);
						$(CurrentCarouseInfo).css('opacity','0.7');
						var tempDuration = (infoWidth - (infoWidth - width))/infoWidth;
						reminingTime = duration/3*1000*tempDuration;
						$(CurrentCarouseInfo).animate({width:0}, duration/3*1000*tempDuration, function(){$(CurrentCarouseInfo).hide(); performance = "moveItem";});
					}
				}
			}
		}
		
		/* set up timer to run */	
		var setUpTimer = function(){
			timer = setTimeout(function() { currentIndex++; moveItem("next");}, reminingTime);
		}
		
		/* stop timer to run */	
		var stopTimer = function(){
			if (timer == null) return;
			clearTimeout(timer);
			timer = null;
		}
		
		/*load Carousel*/		
		var loadCarousel = function(){
			itemLenth = $('.carousel').children().length;  // get no of items
			var totalwidth = 0;
			currentIndex = 0;
		   
			// to get a total of width the items get
			$('.carousel > li > a > img, .carousel > li > img').each(function(index, thisImg){
				totalwidth += parseFloat($(thisImg).width()) + 15;
			});
			
			// add width in th ul tag bacause of silde images
			$('.carousel').css('width',totalwidth);
			
			$('.carousel li').each(function(index, thisLI){
				$(this).addClass('carouselIndex_'+index);
			});
			
			
		
			// add button
		//	$('.carousel-button').append('<a href="#" class="carousel-prev"><img src="http://datasearch.uts.edu.au/site_manager_sites/utsweb2/images/carousel/button-left.png" alt="left" /></a> ');
			for(var i=0; i < itemLenth ; i++){
				$('.carousel-button').append('<a href="#" class="carouselIndex_'+i+'" >&bull;</a> ');
				$('.carousel-button .carouselIndex_' + i).click(function(){
					performance = "moveItem";
					currentIndex = parseInt($(this).attr('class').split('_')[1]);
					moveItem("index");
					return false;
				});
			}
		//	$('.carousel-button').append('<a href="#" class="carousel-next"><img src="http://datasearch.uts.edu.au/site_manager_sites/utsweb2/images/carousel/button-right.png" alt="right"></a>');
			
			$('.carousel-prev').click(function(){
				performance = "moveItem";
				currentIndex--;
				moveItem("prev");
				return false;
			});
		
			// if click the next button
			$('.carousel-next').click(function(){
				performance = "moveItem";
				currentIndex++;
				moveItem("next");
				return false;
			});

			// add function if mouse over and leave an image 
			$(".carousel").bind("mouseenter",function(){
				$(".carousel-info").stop();
				$(".carousel").stop();
				stopTimer();
				$('.carousel li:nth-child(1) .carousel-info').show();
				tempWidth = parseFloat($('.carousel li:nth-child(1) .carousel-info').css('width'));
			}).bind("mouseleave",function(){
				if(performance !="moveItem"){
					showInfo(tempWidth);
					setUpTimer();
				}else{
					moveItem(acting);
				}
			});
			resizeCarousel();	
			moveItem("initial");
		}
		
		// if the size of the carousel is depend on window size
		var resizeCarousel = function (){
			var maxWidth = $('#main-column').width()-20;
		  	$('.carousel-wrap').css('width',maxWidth);
		}
		
		$(window).resize(function() {
			resizeCarousel();
		});
		
		loadCarousel();
	});
});