// loading images

mainButtonOut       = new Image();
mainButtonOut.src   = "images/mainButton_out.png" ;
mainButtonOver     = new Image() ;
mainButtonOver.src = "images/mainButton_over.png" ;
mainButtonDown     = new Image() ;
mainButtonDown.src = "images/mainButton_down.png" ;

headOut     = new Image() ;
headOut.src = "images/head.png" ;
headOver     = new Image() ;
headOver.src = "images/head_over.png" ;

linkOut     = new Image() ;
linkOut.src = "images/link.png" ;
linkOver     = new Image() ;
linkOver.src = "images/link_over.png" ;

folderOut     = new Image() ;
folderOut.src = "images/folder.png" ;
folderOver     = new Image() ;
folderOver.src = "images/folder_over.png" ;

talkOut     = new Image() ;
talkOut.src = "images/talk.png" ;
talkOver     = new Image() ;
talkOver.src = "images/talk_over.png" ;

var sectionBeingViewed_g = 1;

// if console is not defined, e.g., Firebug console is not enabled or Non-Firefox browser
if (typeof console == 'undefined') {
    var console = {};
    console.log = function(msg) {
        return;
    };
}


// rollover functions
//: ===================================================================================== ://
function buttonOver( buttonname )
{
   document[ buttonname ].src = eval( buttonname + "Over.src" );
}

//: ===================================================================================== ://
function buttonOut ( buttonname )
{
   document[ buttonname ].src = eval( buttonname + "Out.src" );
}

//: ===================================================================================== ://
function buttonDown ( buttonname )
{
   document[ buttonname ].src = eval( buttonname + "Down.src" );
}

//: ===================================================================================== ://
function showFilm( )
{
	buttonOver('mainButton');
	openFilmInMain();
}

//: ===================================================================================== ://
function openFilmInMain()
{
	
	var endOfMain = function() 
	{
		var startMovie = function(){
			movieElement = document.getElementById("introMovie");
			movieElement.Play();
		}
		anElement = document.getElementById("startContentMain");
		anElement.style.visibility = 'hidden';
		movieContent = document.getElementById("movieContentMain");
		movieContent.style.visibility = 'visible';
		movieContent.style.opacity = 1;
		
		setTimeout( startMovie, 100 );
	}         
	

	var	sizeContent = new FX( 'mainContent', 
	{
		'height': {  to: 515}
	}, 0.5, 'expoInOut');
	sizeContent.start();
	
	var	fadeOutStart = new FX( 'startContentMain', 
	{
		'opacity': { to: 0.0 }
	}, 0.5, 'expoInOut', endOfMain );
	fadeOutStart.start();
	
	
	var divh = document.getElementById('overView').offsetHeight;	
}


//: ===================================================================================== ://
function moveHiliteBoxTo( elementNumber )
{
	var leftOffset = ( elementNumber - 1) * 200;
	var	moveHilite = new FX( 'hiliteBox', 
	{
		'left': {to: leftOffset}
	}, 0.5, 'expoInOut');
	moveHilite.start();
}

//: ===================================================================================== ://
function hiliteTitle ( theItem ) {
  document[ theItem ].src = eval( theItem +".src" );
}

//: ===================================================================================== ://
function offsetOfElement(elementNumber){
	// console.log( "nextSection:" + elementNumber );
	var counter = 1;
	var	offsetValue = 0;
	for( counter; counter < elementNumber; counter++ ){
		var aSection = counter + "section";
		var divHeight = document.getElementById(aSection).clientHeight;
		offsetValue += divHeight;
	}
	sectionBeingViewed_g = elementNumber;
	setNextButtonDetails();	
	return offsetValue;
}

//: ===================================================================================== ://
function setNextButtonDetails () 
{
	if ( sectionBeingViewed_g == 1 ){
		document.getElementById('next').innerHTML = "Go to:<a href='javascript:scrollToTopInfo()'>Links</a>";
	}
	else if( sectionBeingViewed_g == 2 ){
		document.getElementById('next').innerHTML = "Go to:<a href='javascript:scrollToTopInfo()'>Organise</a>";
	}
	else if( sectionBeingViewed_g == 3 ){
		document.getElementById('next').innerHTML = "Go to:<a href='javascript:scrollToTopInfo()'>Testimonials</a>";
	}
	else if( sectionBeingViewed_g == 4 ){
		document.getElementById('next').innerHTML = "Go back to:<a href='javascript:scrollToTopInfo()'>Brainstorm</a>";
	}
}
//: ===================================================================================== ://
function heightOfElement(elementNumber){
	var aSection = elementNumber + "section";
	var divHeight = document.getElementById(aSection).clientHeight;
	return divHeight;
}

