/*
	Panel page info...
	
	Panel order array contains list of panel_ids in the order they are to be displayed.
	All panels must be registerd in the rayPanelPages array to define the following properties:
		
		panel_id			id of this panel.
		bg_img				background image to be used for this panel.
		content				html content to be displayed over the background image.
		overlay_panel_id	id of panel to be used as overlay panel in the rayPanelPages array.
		list_index			index of the article in the article list, if it is to be hilighted.
		click_href			redirect location when clicked.
		
	Panels can designate an optional overlay-panel to be displayed with them, which must also exist
	in the rayPanelPages array.
	
*/

var intPanelWidth = 476;
var intPanelHeight = 300;
var strSlideDimension = 'y';

var rayPanelOrder = new Array(
		'svp',
		//'graduate',
		'stewardship'/*,
		'p4a'*/
		);

var rayPanelPages = {
		'svp' : {
			'panel_id': 'svp',
			'bg_img': 'images/prod_svp_feat.jpg',
			'content': '',
			'list_index': 0,
			'click_href': 'visitorpackets.php'
			},
		'stewardship': {
			'panel_id': 'stewardship',
			'bg_img': 'images/prod_stewardship_feat.jpg',
			'content': '',
			'list_index': 1,
			'click_href': 'stewardship.php'
			},
		'graduate' : {
			'panel_id': 'graduate',
			'bg_img': 'images/prod_graduate_feat.jpg',
			'content': '',
			'list_index': 2,
			'click_href': 'graduate/'
			},
		'p4a' : {
			'panel_id': 'p4a',
			'bg_img': 'images/prod_p4a_feat.jpg',
			'content': '',
			'list_index': 3,
			'click_href': 'p4a/'
			}
		};

/*
	Two panels, '1' and '2'.
	When page is changed the old panel slides out and the new slides in.
	
	When sliding in from the right, left position should be (intPanelWidth * 2) + 1.
	When sliding in from the left, left position should be (intPanelWidth * -1) - 1.
*/
var intPanelPageImagesToLoad = 0;
var intCurrentPageIdx = -1;
var intCurrentPanel = 1;
var intPanelsToMove = 0;
var booFirstPageLoaded = false;
var booShowProgressBar = false;
var intAnimationDelay = 1000;
var safariTransitionEffect = 'fade';

function beginLoadPanel()
{	
	loadNextPanelPage();
}

function loadNextPanelPage()
{	
	intCurrentPageIdx++;
	intEndPageIdx = rayPanelOrder.length - 1;
	
	//	update progress span
	if (booShowProgressBar)
	if (objProgressBar = document.getElementById('divProgressBar'))
	{	progress = intCurrentPageIdx / (intEndPageIdx + 1);
		objProgressBar.style.width = Math.floor(progress * 100) + '%';	
	}
	
	//	load page or wrap to first.
	if (intCurrentPageIdx > intEndPageIdx)
	{	
		/*//	wrap back to first page.
		intCurrentPageIdx = 0;
		changePage('next');
		*/
		intCurrentPageIdx = 0;
		doLastPageLoaded();
	}
	else
	{	
		//	load next page...
		if (strThisPageId = rayPanelOrder[intCurrentPageIdx])
		if (rayThisPage = rayPanelPages[strThisPageId])
		if (strThisImgName = rayThisPage['bg_img'])
		{
			intPanelPageImagesToLoad = 1;
			rayThisPage['images_loaded'] = 0;
			rayThisImgName = loadImage(strThisImgName);
			waitForImageComplete(strThisImgName, "registerPanelImageComplete('"+strThisPageId+"')");
		}
	}
}

function doFirstPageLoaded()
{	
	booFirstPageLoaded = true;
	changePage('up');
}

function doLastPageLoaded()
{	
	resetFlipTimer();
}





function registerPanelImageComplete(strInPageId)
{	
	if (!rayPanelPages[strInPageId]['images_loaded'])
		rayPanelPages[strInPageId]['images_loaded'] = 0;
	rayPanelPages[strInPageId]['images_loaded']++;
	
	if (rayPanelPages[strInPageId]['images_loaded'] >= intPanelPageImagesToLoad)
	{	
		//	check if this is the first page loaded.
		if (!booFirstPageLoaded) doFirstPageLoaded();
		
		loadNextPanelPage();
	}
}



