/* ----------JARED BROAD.COM--------- */
/* 			www.jaredbroad.com	      */
/* 	  Written by J Broad, D Ollivier  */

//Initialise Globals
var butCount = 6;			//Total No Buttons on Page
var butCountVirtual = 7;
var buttons = new Array(butCount-1);
var butOriginalTop = new Array(butCount-1);
var butOriginalLeft = new Array(butCount-1);
var buttonBusy = new Array(butCount-1);
var buttonNames = new Array(butCount-1);
var currentButton = -1;
var enableAnimation = true;
var butLeftOffset = 0;				//Environmental Vars - Menu left offset
var butTopOffset = 30;
var butLeftVirtualDelta = 0;
var buttonWidth = 80;				//Button width
var buttonHeight = 376;				//Button height
var buttonSpacer = 5;
var buttonContentContainerLeftOffset = -100;	//
var buttonContentContainerTopOffset = 40;
var butHideOffset = -buttonHeight + 25;

//Update here and in CSS
var containerWidth = 900;			//Total container width
var containerHeight = 550;			//Total container height

var contentContainer;
var contentContainerExpandedWidth = (buttonContentContainerLeftOffset*-1) + (butCountVirtual*buttonWidth) +(butCountVirtual*buttonSpacer);
var contentContainerOrigTop = buttonContentContainerTopOffset + butTopOffset;	//Absolute Top/Left Positions of contentContainer
var contentContainerOrigLeft = 100;
var contentContainerOrigWidth = 0;
var contentContainerOrigHeight = buttonHeight-2;

var homeContainer;

var disorderMultipler = 1.0;


/**
 * Loading Function - set content to "Loading.."
 * Return Void
 **/
function loading() {
	returnObjById("content").innerHTML = "Loading...";
}

/**
 * Loading Function - set content to "Loading.."
 * Return Void
 **/
function SetToLoading(target){
	returnObjById(target).innerHTML = "Loading...";
}

/**
 * Change Portfolio Image - set third column to be image and header
 * Return Void
 **/
function changePortfolioImage(newImageURL, newTitle) {
	returnObjById("portfolioImageTitle").innerHTML = newTitle;
	returnObjById("portfolioImage").style.backgroundImage = 'url(' + newImageURL + ')';
}


/**
 * Initialise Global Variables
 * Return Void.
 **/
function initialise(){
	//Init Menu Frame Size
	returnObjById("menu").width = ((butCount*buttonWidth) + ((butCount)*buttonSpacer)) + "px";

	//Initialise all button objects
	var i = 0;
	buttons[i++] = returnObjById('menuYellow');
	buttons[i++] = returnObjById('menuOrange');
	buttons[i++] = returnObjById('menuRed');
	buttons[i++] = returnObjById('menuPink');
	buttons[i++] = returnObjById('menuGreen');
	buttons[i++] = returnObjById('menuBlue');

	//Init Button names
	i = 0;
	buttonNames[i++] = 'portfolio';
	buttonNames[i++] = 'services';
	buttonNames[i++] = 'resume';
	buttonNames[i++] = 'photos';
	buttonNames[i++] = 'travels';
	buttonNames[i++] = 'contact';

	//Init Original Button Positions
	i = 0;
	butOriginalTop[i++] = butTopOffset + (30 * disorderMultipler);
	butOriginalTop[i++] = butTopOffset + (5 * disorderMultipler);
	butOriginalTop[i++] = butTopOffset + (40 * disorderMultipler);
	butOriginalTop[i++] = butTopOffset + (15 * disorderMultipler);
	butOriginalTop[i++] = butTopOffset + (-5 * disorderMultipler);
	butOriginalTop[i++] = butTopOffset + (20 * disorderMultipler);


	butLeftOffset = (containerWidth - buttonWidth*butCount - buttonSpacer*butCount) / 2;

	//TEMP - SPACE FITTING - BUTTON COUNT = butCountVirtual(7) FOR LEFT ALIGNMENT,
	//Recalc butLeftOffset for container if button number changes,
	contentContainerButtonDecouple = (containerWidth - buttonWidth*butCountVirtual - buttonSpacer*butCountVirtual) / 2;

	//For when button number changes,
	butLeftVirtualDelta = butLeftOffset - contentContainerButtonDecouple;

	for (i = 0; i < butCount; i++) {
		butOriginalLeft[i] = butLeftOffset + (buttonWidth*i) + (buttonSpacer*i);
	}

	//Initialise button busy
	for (i = 0; i < butCount; i++) {
		buttonBusy[i] = false;
	}

	//Initialise the button positions
	for(i=0;i < butCount; i++) {
		buttons[i].style.left = butOriginalLeft[i] + "px";
		buttons[i].style.top = butOriginalTop[i] + "px";
	}

	contentContainer = returnObjById('contentContainer');
	homeContainer = returnObjById('homeContainer');
	//Init contentContainer Window //butLeftOffset
	contentContainer.style.left = (contentContainerButtonDecouple + buttonContentContainerLeftOffset + buttonWidth + 3) + "px";
	contentContainer.style.width = (contentContainerOrigWidth) + "px";
	contentContainer.style.height = contentContainerOrigHeight+"px";
	contentContainer.style.top = contentContainerOrigTop + "px";
	visible('contentContainer',false);

	//Finally read the URL and trigger a NAV if the user has a POUND in the URL
	var navCommand = self.document.location.hash.substring(1);
	//Check if navCommand present, AND, its NOT a home command
	if ((navCommand.length > 0) && (navCommand.search('home') == -1) ) {
		visible('logo', true);
		animate(navCommand);
		xajax_nav(navCommand);
	//If a SUB-Journey navigation, raise menu, link directly.
	} else if (navCommand.search('home') != -1) {
		animate('all');
		xajax_nav(navCommand);
	//If NO pound URL them we need to display the Root-Journey
	} else if (navCommand.length == 0) {
		//animate('all');
		//xajax_nav('home');
	}
}

