/* Declare Variables
--------------------------------------------*/
var interval1 = ""; //Used for the Height Animation
var interval2 = ""; //Used for the Width Animation
var mainHeight = innerWidth - 280; //The Height of the main div after animation
var mainWidth = innerHeight - 20; //The Width of the main div after animation
var inAnimation = false; //Should be true during animation
var inAnimationTimeout = ""; //The timeout for resetting the inAnimation variable
var isExpanded = false; //Should be true if main div is expanded
var active = 'none'; //The name of the currently active div
var lastOpen = 'none'; //The last opened section

function animateHeight(id, heightStart, heightEnd, millisec) { //Height Animation
    //speed for each frame
    var speed = Math.round(millisec / 50);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(heightStart > heightEnd) {
        for(i = heightStart; i >= heightEnd; i--) {
	    setTimeout("changeHeight(" + i + ",'" + id + "')",(timer/2 * speed));
	    timer++;
        }
    } 
    else if(heightStart < heightEnd) {
        for(i = heightStart; i <= heightEnd; i++) {
	    setTimeout("changeHeight(" + i + ",'" + id + "')",(timer/2 * speed));
	    timer++;
        }
    }
}

function animateWidth(id, widthStart, widthEnd, millisec) { //Width Animation
    //speed for each frame
    var speed = Math.round(millisec / 50);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(widthStart > widthEnd) {
        for(i = widthStart; i >= widthEnd; i--) {
		    setTimeout("changeWidth(" + i + ",'" + id + "')",(timer * speed));
	        timer++;
        }
    } 
    else if(widthStart < widthEnd) {
        for(i = widthStart; i <= widthEnd; i++) {
            setTimeout("changeWidth(" + i + ",'" + id + "')",(timer * speed));
	    timer++;
        }
    }
}

function changeHeight(height, id) { //Changing the Height
    var object = document.getElementById(id).style;
    object.height = height +"px";
}

function changeWidth(width, id) { //Changing the Width
    var object = document.getElementById(id).style;
    object.width = width +"px";
}

function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 200);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer/2 * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer/2 * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 

function getMainDimentions() { //Resizing the main div
    var mainHeight = innerWidth - 400; //The Height of the main div after animation
    var mainWidth = innerHeight - 40; //The Width of the main div after animation
    //if ((inAnimation==false)&&(isExpanded==true)) {
        resizeMain();
    //}
}

function resizeMain() {
    document.getElementById('main').style.width = innerWidth - 300+'px';
    document.getElementById('main').style.height = innerHeight - 130+'px';
	document.getElementById('general').style.width = innerWidth - 310+'px';
    document.getElementById('general').style.height = innerHeight - 140+'px';
	document.getElementById('gettingthere').style.width = innerWidth - 310+'px';
    document.getElementById('gettingthere').style.height = innerHeight - 140+'px';
	document.getElementById('wheretostay').style.width = innerWidth - 310+'px';
    document.getElementById('wheretostay').style.height = innerHeight - 140+'px';
	document.getElementById('attractions').style.width = innerWidth - 310+'px';
    document.getElementById('attractions').style.height = innerHeight - 140+'px'; 
	document.getElementById('itinerary').style.width = innerWidth - 310+'px';
    document.getElementById('itinerary').style.height = innerHeight - 140+'px';
    document.getElementById('sources').style.width = innerWidth - 310+'px';
    document.getElementById('sources').style.height = innerHeight - 140+'px';
    document.getElementById('climate').style.width = innerWidth - 310+'px';
    document.getElementById('climate').style.height = innerHeight - 140+'px';
    document.getElementById('demographics').style.width = innerWidth - 310+'px';
    document.getElementById('demographics').style.height = innerHeight - 140+'px';
}

function toggleMain(n) {
    if ((isExpanded==false)&&(active=='none')) {
		open(n)
    }
    else if ((isExpanded==true)&&(active==n)) {
        closeActive();
    }
	else if ((isExpanded==true)&&(active!=n)) {
		closeActive();
		setTimeout('open(\''+n+'\')',1200);
	}
}

function open(n) {
	if (inAnimation==false) {
		var newHeight = innerHeight - 110;
		document.getElementById('mainbg').style.display = 'block';
		changeWidth(innerWidth - 280,'mainbg');
		animateHeight('mainbg',0,newHeight,100);
		isExpanded = true;
		setTimeout('opacity(\''+n+'\',0,100,600)',800);
		setTimeout('document.getElementById(\''+n+'\').style.display="block"',300)
		lastOpen = active;
		active = n;
	}
	else {
		alert('Please wait for the current animation to be done before clicking again.');
	}
}

function closeActive () {
	if (inAnimation==false) {
		var newHeight = innerHeight - 110;
		document.getElementById('mainbg').style.display = 'block';
		changeWidth(innerWidth - 280,'mainbg');
		setTimeout('animateHeight(\'mainbg\',\''+newHeight+'\',0,100);',600);
		setTimeout('isExpanded=false',100);
		opacity(active,100,0,500);
		setTimeout('document.getElementById(\''+active+'\').style.display="none"',100)
		active = 'none';
	}
	else {
		alert('Please wait for the current animation to be done before clicking again.');
	}
}