var percent = 1;
var remainder = 99;
var active = true;
var hover = false;
var inTransition = false;
var count = 0;
var selected = 1;
var wasViewing;
var currentInfo;
var nextInfo;
var fadeOut;
var fadeIn;
var divisioncount;
var thisDivision = 1;
var speed = 200;

$(document).ready(function()
{
	$("#promobox .info").equalHeights();
	var percentWidth = Math.round(100/divisioncount);
	var pixelPercent = Math.floor((percentWidth/100)*$('#promobox .tabs ul').outerWidth());
	$("#promobox li").css('width',pixelPercent+'px');	
	var setWidth = $("#promobox li").width();
	//if(setWidth > pixelPercent) // For IE6, which was setting the width too wide
	//{	
		var diff = setWidth - pixelPercent
		$("#promobox li").width(($("#promobox li").width()-(diff+1)));
		
	//}
	
	setheight = $("#promobox .info").height();
	setheight = setheight + 35;
	$("#promobox .textarea").height(setheight+'px')
	
	hidePromos();
	showFirst();
	initTimer();
	$("#promobox li a").equalHeights();
	$("#promobox li a").css('overflow','hidden');

	//$('#promobox .tabs ul').width(tot+'px');
	$('#promobox .tabs ul').height($("#promobox li a").outerHeight());
	$('#promobox .tabs ul').css('overflow','hidden');
	
	$("#promobox li").hover(
      function () {
		active = false;
		hover = true;
		count = 0;
		
		id_array = $(this).attr('id').split('_');
		selected = id_array[1];
		
		nextInfo = $('#info_'+selected);
		
		crossFade(currentInfo,nextInfo);

      }, 
      function () {
        hover = false;		
      }
    );
	
	$("#promobox .textarea").hover(
      function () {
		hover = true;
		active = false;
      }, 
      function () {
        hover = false;
		active = true;
		crossFade(currentInfo,wasViewing);
      }
    );

	
});

function initTimer()
{
	
	$(document).everyTime(speed, 'progress', function(i) {
  		
		if(active == true)
		{
			if(percent <= 100)
			{
				$('.progress').css('width',percent+'%');
				
				if(thisDivision != divisioncount)
				{
					if(percent >= ((thisDivision)*Math.round(100/(divisioncount))) && percent != 100)
					{
						thisDivision++;
						nextInfo = $('#info_'+thisDivision);
						
						crossFade(currentInfo,nextInfo);
						
					}else{
						if(percent == 100)
						{
							thisDivision = 1;
							nextInfo = $('#info_1');
							crossFade(currentInfo,nextInfo);
						}
					}
				}else{
					if(percent == 100)
					{
						thisDivision = 1;
						nextInfo = $('#info_1');
						crossFade(currentInfo,nextInfo);
					}	
				}
				/*
				switch(percent)
				{
				case 25:
				  nextInfo = $('#info_2');
				  crossFade(currentInfo,nextInfo);
				  break;
				case 50:
				nextInfo = $('#info_3');
				  crossFade(currentInfo,$('#info_3'));
				  break;
				 case 75:
				 nextInfo = $('#info_4');
				  crossFade(currentInfo,$('#info_4'));
				  break;
				  case 100:
				  nextInfo = $('#info_1');
				  crossFade(currentInfo,$('#info_1'));
				  break;
				default:
				  break;
				}*/
				
				percent++;
				
			}else{
				// restart
				//$(document).stopTime('progress');
				percent=1;
			}
		
		}else{
			if(hover == false && inTransition == false)
			{
				count++;
			}
			if(count > 5)
			{
				count = 0;
				active = true;
				crossFade(currentInfo,wasViewing);
			}
		}
		
	});

}

function hidePromos()
{
	$("#promobox .info").hide();
	$("#promobox .info").css('visibility','visible');
}

function showFirst()
{
	$("#info_1").fadeIn('slow');
	currentInfo = $('#info_1');

}

function crossFade(current,chosen)
{	
	fadeOut = current;
	fadeIn = chosen;
	wasViewing = current;
	
	if(current.attr('id') != chosen.attr('id'))
	{
		if(jQuery.support.opacity == true)
		{
		
			fadeOut.stop();
			fadeIn.stop();
			
			fadeOut.fadeOut('slow', function(){
				fadeIn.fadeIn('slow', function(){
					if($(this).css('opacity') < 1)
					{
						$(this).fadeTo('fast',1);
					}
				});
			});	
		}else{
			fadeOut.hide();
			fadeIn.show()
		}
	   	currentInfo = chosen;		
		
	}
	
}