// ## specs.js
// 	Contains the dynamic functionality and positioning for the display of the vehicle specifications chart.

// FUNCTION LIST:
// 	loadLayer();
// 	displayItAll();
// 	displayAllSpecs();
//	buildColSpacer();
// 	buildSplitSpacer();
// 	initSpecs();

// TEMPLATE(S) USED:
// 	specs.html

	var isSpecsLoaded = false;
	var oldLayer;
	var isDisplayAll;
	
	strURL = document.location.href;
	
	intIndex = strURL.indexOf("?displayAll");
	
	if (intIndex > 0){
		isDisplayAll = true;
	} else {
		isDisplayAll = false;
	}
	
	var yCoord = 0;
	var xCoord = 280;

	// name list of all the layers in the page, used in the displayAllSpecs()
	var aryLayers = new Array('engine','cvt','suspend','eps','brake');

	function loadLayer(val){
		if (!isSpecsLoaded) return;
		
		if (isDisplayAll){
			location.hash = val + "Anchor";
		} else {
			yCoord = oLocator.y;
			if (typeof(oldLayer)!='undefined') oldLayer.hide();
			legend.hide();
			footer.hide();
			
			objLayer = eval(val)
			objLayer.show();
			
			objLayer.moveTo(xCoord,yCoord);
			
			yCoord += objLayer.h;
			
			legend.moveTo(xCoord, yCoord);
			legend.show();

			yCoord = yCoord + 16 + legend.h;
			
			footer.moveTo(0, yCoord);
			footer.show();
			
			oldLayer = objLayer;
		}
	}
	
	// Initialization function to load the page
	// call made from the HTML page to display all of the specs
	function displayItAll(){
		if (!isSpecsLoaded) return;	// check if all of the components for this page is loaded

		if (!isDisplayAll) document.location.href = document.location.href + '?displayAll#topOfPage';
	}

	// displays all of the layers in a stack layout
	function displayAllSpecs(){
		if (!isSpecsLoaded) return;	// check if all of the components for this page is loaded

		if (isDisplayAll) {
			
			thisY = oLocator.y;
			if (typeof(oldLayer)!='undefined') oldLayer.hide();
			legend.hide();
			footer.hide();
			
			for (i=0;i<aryLayers.length;i++){
				currentLayer = eval(aryLayers[i]);
				currentLayer.moveTo(xCoord, thisY);
				currentLayer.show();
				
				thisY += currentLayer.h;
			}
			
			thisY = thisY + 40;
			footer.moveTo(0,thisY);
			footer.show();
		}		
	}

	function buildColSpacer() {
		var htmlAnchor;
		
		htmlAnchor = '<table width="440" border="0" cellpadding="0" cellspacing="0">';
		htmlAnchor += '<tr><td height="10" bgcolor="#999999"><spacer type="block" width="1" height="1"></td></tr>';
		htmlAnchor += '<tr>';
		htmlAnchor += '<td width="1" bgcolor="#999999" nowrap="nowrap"><spacer type="block" width="1" height="1"></td>';
		htmlAnchor += '<td width="6" nowrap="nowrap"></td>';
		htmlAnchor += '<td width="433" class="BaseText" nowrap="nowrap"><a href="#topOfPage">Back to Top</a></td>';
		htmlAnchor += '</tr>';
		htmlAnchor += '<tr><td height="30" bgcolor="#999999"><spacer type="block" width="1" height="1"></td></tr>';
		htmlAnchor += '</table>';

		return htmlAnchor;
	}
		
	function buildSplitSpacer() {
		var htmlAnchor;
		
		htmlAnchor = '<table width="440" border="0" cellpadding="0" cellspacing="0">';
		htmlAnchor += '<tr><td height="10" bgcolor="#999999"><spacer type="block" width="1" height="1"></td></tr>';
		htmlAnchor += '<tr>';
		htmlAnchor += '<td width="1" bgcolor="#999999" nowrap="nowrap"><spacer type="block" width="1" height="1"></td>';
		htmlAnchor += '<td width="6" nowrap="nowrap"></td>';
		htmlAnchor += '<td width="433" class="BaseText" nowrap><a href="#topOfPage">Back to Top</a></td>';
		htmlAnchor += '</tr>';
		htmlAnchor += '<tr><td height="30" bgcolor="#999999"><spacer type="block" width="1" height="1"></td></tr>';
		htmlAnchor += '</table>';
		
		return htmlAnchor;
	}
	
	function initSpecs(){
		//loaded in the global nav
		//DynLayerInit();			// load the DynLayer components
		isSpecsLoaded = true;	// boolean to indicate that all of the necessary components are loaded
		isDisplayAll ? displayAllSpecs():loadLayer(aryLayers[0]);
	}