var imageObject = new Image();

function preloadimage( name ) {
	imageObject.src = name;
}

if (document.images) {
	preloadimage("tl.gif")
	preloadimage("tc.gif");
	preloadimage("tr.gif");
	preloadimage("sl.gif");
	preloadimage("sr.gif");
	preloadimage("bl.gif");
	preloadimage("bc.gif");
	preloadimage("br.gif");
}



//////////////////////////////////////

var animations = new Array();
var ramps = new Array();
var current_ramp;

var isAnimating = 0;

var current_page = "home";

function ramp(start,goal,time,fps,callback,data) {

	this.start = start;
	this.goal = goal;
	this.fps = fps;
	this.time = time;
	this.callback = callback;
	this.current = start;
	this.data = data;
	this.timestep = 1000/fps;
	this.steps = Math.round(time/this.timestep);
	this.stepNum = 0;
	this.increment = (goal-start)/this.steps;
	this.Begin = rampBegin;
	this.Tick = rampTick;

}

function rampBegin() {
	for (var i = 0; i < this.steps; ++i)
		setTimeout(this.Tick,this.timestep*i,this);

	current_ramp = this;
}

function rampTick(obj) {

	obj = current_ramp;

	obj.current += obj.increment;
	obj.stepNum += 1;
	if (obj.stepNum == obj.steps) obj.current = obj.goal;
	obj.callback(obj.current,obj.data);
	if (obj.stepNum == obj.steps) nextAnimation();
}

function nextAnimation() {
	
	var len = animations.length;

	if (len > 0) {
		var func = animations[len-1];
		animations.pop();
		func();
		if (func != nextRamp) nextAnimation();
	} else isAnimating = 0;
}

function nextRamp() {
	var len = ramps.length;

	if (len > 0) {
		var r = ramps[len-1];
		if (r.goal != r.start) {

			r.Begin();	//do ramp only if it needs to be done
			ramps.pop();
		}
		else {
			ramps.pop();
			nextAnimation();
		}
	}
}


var work_page;
var play_page;
var work_button;
var play_button;
var home_button;
var cover_image;
var print_obj;

function init() {

	work_button = document.getElementById("left");
	play_button = document.getElementById("right");
	home_button = document.getElementById("middle");

	print_obj = document.getElementById("printer");
	work_page = document.getElementById("work_page");
	play_page = document.getElementById("play_page");
	cover_image = document.getElementById("cover_image");

	hideWork();
	hidePlay();

	work_button.onmousedown = function () { toggleWork(); };
	play_button.onmousedown = function () { togglePlay(); };
	home_button.onmousedown = function () { toggleHome(); };

	work_button.onmouseover = function () { highlight(work_button); };
	work_button.onmouseout = function () { unhighlight(work_button); };

	play_button.onmouseover = function () { highlight(play_button); };
	play_button.onmouseout = function () { unhighlight(play_button); };

	home_button.onmouseover = function () { highlight(home_button); };
	home_button.onmouseout = function () { unhighlight(home_button); };

}

function highlight(obj) {
	obj.style.backgroundColor = "#303840";
	obj.style.color = "white";
}

function unhighlight(obj) {
	obj.style.backgroundColor = "#ffffff";
	obj.style.color = "#303840";
}


function changeHeight(new_height,obj) {
	obj.style.height = new_height + "px";
}

function changeWidth(new_width,obj) {
	obj.style.width = new_width + "px";
}

function changeOpacity(new_opacity, obj) {

    var object = obj.style;
    object.opacity = (new_opacity / 100);
    object.MozOpacity = (new_opacity / 100);
    object.KhtmlOpacity = (new_opacity / 100);
    object.filter = "alpha(opacity=" + new_opacity + ")";
} 



function hide_work_page() {
	changeOpacity(0,work_page);
}

function hide_play_page() {
	changeOpacity(0,play_page);
}

function hideWork() {
	work_page.style.display = "none";
}

function showWork() {
	work_page.style.display = "block";
}

function hidePlay() {
	play_page.style.display = "none";
}

function showPlay() {
	play_page.style.display = "block";
}

function hideHome() {
	cover_image.style.display = "none";
}

function showHome() {
	cover_image.style.display = "block";
}

function hideScrollbars() {

	var obj = work_page;
	obj.style.overflowY = "hidden";
	obj.style.overflowX = "hidden";
	obj = play_page;
	obj.style.overflowY = "hidden";
	obj.style.overflowX = "hidden";

	//obj = document.getElementById("youtube1");
	//obj.style.display = "none";

}