function changePage(strMoveDirection)
{	
			changePageManual(strMoveDirection);
	}

function changePageSafari(strMoveDirection)
{	/*
		Use safari transitions instead of less efficient manual methods.
	*/
	//	establish panel links
	objPanelOUT = document.getElementById('divPanelPanel_'+intCurrentPanel);
	objPanelIN = null;
	
	if (intCurrentPanel==1) {
		objPanelIN = document.getElementById('divPanelPanel_2');
		intCurrentPanel = 2;
	}
	else
	if (intCurrentPanel==2) {
		objPanelIN = document.getElementById('divPanelPanel_1');
		intCurrentPanel = 1;
	}
	
	
	
	//	establish new page index
	if (strMoveDirection=='prev') {
		intCurrentPageIdx -= 1;
	}
	else
	if (strMoveDirection=='next') {
		intCurrentPageIdx += 1;
	}
	
	//	wrap around to first item if after last.
	intEndPageIdx = rayPanelOrder.length - 1;
	if (intCurrentPageIdx > intEndPageIdx) intCurrentPageIdx = 0;
	
	
	//	configure outgoing div.
	objPanelOUT.style['zIndex'] = 0;
	objPanelOUT.style['top'] = 0;
	objPanelOUT.style['left'] = 0;
	objPanelOUT.style['opacity'] = 1;
	objPanelOUT.style['-webkit-transition-property'] = 'opacity';
	objPanelOUT.style['-webkit-transition-duration'] = '2s';
	
	//	configure incoming div.
	strCurrentPageId = rayPanelOrder[intCurrentPageIdx];
	objPanelIN.style['opacity'] = 0;
	objPanelIN.style['z-index'] = 1;
	objPanelIN.style['top'] = 0;
	objPanelIN.style['left'] = 0;
	objPanelIN.style['-webkit-transition-property'] = 'opacity';
	objPanelIN.style['-webkit-transition-duration'] = '2s';
	objPanelIN.innerHTML = renderPage(strCurrentPageId);
	if (rayCurrentPage = rayPanelPages[strCurrentPageId])
	if (strClickHref = rayCurrentPage['click_href'])
		objPanelIN.setAttribute('onclick', "document.location='"+strClickHref+"'");
	
	//	Initiate transition.
	objPanelIN.style['opacity'] = 1;
	objPanelOUT.style['opacity'] = 0;
}