/* returnObjById( id ) - Get an object to represent a HTML element
 * Return: Obj HTML Element
 */
function returnObjById( id )
{
    if (document.getElementById)
        var returnVar = document.getElementById(id);
    else if (document.all)
        var returnVar = document.all[id];
    else if (document.layers)
        var returnVar = document.layers[id];
    return returnVar;
}


/* Hide Object by ID
 * Return: Void.
 */
function visible( id, visible ) {
	if (visible) {
		returnObjById(id).style.visibility = "visible";
	} else {
		returnObjById(id).style.visibility = "hidden";
	}
}

/* Animate site buttons
 * Return: Void.
 */
 function animate( butName ) {
 	//Initialise variables
 	var i = 0; 					//Indexers
	var thisButStyle;
	var thisLinkStyle;
	var butNo = 0;

	//Find the button number
	for(i=0; i < butCount; i++) {
		if (butName == buttonNames[i]) {
			butNo = i;
		}
	}

	//If we want to hide ALL buttons, will need to hide Content frame as well
	if (butName == 'all') {
		visible('contentContainer', false); butNo = -1;
		//Double Check Content Window Hidden - but only if we detect a button pressed already
		if (currentButton != -1) {
			stretch(contentContainer.style.width,
					contentContainer.style.height,
					0,
					contentContainer.style.height,
					'contentContainer',0,
					"");
		}
		for(i=0; i < butCount; i++) {
			move(	buttons[i].style.left,				//StartX
			 		buttons[i].style.top, 				//StartY
					butOriginalLeft[i],				//FinalX
					butHideOffset,			 		//FinalY
					buttons[i].id,		 			//ButtonNumber
					0,								//IterationCount
					"");							//Next Move Stage
		}

		//No need to run rest of script, just quit.
		return;
	} else if (butName=='null') {
		//If NULL, is command to reset menu, simply set currentButton and let below handle it
		butNo = -1;
		currentButton = butNo;
	}

 	//If user double selecting currentButton, reset menu
 	if(currentButton == butNo) {
 		visible('homeContainer', false);

 		for(i=0; i < butCount; i++) {
			if (enableAnimation) {
				if ((i==currentButton) && (buttonBusy[currentButton] != true) ) {
					//First shrink contentContainer window, then move bars
					buttonBusy[currentButton] = true;
					nextStage = "move('"+buttons[i].style.left+ "','"
										+buttons[i].style.top+ "','"
										+butOriginalLeft[i]+ "','"
										+butOriginalTop[i]+ "','"
										+buttons[i].id+ "',0,'')";

					stretch(contentContainer.style.width,
							contentContainer.style.height,
							0,
							contentContainer.style.height,
							'contentContainer',0,
							nextStage);
				} else {

					move(	buttons[i].style.left,				//StartX
					 		buttons[i].style.top, 				//StartY
							butOriginalLeft[i],					//FinalX
							butOriginalTop[i], 					//FinalY
							buttons[i].id,						//ButtonNumber
							0,									//IterationCount
							"");								//Next Stage of Movement
				}
			} else {
				buttons[i].style.left = butOriginalLeft[i] + "px";
				buttons[i].style.top = butOriginalTop[i] + "px";
			}
		}
		currentButton = -1;

	//Otherwise this is NEW button selected,
 	} else {
		//Register the currently selected button
		currentButton = butNo;
		//Set all buttons to go off screen, except butNo button.
		for(i=0; i < butCount; i++) {
			thisButStyle = buttons[i].style;
			thisLinkStyle = returnObjById(buttons[i].id + "A").style;
			//For all other buttons, set to off screen
			if (i != butNo) {
				if (enableAnimation) {
					 move(	thisButStyle.left,				//StartX
					 		thisButStyle.top, 				//StartY
							butOriginalLeft[i],				//FinalX
							butHideOffset,			 		//FinalY
							buttons[i].id,		 			//ButtonNumber
							0,								//IterationCount
							"");							//Next Move Stage
				} else {
					thisButStyle.top = butHideOffset + "px";
					thisButStyle.left = butOriginalLeft[i]  + "px";
				}
				//Set button to be colourful on hover only
				//Commented->Leave links colourful once visited
				//thisLinkStyle.backgroundPosition = "0px 0px";

			//For the selected button, set to display window
			} else {
				if (enableAnimation) {
					//Define the second animation stage
					nextStage = "stretch('" +contentContainer.style.width+ "','"
											+contentContainer.style.height+ "','"
											+contentContainerExpandedWidth+ "','"
											+contentContainer.style.height+ "','contentContainer',0,'')";

					move(	thisButStyle.left,							//StartX
					 		thisButStyle.top, 							//StartY
							(buttonContentContainerLeftOffset + butLeftOffset - butLeftVirtualDelta), 	//FinalX
							butTopOffset + buttonContentContainerTopOffset,		//FinalY
							buttons[i].id,	 							//ButtonNumber
							0,											//IterationCount
							nextStage);									//Next Movement Stage
				} else {
					thisButStyle.top = butTopOffset + buttonContentContainerTopOffset + "px";
					thisButStyle.left = (buttonContentContainerLeftOffset + butLeftOffset) + "px";
				}
				//Set button to be colourful
				thisLinkStyle.backgroundPosition = "-80px 0px";
			}
		}
	}
}

