// JavaScript Document
/************************************************************************/
/* Tire tools module currently resides in this js file for              */
/* ease of troubleshooting the rightModules.js file                     */
/************************************************************************/
var colorArray = new Array();
colorArray['tire1'] = new Array("213","73","0");
colorArray['tire2'] = new Array("254","217","0");
colorArray['tire3'] = new Array("140","190","79");
colorArray['tire4'] = new Array("220","41","30"); //should be red
colorArray['tire5'] = new Array("0","160","218");
colorArray['tire6'] = new Array("0","160","218");

var currentTire = null;
var DOCWIDTH = 984;
var DOCHEIGHT = 620;


// image preloader
//
jQuery.preloadImages = function()
{
  for(var i = 0; i<arguments.length; i++)
  {
    jQuery("<img>").attr("src", arguments[i]);
  }
}

// call the image preloader when the DOM is ready
//
$.preloadImages("/img/home/tire1_rollover_content.png","/img/home/tire2_rollover_content.png","/img/home/tire3_rollover_content.png","/img/home/tire4_rollover_content.png","/img/home/tire5_rollover_content.png","/img/home/tire6_rollover_content.png");

// Returns the flash movie object
function mp_getFlashMovie( movieName ) {

    if ( navigator.appName.indexOf("Microsoft") != -1 ) {
        return window[ movieName ];
    } else {
        return document[ movieName ];
    } // End if.
} // End mp_getFlashMovie().

// Calls the setTire function which changes the background tinting for the clouds
// Calls animateDisplayTire
// 
function changeDisplayTire(which) {
	var displayDiv = "rollover_display_" + which;
	animateDisplayTire(displayDiv);
	mp_getFlashMovie("content_flash_bg").setTire(colorArray[which],colorArray[which][0],colorArray[which][1],colorArray[which][2]);
}

// Activates the rollover divs and their animations
function animateDisplayTire(displayDiv) {
	displayDiv = "div#"+displayDiv;
	// ensure any displayed divs are moved offstage
	$(displayDiv).siblings("div.tireRolloverDiv").hide();
	// place active div on stage
	$(displayDiv).show();
	// begin animating
}

$(document).ready(function () {
	// sets the mouseover functions for the tireNav
    $('div.tireNavLink').mouseover(function () {
			var tireID=$(this).attr('id');
			// show the overlayed images for the current tire and
			// change the tire label to the appropriate color
			$(this).children("div.tireNavOverlay").show();
			$(this).children("a.tireNavTxtLink").children("span.tire_label").css('color','rgb('+colorArray[tireID][0]+','+colorArray[tireID][1]+','+colorArray[tireID][2]+')');
			// hide the tireNavOverlay for all other tires and
			// change the tire label of other tires to white
			$(this).siblings("div.tireNavLink").children("div.tireNavOverlay").hide();
			$(this).siblings("div.tireNavLink").children("a.tireNavTxtLink").children("span.tire_label").css('color','#ffffff');
			if(tireID!=currentTire) {
				currentTire=$(this).attr('id');
				changeDisplayTire($(this).attr('id'));
			}
	});
	

});
/******************************************************************************/
/* scrolling content window control											  */
/* uses the jquery.js file and the jquery-ui.js file which is a build of the  */
/* jquery ui.core.js file and ui.draggable.js file as built and minified at	  */
/* http://jqueryui.com/ using ver 1.7.2 for jQuery 1.3+ with no theme selected*/
/******************************************************************************/
$(document).ready(function () {
	// determine if the scroll function is needed
	if($('div.scrollingContainer')) {
		// sets the dragging function of the Tire Tools div scrollbar
		// first determines if the list is taller than the container
		// if not, it will hide the scroll bar container
		if($('div.scrollingContainer').height() < $('div.scrollingContent').height()) {
			$('div.scrollbar').draggable({axis:'y', containment:'parent', drag: function(event, ui) {
				// determines the percentage by which to scroll the content
				// in the links container by getting the position of the
				// draggable object (scrollbar) and dividing it by
				// it's draggable area (height of it's container minus it's
				// own height). the 2 is subtracted to compensate for the borders
				// of this draggable object.
				var dragPercent = ui.position.top/($('div.scrollbarContainer').height()-$('div.scrollbar').height() - 2);
				$('div.scrollingContent').css('top', Math.floor(dragPercent*($('div.scrollingContainer').height()/2-$('div.scrollingContent').height())));
				}  // end of function(event, ul)
			}); // end of draggable
		} else {
			
			$('div.scrollingContainer').hide();
		}
	} // end if div.scrollingContainer
});
/* end scrolling content window control */