function showScrollbars() {

	var obj = work_page;
	obj.style.overflowY = "auto";
	obj.style.overflowX = "hidden";
	obj = play_page;
	obj.style.overflowY = "auto";
	obj.style.overflowX = "hidden";

	//obj = document.getElementById("youtube1");
	//obj.style.display = "block";
}

function toggleWork() {

	if (current_page == "work") return;
	if (isAnimating) return;
	isAnimating = 1;

	var work_ramp = new ramp(work_page.clientHeight,600,1000,30,changeHeight,work_page);
	ramps.push(work_ramp);

	animations.push(showScrollbars);	//show scrollbars
	animations.push(nextRamp);			//open work	
	animations.push(showWork);			//display work

	if (current_page == "home") {
		var cover_ramp = new ramp(cover_image.clientHeight,1,1000,30,changeHeight,cover_image);
		ramps.push(cover_ramp);

		animations.push(hideHome);		//hide cover
		animations.push(nextRamp);		//close cover
	} else {
		var play_ramp = new ramp(play_page.clientHeight,1,1000,30,changeHeight,play_page);
		ramps.push(play_ramp);

		animations.push(hidePlay);		//hide play
		animations.push(nextRamp);		//close play
	}

	animations.push(hideScrollbars);	//hide scrollbars

	current_page = "work";

	nextAnimation();

}

function togglePlay() {


	if (current_page == "play") return;
	if (isAnimating) return;
	isAnimating = 1;


	var play_ramp = new ramp(play_page.clientHeight,600,1000,30,changeHeight,play_page);
	ramps.push(play_ramp);

	animations.push(showScrollbars);	//show scrollbars
	animations.push(nextRamp);			//open play
	animations.push(showPlay);			//display play

	if (current_page == "home") {
		var cover_ramp = new ramp(cover_image.clientHeight,1,1000,30,changeHeight,cover_image);
		ramps.push(cover_ramp);

		animations.push(hideHome);		//hide cover
		animations.push(nextRamp);		//close cover
	} else {
		var work_ramp = new ramp(work_page.clientHeight,1,1000,30,changeHeight,work_page);
		ramps.push(work_ramp);

		animations.push(hideWork);		//hide work
		animations.push(nextRamp);		//close work
	}

	animations.push(hideScrollbars);	//hide scrollbars

	current_page = "play";

	nextAnimation();

}

function toggleHome() {

	if (current_page == "home") return;
	if (isAnimating) return;
	isAnimating = 1;

	var cover_ramp = new ramp(cover_image.clientHeight,444,1000,30,changeHeight,cover_image);
	ramps.push(cover_ramp);

	animations.push(showScrollbars);	//show scrollbars
	animations.push(nextRamp);			//open cover
	animations.push(showHome);			//display cover

	if (current_page == "play") {
		var play_ramp = new ramp(play_page.clientHeight,1,1000,30,changeHeight,play_page);
		ramps.push(play_ramp);

		animations.push(hideHome);		//hide play
		animations.push(nextRamp);		//close play
	} else {
		var work_ramp = new ramp(work_page.clientHeight,1,1000,30,changeHeight,work_page);
		ramps.push(work_ramp);

		animations.push(hideWork);		//hide work
		animations.push(nextRamp);		//close work
	}

	animations.push(hideScrollbars);	//hide scrollbars

	current_page = "home";

	nextAnimation();

}



var width = 10;

function startTable( w, borderWidth ) {

width = w;

document.write("<table class=\"center\" width=200 border=");
document.write(borderWidth);
document.write(" cellspacing=0 cellpadding=0><tr><td width=");
document.write(width);
document.write("><img src=tl.gif width=");
document.write(width);
document.write(" height=");
document.write(width);
document.write("></td><td style=\"background-image:url('tc.gif');background-repeat:repeat;\"></td><td width= ");
document.write(width);
document.write("><img src=tr.gif width=");
document.write(width);
document.write(" height=");
document.write(width);
document.write("></td></tr><tr><td style=\"background-image:url('sl.gif');background-repeat:repeat;\"></td><td> ");


}

function stopTable() {
document.write("</td><td style=\"background-image:url('sr.gif');background-repeat:repeat;\" ");
document.write("></td></tr><tr><td width=");
document.write(width);
document.write("><img src=bl.gif width=");
document.write(width);
document.write(" height=");
document.write(width);
document.write("></td><td style=\"background-image:url('bc.gif');background-repeat:repeat;\" ");
document.write("></td><td width=");
document.write(width);
document.write("><img src=br.gif width=");
document.write(width);
document.write(" height=");
document.write(width);
document.write("></td></tr></table>");


}

function debug(str) {
	str = "" + str;
	print_obj.innerHTML += str + "<br/>";
}