// JavaScript Document
var currentIndex=0;
var previousIndex=0;
var currentWarrIndex=0;
var previousWarrIndex=0;
var divOffset= new Object();
divOffset.left=0;
divOffset.top=0;
var arr=null;
var animating = false;
var buttonDivWidth = 33;
var animateSpeed = 500;
var warrArr=null;
var animatingWarr = false;
var controlArr=null;
var contentArray = new Array('div#features_benefits','div#technology','div#warranty');
// changeDisplay is called to switch which div in tire_display_content
// is being shown
function changeDisplay(which) {
	switch (which) {
		case "featuresLink":
			which="features_benefits";
			break;
		case "techLink":
			which="technology";
			break;
		case "warrantyLink":
			which="warranty";
			break;
		default:
			which="features_benefits";
	}
	for(i=0;i<contentArray.length;i++) {
		$j(contentArray[i]).css("top",-1000);
		//if(($j(contentArray[i]).attr('id') != which) && $j(contentArray[i]).is(':visible')) {
			//$j(contentArray[i]).hide();
		//}
	}
	if(which=="features_benefits") {
		$j("#"+which).css("top",0);
	} else {
		$j("#"+which).css("top",30);
	}
	//$j("#"+which).show();
}
function highlight(which) {
	which.css({'background':'url("/img/catalog/bg_trans_gray_blu.png") top left repeat'});
	which.siblings().css({'background':'none'});
}
$j(document).ready(function () {
	$j(".politeLoad").hide();
	$j("#features_benefits").css("top",0);
	//create an array of links in the tire_display_control_bar div
	controlArr = jQuery.makeArray($j("div#tire_display_control_bar_left p a"));
	//give each member of controlArr the ability to call changeDisplay
	jQuery.each(controlArr, function() {
									$j(this).click(function () {
										changeDisplay($j(this).attr('id'));
										highlight($j(this));
										return false;
									});
									$j(this).hover(
										function () {
											$j(this).css('color','#ffffff');
										},
										function () {
											$j(this).css('color','#333333');
										}
									);
	});
	arr = jQuery.makeArray($j("div#technology div#scrollDisplay .scrollContent"));
	jQuery.each(arr, function(i,val) {
		$j(this).css("top",divOffset.top + "px");
		$j(this).css("left",(divOffset.left+(i*($j(this).width()+buttonDivWidth)))+"px");
		$j(this).show();
		i++;
	});
	warrArr = jQuery.makeArray($j("div#warranty div#scrollDisplayWarr .scrollContent"));
	jQuery.each(warrArr, function(i,val) {
		$j(this).css("top",divOffset.top + "px");
		$j(this).css("left",(divOffset.left+(i*($j(this).width()+buttonDivWidth)))+"px");
		$j(this).show();
		i++;
	});

	$j('div#technology #leftScroll').click(function() {
		if (!animating && (arr.length>1)) {
			animating=true;
			previousIndex=currentIndex;
			if(currentIndex==0) {				
				currentIndex=arr.length-1;
			} else {
				currentIndex--;
			}
			jQuery.each(arr, function(i,val) {
				if (i==currentIndex) {
					$j(this).css("left", (divOffset.left-($j(this).width()+buttonDivWidth))+"px");
					$j(this).animate({left: divOffset.left},animateSpeed);
				}
				if (i==previousIndex) {
					$j(this).animate({left: (divOffset.left+($j(this).width()+buttonDivWidth))},animateSpeed,function() {
						animating=false;
					});
				}
			});
		}
	});
	$j('div#technology #rightScroll').click(function() {
		if (!animating && (arr.length>1)) {
			animating=true;
			previousIndex=currentIndex;
			if(currentIndex==arr.length-1) {				
				currentIndex=0;
			} else {
				currentIndex++;
			}
			jQuery.each(arr, function(i,val) {
				if (i==currentIndex) {
					$j(this).css("left", (divOffset.left+($j(this).width()+buttonDivWidth))+"px");
					$j(this).animate({left: divOffset.left},animateSpeed);
				}
				if (i==previousIndex) {
					$j(this).animate({left: (divOffset.left-($j(this).width()+buttonDivWidth))},animateSpeed,function() {
						animating=false;
					});
				}
			});
		}
	});
	$j('div#warranty #leftScrollWarr').click(function() {
		if (!animatingWarr && (warrArr.length>1)) {
			animatingWarr=true;
			previousWarrIndex=currentWarrIndex;
			if(currentWarrIndex==0) {				
				currentWarrIndex=warrArr.length-1;
			} else {
				currentWarrIndex--;
			}
			jQuery.each(warrArr, function(i,val) {
				if (i==currentWarrIndex) {
					$j(this).css("left", (divOffset.left-($j(this).width()+buttonDivWidth))+"px");
					$j(this).animate({left: divOffset.left},animateSpeed);
				}
				if (i==previousWarrIndex) {
					$j(this).animate({left: (divOffset.left+($j(this).width()+buttonDivWidth))},animateSpeed,function() {
						animatingWarr=false;
					});
				}
			});
		}
	});
	$j('div#warranty #rightScrollWarr').click(function() {
		if (!animatingWarr && (warrArr.length>1)) {
			animatingWarr=true;
			previousWarrIndex=currentWarrIndex;
			if(currentWarrIndex==warrArr.length-1) {				
				currentWarrIndex=0;
			} else {
				currentWarrIndex++;
			}
			jQuery.each(warrArr, function(i,val) {
				if (i==currentWarrIndex) {
					$j(this).css("left", (divOffset.left+($j(this).width()+buttonDivWidth))+"px");
					$j(this).animate({left: divOffset.left},animateSpeed);
				}
				if (i==previousWarrIndex) {
					$j(this).animate({left: (divOffset.left-($j(this).width()+buttonDivWidth))},animateSpeed,function() {
						animatingWarr=false;
					});
				}
			});
		}
	});
});

