var home_off = new Image(206, 58);

home_off.src = "layout/images/1_home.gif";

var home_on = new Image(206, 58);

home_on.src = "layout/images/1_homerl.gif";



var projects_off = new Image(206, 58);

projects_off.src = "layout/images/2_projects.gif";

var projects_on = new Image(206, 58);

projects_on.src = "layout/images/2_projectsrl.gif";



var music_off = new Image(206, 59);

music_off.src = "layout/images/3_music.gif";

var music_on = new Image(206, 59);

music_on.src = "layout/images/3_musicrl.gif";



var art_off = new Image(206, 59);

art_off.src = "layout/images/4_art.gif";

var art_on = new Image(206, 59);

art_on.src = "layout/images/4_artrl.gif";



var graphHeights = new Array(5);

graphHeights[0] = 295;

graphHeights[1] = graphHeights[0] - 75;

graphHeights[2] = graphHeights[1] - 75;

graphHeights[3] = graphHeights[2] - 75;

graphHeights[4] = 5;



var graphHeight = graphHeights[4];

var targetHeight = graphHeight;



var graphTime = 0;



var numSteps = 10;

var maxDeltaH = 10;

var deltaT_G = 10;



var minPos = 52;

var maxPos = 56;

var deltaP = 1;

var deltaT_B = 20;



var slidingButtons = new Array(4);



var is_opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);



function SlidingButton(div_h)

{

	this.divTag = div_h;

	this.slideTime = 0;

	this.slidingOut = false;

	this.slidingBack = false;

	this.pos = minPos;

}



SlidingButton.prototype.slideOut = function()

{

	this.slidingOut = true;

	if (this.slidingBack) clearTimeout(this.slideTime);

	this.slidingBack = false;

	if (this.pos < maxPos)

	{

		this.pos = Math.min(maxPos, this.pos + deltaP);

		this.divTag.style.left = this.pos + "px";

		var b = this;

		setTimeout(function () {if (b.slidingOut) b.slideOut();}, deltaT_B);

	}

	else

	{

		this.slidingOut = false;

	}

}



SlidingButton.prototype.slideBack = function()

{

	this.slidingBack = true;

	if (this.slidingOut) clearTimeout(this.slideTime);

	this.slidingOut = false;

	if (this.pos > minPos)

	{

		this.pos = Math.max(minPos, this.pos - deltaP);

		this.divTag.style.left = this.pos + "px";

		var b = this;

		this.slideTime = setTimeout(function () {if (b.slidingBack) b.slideBack();}, deltaT_B);

	}

	else

	{

		this.slidingBack = false;

	}

}



function clamp(num, l, r)

{

	return num < l ? l : num > r ? r : num;

}



function updateGraphHeight()

{



	var deltaH = clamp((targetHeight - graphHeight) / numSteps, -maxDeltaH, maxDeltaH);



	if (Math.abs(targetHeight - graphHeight) <= Math.abs(deltaH))

	{

		graphHeight = targetHeight;

		graphTime = 0;

	}

	else

	{

		graphHeight += deltaH;

		graphTime = setTimeout("updateGraphHeight()", deltaT_G);

	}

	document.getElementById("bargraph").style.height = graphHeight + "px";

	if (is_opera)

	{

		document.getElementById("bargraph").style.top = (321 - graphHeight) + "px";

	}

}



function initButtons()

{

	slidingButtons[0] = new SlidingButton(document.getElementById("home_link"));

	slidingButtons[1] = new SlidingButton(document.getElementById("projects_link"));

	slidingButtons[2] = new SlidingButton(document.getElementById("music_link"));

	slidingButtons[3] = new SlidingButton(document.getElementById("art_link"));

}



function slideout(id)

{

	slidingButtons[id].slideOut();

	targetHeight = graphHeights[id];

	if (!graphTime) updateGraphHeight();

}



function slideback(id)

{

	slidingButtons[id].slideBack();

	targetHeight = graphHeights[4];

	if (!graphTime) updateGraphHeight();

}