function changePageManual(strMoveDirection)
{	/*
		Direction:		Effect:
		
		left/prev/down	Move IN panel to right side and slide to the left into frame.
						Slide OUT panel to the left out of frame.
		
		right/next/up	Move IN panel to left side and slide to the right into frame.
						Slide OUT panel to the right out of frame.
	*/
	/* debug  debug("changePage:"+strMoveDirection);*/
	
	//	establish panel links
	objPanelOUT = document.getElementById('divPanelPanel_'+intCurrentPanel);
	objPanelIN = null;
	
	if (intCurrentPanel==1)
	{	objPanelIN = document.getElementById('divPanelPanel_2');
		intCurrentPanel = 2;
	}
	else
	if (intCurrentPanel==2)
	{	objPanelIN = document.getElementById('divPanelPanel_1');
		intCurrentPanel = 1;
	}
	
	
	
	//	establish slide directions
	intINmoveFrom = 0;
	intOUTmoveTo = 0;
	
	if (strMoveDirection=='prev' || strMoveDirection=='left' || strMoveDirection=='down')
	{	
		if (strMoveDirection=='prev') intCurrentPageIdx -= 1;
		if (strSlideDimension == 'x') {
			intINmoveFrom = (intPanelWidth * -1) - 1;// -801;
			intOUTmoveTo = intPanelWidth + 1;// 801;
		}
		else {
			intINmoveFrom = (intPanelHeight * -1) - 1;
			intOUTmoveTo = intPanelHeight + 1;
		}
	}
	else
	if (strMoveDirection=='next' || strMoveDirection=='right' || strMoveDirection=='up')
	{
		if (strMoveDirection=='next') intCurrentPageIdx += 1;
		if (strSlideDimension == 'x') {
			intINmoveFrom = intPanelWidth + 1;// 801;
			intOUTmoveTo = (intPanelWidth * -1) - 1;// -801;
		}
		else {
			intINmoveFrom = intPanelHeight + 1;
			intOUTmoveTo = (intPanelHeight * -1) - 1;
		}
		
		/* debug  debug("moving to next panel... intCurrentPageIdx:"+intCurrentPageIdx+
			" strSlideDimension:"+strSlideDimension+" intINmoveFrom:"+intINmoveFrom+
			" intOutMoveTo:"+intOUTmoveTo );*/
	}
	
	
	
	//	wrap around to first item if after last.
	intEndPageIdx = rayPanelOrder.length - 1;
	if (intCurrentPageIdx > intEndPageIdx) intCurrentPageIdx = 0;
	
	
	//	move IN panel to starting location and populate.
	if (strSlideDimension == 'x') {
		objPanelIN.style.left = intINmoveFrom+'px';
		objPanelIN.style.top = '0px';
	} else {
		objPanelIN.style.left = '0px';
		objPanelIN.style.top = intINmoveFrom+'px';
	}
	strCurrentPageId = rayPanelOrder[intCurrentPageIdx];
	objPanelIN.innerHTML = renderPage(strCurrentPageId);
	if (rayCurrentPage = rayPanelPages[strCurrentPageId])
	if (strClickHref = rayCurrentPage['click_href'])
		objPanelIN.setAttribute('onclick', "document.location='"+strClickHref+"'");
	
	
	
	//	Initiate panel slide.
	intPanelsToMove = 2;
	property = (strSlideDimension == 'x') ? 'left' : 'top';
	/*
		Some browsers have a rendering lag when the panel background is changed, so we need to wait
		a second before beginning the animation.
	*/
	animatePanelChange(objPanelIN.id, objPanelOUT.id, property, intINmoveFrom, intOUTmoveTo);
	/*moveLayer(objPanelIN.id, property, intINmoveFrom, 0, 11, "registerPanelMoveComplete()");
	moveLayer(objPanelOUT.id, property, 0, intOUTmoveTo, 11, "registerPanelMoveComplete()");*/
}

var animationTimer1 = null;
var animationTimer2 = null;
var animationTimer3 = null;

function animatePanelChange(strPanelInId, strPanelOutId, strProperty, intInMoveFrom, intOutMoveTo)
{	
	window.clearTimeout(animationTimer1);
	animationTimer1 = window.setTimeout(
		"moveLayer('"+strPanelInId+"','"+strProperty+"',"+intInMoveFrom+",0,11,'registerPanelMoveComplete()');"+
		"moveLayer('"+strPanelOutId+"','"+strProperty+"',0,"+intOutMoveTo+",11,'registerPanelMoveComplete()');",
		intAnimationDelay);
}

function changeListHilight(intInHilightRowIdx)
{	
	if (objFeatureList = document.getElementById('feature_list'))
	if (objFeatureList.hasChildNodes())
	if (rayChildNodes = objFeatureList.childNodes)
	for (n = 0; n < rayChildNodes.length; n++)
	if (thisChildNode = rayChildNodes[n])
	if ((intInHilightRowIdx >= 0) && (n==intInHilightRowIdx)) {
		thisChildNode.className = 'hilighted';
	} else {
		thisChildNode.className = null;
	}
}