//: ===================================================================================== ://
function scrollTopValue () {
	var scrollTop = document.body.scrollTop;
	if (scrollTop == 0)
	{
	    if (window.pageYOffset)
	        scrollTop = window.pageYOffset;
	    else
	        scrollTop = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
	}
	return 	scrollTop;
}

//: ===================================================================================== ://
function scrollToTopInfo () {
	var scrollTop = scrollTopValue();
	var	topOfNavButtons = ( document.getElementById('hiliteContainer').offsetTop ) + 30;
	/*window.scrollTo(0,topOfNavButtons);*/
	var amountToScroll = ( scrollTop - topOfNavButtons );
	var incrementalScrolls = 30;
	if ( amountToScroll < 0 ){
		incrementalScrolls = -30;
	}
	scrollToTopOfInfoBy (incrementalScrolls, 5, topOfNavButtons);
	// console.log( "the amount to scroll:" + amountToScroll );
	// alert( "scroll value:" + scrollTop +" top of nav buttons:" + topOfNavButtons );
}

//: ===================================================================================== ://
//: Scrolls to finalValue by the specific amount each time ://
function scrollToTopOfInfoBy (amount, timeinterval, finalValue) {
	var timeOutCall;
	var scrollTop = scrollTopValue();
	if( scrollTop == finalValue ){
		return;
	}
	var newScrollPosition = scrollTop - amount;
	/* make sure that we dont overshoot, relating it to which direction we are scrolling */
	if(( amount > 0 && newScrollPosition < finalValue )||( amount < 0 && newScrollPosition > finalValue )){
		newScrollPosition = finalValue;
		goToNextSection();
	}
	else{
		var nextStep = function () {
			scrollToTopOfInfoBy (amount, timeinterval, finalValue);
		}
		timeOutCall = setTimeout( nextStep, timeinterval );
	}
	// console.log( "the amount to scroll:" + amount + " final value:" + finalValue + " new scroll position:" + newScrollPosition );

	window.scrollTo(0,newScrollPosition);
	if ( document.body.scrollTop == scrollTop ){
		clearTimeout ( timeOutCall );
		goToNextSection();
	}
}

//: ===================================================================================== ://
function jumpToTopOfInfo () {
	var	topOfNavButtons = ( document.getElementById('hiliteContainer').offsetTop ) + 30;
	window.scrollTo(0,topOfNavButtons);
	goToNextSection();
}

//: ===================================================================================== ://
function goToNextSection () {
	if( sectionBeingViewed_g == 4 ){
		showSection( '1section' );
	}
	else{
		var nextSection = ( sectionBeingViewed_g + 1 ) + "section";
		showSection( nextSection );
	}
}

//: ===================================================================================== ://
function initalSetup () {
	var theOuterFrame = document.getElementById('overViewOuterFrame');
	var	elementHeight = heightOfElement(1);
	theOuterFrame.style.height = elementHeight + "px";
	setNextButtonDetails();
}
//: ===================================================================================== ://
function showSection( sectionValue ){
	var elementOffset = Math.abs( document.getElementById('overView').offsetTop - document.getElementById('overViewOuterFrame').offsetTop );
	var elementNumber = parseInt(sectionValue.slice(0,1));
	var	elementHeight = heightOfElement(elementNumber);
	var	newElementOffset = - offsetOfElement(elementNumber);
	var amoutToMove =  Math.abs(( - newElementOffset ) - elementOffset );
	var	timeToMove = amoutToMove/1500;
	
	moveHiliteBoxTo( elementNumber );
	var	overviewOffset = new FX( 'overView', 
	{
		'top': {to: newElementOffset},
	}, timeToMove, 'easeOut');
	overviewOffset.start();
	
	var	overviewHeight = new FX( 'overViewOuterFrame', 
	{
		'height': {to: elementHeight},
	}, timeToMove, 'easeOut');
	overviewHeight.start();
}