/**
 * EXPLICITLY DECLARED PAGE SCOPED VARIABLES
 */
// Element ID of selected tab on product page
var selectedTabIndex = 1;
// Element ID of selected tab on product page
var maxTabContentHeight = 0;

/* --------------------------------------------------------------------- */

/**
 * Displays the div element that holds the selected tab content
 *
 * @param	index	(Number) - index of tab html element id
 */
function overCategory(elmt) {
	elmt.className = "category selected";
}
function offCategory(elmt) {
	elmt.className = "category";
}

function overProduct(elmt) {
	elmt.style.backgroundImage = "url('/media/img/arrows/arrow_category_on.gif')";
	elmt.className = "product selected";
}
function offProduct(elmt) {
	elmt.style.backgroundImage = "url('/media/img/arrows/arrow_category_off.gif')";
	elmt.className = "product";
}

/**
 * Displays the div element that holds the selected tab content
 *
 * @param	index	(Number) - index of tab html element id
 */
function selectTab(index) {
	// Increase height of container if needed
	//setTabContentHeight(index);

	// Hide all tabs and content elements
	$(".tabcontenton").attr("class", "tabcontentoff");
	$(".tabon").attr("class", "taboff");

	// Display tab and content
	$("#tab" + index).attr("class", "tabon");
	$("#tabContent" + index).attr("class", "tabcontenton");
	
	// Update current tab page variable
	selectedTabIndex = index;
}

/**
 * Sets the maximum height needed for the tabcontent div which houses the
 * content divs for the tabs.  Height only increased if the passed
 * element is larger in height.
 */
function setTabContentHeight(index) {
	var newTabContentHeight = Element.getHeight('tabContent' + index);
	var oldTabContentHeight = Element.getHeight('tabContent' + selectedTabIndex);
	//alert(oldTabContentHeight + "\n" + newTabContentHeight);	
	var tallerTab = Math.max(newTabContentHeight, oldTabContentHeight);
	if (tallerTab > maxTabContentHeight) {
		maxTabContentHeight = tallerTab;
		getElement('tabcontent').style.height = maxTabContentHeight + "px";
	}
}

/**
 * Handles clicking of SKU link on a product page.
 *
 * @see		Prototype -> Position
 * @see		Prototype -> Ajax
 */
function goto(url, useNewWindow) {
	document.location.href=url;
}

/**
 * Opens modal window and displays content located at
 * href of link that was clicked.
 *
 * @param		description product name or keywords
 */
function displayVideo() {
	$("#searchModal").jqmHide();
	$("#searchModal").jqm({
		ajax:$(this)[0].href
	});
	$("#searchModal").ajaxComplete(function(request, settings) {
		$("#modalCloseButton").focus();
		$("#searchModal").jqmAddClose($("#modalCloseButton"));
	});
	$("#searchModal").jqmShow();
	
	return false;
}

/**
 * Page load handler
 */
$(document).ready(function() {
	//$("#body").after('<div id="searchModal" class="jqmWindow"></div>');
	//$(".SWF a").click(displayVideo);
	
	// Initialize modal window
	$("#searchModal").jqm({
		modal:false,
		overlay:30,
		toTop:false
	});
	$("#searchModal").jqmAddClose('.hideModal');
});