function renderPage(strInPageId)
{	
	//	attempt to get current page overlay id.
	current_overlay_panel_id = false;
	if (typeof(rayInPage)!='undefined')
	if (typeof(rayInPage['overlay_panel_id'])!='undefined')
		current_overlay_panel_id = rayInPage['overlay_panel_id'];
	
	if (rayInPage = rayPanelPages[strInPageId])
	{
		//	show / hide panel overlay.
		booOverlayVisible = false;
		if (strOverlayPanelID = rayInPage['overlay_panel_id'])
		if (!current_overlay_panel_id || (current_overlay_panel_id != strOverlayPanelID))
		if (objOverlayPanel = document.getElementById('divOverlayPanel')) {
			if (rayOverlayPanel = rayPanelPages[strOverlayPanelID]) {
				strPanelStyle = "position:absolute; bottom:0; right:0; width:32px; height:32px; z-index:1; display:block; opacity:0; "+
					"background:url("+rayOverlayPanel['bg_img']+") top right no-repeat;";
				objOverlayPanel.setAttribute('style',strPanelStyle);
				if (strClickHref = rayOverlayPanel['click_href']) {
					objOverlayPanel.setAttribute('onclick', "document.location='"+strClickHref+"'");
				}
				window.clearTimeout(animationTimer2);
				animationTimer2 = window.setTimeout("showOverlayPanel();",intAnimationDelay);
				booOverlayVisible = true;
			}
			if (!booOverlayVisible && (objOverlayPanel.style.opacity > 0))
				tempTimeout2 = window.setTimeout("hideOverlayPanel();",intAnimationDelay);
		}
		
		//	hilight list item if specified.
		window.clearTimeout(animationTimer3);
		animationTimer3 = window.setTimeout("changeListHilight('"+rayInPage['list_index']+"')",
			intAnimationDelay);
		
		//	return panel content.
		strPageContent = "<div style='width:"+intPanelWidth+"px;height:"+intPanelHeight+
			"px;background:url("+rayInPage['bg_img']+") top left no-repeat;border:none;'>"+
			rayInPage['content']+"<"+"/div>";
		
		return strPageContent;
	}
}



function registerPanelMoveComplete()
{	
	intPanelsToMove--;
	if (!intPanelsToMove)
	{	
		/*
			Panel movements complete.
		*/
	}
}
















/*
	
	Automatic page turning...
	
*/
var intNormalFlipDelay = 5000;//8000;
var flipTimer = null;

function flipPage()
{	
	changePage('next');
	resetFlipTimer();
}

function resetFlipTimer()
{	
	cancelFlipTimer();
	flipTimer = window.setTimeout('flipPage()',intNormalFlipDelay);
}

function cancelFlipTimer()
{	
	window.clearTimeout(flipTimer);
}
















/*
	Tweened layer sliding...
*/
var intMoveWait = 40;
var rayMoveTimer = new Array();
var rayMoveTween = new Array();
var rayMoveIndex = new Array();
var rayMoveLocation = new Array();

function moveLayer(strLayerName, strDimension, intMoveFrom, intMoveTo, 
	intMoveFrames, strFinishCode)
{	clearTimeout(rayMoveTimer[strLayerName]);
	
	//	get tween
	rayThisTween = rayMoveTween[strLayerName];
	if (!rayThisTween) rayThisTween = tweenVelocity(intMoveFrom,intMoveTo, intMoveFrames);
	
	//	get move index
	intThisIndex = rayMoveIndex[strLayerName];
	if (!intThisIndex) intThisIndex = 0;
	
	//	get current location
	intThisLocation = rayMoveLocation[strLayerName];
	if (!intThisLocation) intThisLocation = intMoveFrom;
	
	//	calculate new location
	intMoveAmount = rayThisTween[intThisIndex];
	intNewLocation = intThisLocation + intMoveAmount;
	
	
	
	//	update layer position.
	objThisLayer = document.getElementById(strLayerName);
	if (strDimension=='left')
	{	objThisLayer.style.left = intNewLocation+'px'; }
	else
	if (strDimension=='right')
	{	objThisLayer.style.right = intNewLocation+'px'; }
	else
	if (strDimension=='top')
	{	objThisLayer.style.top = intNewLocation+'px'; }
	else
	if (strDimension=='bottom')
	{	objThisLayer.style.bottom = intNewLocation+'px'; }
	
	
	
	//	check if movement is complete.
	booContinueMoving = true;
	if ((intThisIndex >= rayThisTween.length-1))
	{	
		//	Target reached.
		booContinueMoving = false;
	}
	
	
	
	//	reset timer and update properties.
	if (booContinueMoving)
	{	
		rayMoveTimer[strLayerName] = setTimeout("moveLayer('"+strLayerName+"', '"+
			strDimension+"', new Number("+intMoveFrom+"), new Number("+intMoveTo+"), new Number("+
			intMoveFrames+"), '"+strFinishCode+"')", intMoveWait);
		
		rayMoveTween[strLayerName] = rayThisTween;
		rayMoveIndex[strLayerName] = intThisIndex+1;
		rayMoveLocation[strLayerName] = intNewLocation;
	}
	else
	{	
		//	clear values and execute finish code.
		rayMoveTimer[strLayerName] = null;
		rayMoveTween[strLayerName] = null;
		rayMoveIndex[strLayerName] = null;
		rayMoveLocation[strLayerName] = null;
		
		if (strFinishCode) eval(strFinishCode);
	}
}