/*
 * move(buttonToShift, finalPosition) - animate the buttons
 * Return void.
 */
function move(startX, startY, finalX, finalY, objectIDToMove, iteration, nextStage) {
	//Init Vars
	var i = 0;
	var steps = 40;
	var msDelay = 5;
	var thisObject = returnObjById(objectIDToMove);

	//Filter variables
	startX = parseInt(startX);
	startY = parseInt(startY);
	//Increment iteration counter for current step,
	iteration++;

	//Calculate value of each step,
	var newX = startX + iteration * ((finalX-startX)/steps);
	var newY = startY + iteration * ((finalY-startY)/steps);

	//Using startX,Y, finalX,Y animate the process in X steps
	//Decide if we need another event
	if ( iteration < steps ) {
		thisObject.style.top = newY + "px";
		thisObject.style.left = newX + "px";
		setTimeout("move(" +startX+ "," +startY+ "," +finalX+ "," +finalY+ ",'" +objectIDToMove+ "'," +iteration+ ",\"" +nextStage+ "\")", msDelay);
	} else {
		buttonBusy[currentButton] = false;
		thisObject.style.top = finalY + "px";
		thisObject.style.left = finalX+ "px";
		//If the second stage variable is present, fire away.
		if (nextStage.length > 0) {
			setTimeout(nextStage, msDelay);
		}
	}
}

/*
 * stretch() - stretch contentContainer container
 * Return void.
 */
function stretch(startWidth, startHeight, finalWidth, finalHeight, objectIDToMove, iteration, nextStage) {
	//Init Vars
	var i = 0;
	var msDelay = 12;
	var steps = 25;
	var thisObject = returnObjById(objectIDToMove);

	//Filter variables
	startWidth = parseInt(startWidth);
	startHeight = parseInt(startHeight);
	finalHeight = parseInt(finalHeight);
	finalWidth = parseInt(finalWidth);
	iteration++;

	//Calculate value of each step,
	var newWidth = startWidth + iteration * ((finalWidth-startWidth)/steps);
	var newHeight = startHeight + iteration * ((finalHeight-startHeight)/steps);

	if ( iteration < steps ) {
		thisObject.style.visibility = "visible";
		thisObject.style.height = newHeight + "px";
		thisObject.style.width = newWidth + "px";
		setTimeout("stretch(" +startWidth+ "," +startHeight+ "," +finalWidth+ "," +finalHeight+ ",'" +objectIDToMove+ "'," +iteration+ ",\"" +nextStage+ "\")", msDelay);
	} else {
		//Hide the contentContainer box if width=0
		if (finalWidth == 0) {
			thisObject.style.visibility = "hidden";
		} else {
			thisObject.style.visibility = "visible";
		}
		thisObject.style.height = finalHeight + "px";
		thisObject.style.width = finalWidth + "px";

		//If the second stage variable is present, fire away.
		if (nextStage.length > 0) {
			setTimeout(nextStage, msDelay);
		}
	}

}

function validate() {
	if (returnObjById("antispam").value != 'BB03') {
		alert("Invalid AntiSpam code, please re-enter.");
		return false;
	}
	return true;
}