// coded by Oren Tanay

var $theItemImg, $theItemPos, $theItemTtl, $theItemURL, $theItemModel, $theItemMSRP, $theItemPrice
var oldTab = 1;
var activeTab = 1;

var infoWrapperBlock =  '<div id="infoWrapper">';
		infoWrapperBlock += '	<a href="#" class="productItemLink"><img id="infoWrapperImg" width="180" height="150" src="" border="0" /></a>';
		infoWrapperBlock += '	<h2></h2>';
		infoWrapperBlock += '	<a href="#" class="productItemLearnMore"><img id="infoWrapperBtn" src="/img/imgHome/infowrapper/LearnMoreBtn.jpg" border="0" /></a>';
		infoWrapperBlock += '	<h4></h4>';
		infoWrapperBlock += '</div>';
		infoWrapperBlock += '<img id="infoWrapperShadow" src="/img/imgHome/infowrapper/shadow.png" border="0"/>';
		infoWrapperBlock += '<div id="infoWrapperMenuItemMask"><!-- --></div>';

$(function(){
	// insert overlay code
	$('body').append(infoWrapperBlock);
	// start with category1 having an onstate.
	$('#infoWrapperMenuItem'+activeTab).addClass('infoWrapperMenuItemOn');
	positionNavOnStatMask( $('#infoWrapperMenuItem'+activeTab) );
	initShadow();

	$('#infoWrapperMenu .infoWrapperMenuItem').hover(
		function(){
		// over
			var hoverTab = parseInt($(this).attr("name"));
			if ( hoverTab != activeTab ) {
				$(this).addClass('infoWrapperMenuItemOver');
			}
		},function(){
		// exit
			var hoverTab = parseInt($(this).attr("name"));
			if ( hoverTab != activeTab ) {
				$(this).removeClass('infoWrapperMenuItemOver');
			}
		}
	);
	
	
	$('#infoWrapperMenu .infoWrapperMenuItem').click(
		function() {
			// get the text of the clicked tab, and reduce it to a text number
			var ClickedTab = parseInt($(this).attr("name"));
			// if the tab clicked is not already the selected tab
			if ( ClickedTab != activeTab ) {
				oldTab = activeTab;
				activeTab = ClickedTab;
				//update nav states
				$('#infoWrapperMenu .infoWrapperMenuItem').removeClass('infoWrapperMenuItemOn');
				$(this).removeClass('infoWrapperMenuItemOver').addClass('infoWrapperMenuItemOn');
				// swap z indexes of oldTab and activeTab
				$('#infoWrapperContainer #cat' + oldTab).css('z-index','1').hide();
				$('#infoWrapperContainer #cat' + activeTab).css('z-index','2').fadeIn('200');
				//move mask to position and show
				positionNavOnStatMask( $(this) );
			}
		}
	);
	
	// bind hover-over to .productItem(s)
	$('#masterCategoryWrapper .productItem').hover(
		function(){
			
			// Set position
			$theItemPos = $(this).offset();
			$('#infoWrapper').css({position:'absolute',top:$theItemPos.top -8,left:$theItemPos.left - 25});
			
			// Set Title
			$theItemTtl = $(this).find('h2:eq(0)').html();
			$('#infoWrapper h2').html($theItemTtl);
			
			// Set Price
			$theItemPrice = $(this).find('.PIEIWprice').html();
			$('#infoWrapper h4').html($theItemPrice);
			
			// Set URL
			$theItemURL = $(this).find('a.productItemLink').attr('href');
				//for image
			$('#infoWrapper a.productItemLink').attr('href',$theItemURL);
			  //for button
			$('#infoWrapper a.productItemLearnMore').attr('href',$theItemURL);
			
			// Set Image
			$theItemImg = $(this).find('img.productItemPic').attr('src');
			$('#infoWrapperImg').attr('src',$theItemImg);
			
			// Set shadow dimensions and position
			$('#infoWrapperShadow').css({top:$theItemPos.top -13,left:$theItemPos.left - 30});
			$('#infoWrapperShadow').attr({width:204+10,height:$('#infoWrapper').height()+36});
			
			
			// all the prep is done, now show the infoWrapper.
			infoWrapperShow();
		},
		function(){});
	// bind hover-out only to div #infoWrapper
	$('#infoWrapper').hover(function(){},infoWrapperHide);
	
	
	//deal with a page resize
	$(window).resize(function(){
  	positionNavOnStatMask( $('#infoWrapperMenuItem'+activeTab) );
		infoWrapperHide();
	});

	
	
});


function initShadow() {
	
}


function positionNavOnStatMask(theOnItem) {
	var onTabPos = $(theOnItem).offset();
//	alert( $.browser.mozilla + ' ' + $.browser.version );
	if ( $.browser.msie && parseInt($.browser.version)==6 ) {
		// just for ie6
		$('#infoWrapperMenuItemMask').css({position:'absolute',top:onTabPos.top +31,left:onTabPos.left+1}).show();
	} else {
		if ( $.browser.mozilla && $.browser.version.indexOf("1.8") ) {
			// firefox version 3
			$('#infoWrapperMenuItemMask').css({position:'absolute',top:onTabPos.top +30,left:onTabPos.left+2}).show();
		} else {
			$('#infoWrapperMenuItemMask').css({position:'absolute',top:onTabPos.top +30,left:onTabPos.left+1}).show();
		}
	}
}


//Just hides the div #infoWrapper
function infoWrapperHide() {
	$('#infoWrapper').hide();
	$('#infoWrapperShadow').hide();
}


function infoWrapperShow() {
	$('#infoWrapper').show();
	
	if ( $.browser.msie && parseInt($.browser.version)==6 ) {
		// just for ie6, dont show shadow
	} else {
		$('#infoWrapperShadow').show();
	}
}