function tweenVelocity(intFrom, intTo, f)
{	
	d = intTo-intFrom;
	u = d/f;
	
	rayRampIn = new Array(
		Math.round(u/16),
		Math.round(u/16),
		Math.round(u/8),
		Math.round(u/4),
		Math.round(u/2)
		);
	rayRampOut = new Array(
		Math.round(u/2),
		Math.round(u/4),
		Math.round(u/8),
		Math.round(u/16),
		Math.round(u/16)
		);
	
	rayMiddle = new Array();
	for (i=0; i < f-2; i++)
	{	
		rayMiddle.push(
			Math.round(u)
			);
	}
	
	
	//	Concat output array.
	rayOut = rayRampIn.concat(rayMiddle, rayRampOut);
	
	//	Error correction.
	rayOutLen = getArraySum(rayOut);
	if (rayOutLen < d)
	{	rayOut.push(d - rayOutLen); }
	else
	if (rayOutLen > d)
	{	rayOut.push(d - rayOutLen); }
	
	return rayOut;
}

























/*
	Fade in/out functions...
*/
var objRPHideTimer = null;
var objRPShowTimer = null;
var intRPFadeAmount = 5;
var intRPFadeWait = 25;

function hideOverlayPanel(strInFinishCode)
{	
	if (objDivOverlayPanel = document.getElementById('divOverlayPanel'))
	{	
		if (!objDivOverlayPanel.current_opacity) objDivOverlayPanel.current_opacity=100;
		
		objDivOverlayPanel.current_opacity -= intRPFadeAmount;
		if (objDivOverlayPanel.current_opacity < 0)
		{	objDivOverlayPanel.current_opacity = 0; }
		setOpacity(objDivOverlayPanel, objDivOverlayPanel.current_opacity);
		
		if (objDivOverlayPanel.current_opacity > 0)
		{	
			//	Loop until zero opacity.
			clearTimeout(objRPHideTimer);
			objRPHideTimer = setTimeout("hideOverlayPanel(\""+strInFinishCode+"\")", intRPFadeWait);
		}
		else
		if (strInFinishCode)
		{		
			objRPHideTimer = setTimeout(strInFinishCode, intRPFadeWait);
		}
	}
}

function showOverlayPanel(strInFinishCode)
{	
	if (objDivOverlayPanel = document.getElementById('divOverlayPanel'))
	{	
		if (!objDivOverlayPanel.current_opacity) objDivOverlayPanel.current_opacity=0;
		
		objDivOverlayPanel.current_opacity += intRPFadeAmount;
		if (objDivOverlayPanel.current_opacity > 100)
		{	objDivOverlayPanel.current_opacity = 100; }
		setOpacity(objDivOverlayPanel, objDivOverlayPanel.current_opacity);
		
		if (objDivOverlayPanel.current_opacity < 100)
		{	
			//	Loop until full opacity.
			clearTimeout(objRPHideTimer);
			objRPShowTimer = setTimeout("showOverlayPanel(\""+strInFinishCode+"\")", intRPFadeWait);
		}
		else
		if (strInFinishCode)
		{		
			objRPShowTimer = setTimeout(strInFinishCode, intRPFadeWait);
			if (browser_ie)
			{	objDivOverlayPanel.style.zoom = '0'; }
		}
	}
}