function opacity(id, opacStart, opacEnd, millisec) {
	//speed for each frame
	var speed = Math.round(millisec / 100);
	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 * speed));
			timer++;
		}
	} else if(opacStart < opacEnd) {
		for(i = opacStart; i <= opacEnd; i++)
			{
			setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * 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 shiftOpacity(id, millisec) {
	//if an element is invisible, make it visible, else make it ivisible
	if(document.getElementById(id).style.opacity == 0) {
		opacity(id, 0, 100, millisec);
	} else {
		opacity(id, 100, 0, millisec);
	}
}

function blendimage(divid, imageid, imagefile, millisec) {
	var speed = Math.round(millisec / 100);
	var timer = 0;
	
	//set the current image as background
	document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
	
	//make image transparent
	changeOpac(0, imageid);
	
	//make new image
	document.getElementById(imageid).src = imagefile;

	//fade in image
	for(i = 0; i <= 100; i++) {
		setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed));
		timer++;
	}
}

function currentOpac(id, opacEnd, millisec) {
	//standard opacity is 100
	var currentOpac = 100;
	
	//if the element has an opacity set, get it
	if(document.getElementById(id).style.opacity < 100) {
		currentOpac = document.getElementById(id).style.opacity * 100;
	}

	//call for the function that changes the opacity
	opacity(id, currentOpac, opacEnd, millisec)
}

bgPos = new Array(4);
for (i = 0; i < bgPos.length; ++ i)
	bgPos [i] = new Array(2);

//about me
bgPos [0] [0] = -953;
bgPos [0] [1] = -766;

//portfolio
bgPos [1] [0] = -953;
bgPos [1] [1] = -286;

//resume
bgPos [2] [0] = -953;
bgPos [2] [1] = -533;

//contact
bgPos [3] [0] = -660; //660
bgPos [3] [1] = 216;

var currentSection = 1;
var fromX, fromY, toX, toY, incX, incY;
var t;
var count = 0;
var loaded = 0;


function moveBG(from, to)
{
	if (count <= 50)
	{
		fromY += incY;
		fromX += incX;
		document.getElementById('container').style.backgroundPosition = fromX + "px "+ fromY +"px";
		count++;
	}
	else
	{
		clearInterval(t);
		t = null;
		//fade in 'to' content
		
		document.getElementById("section"+from).style.display = "none";
		document.getElementById("section"+to).style.display = "";
		opacity("section"+to, 0, 100, 500);
		
		currentSection = to;
		count = 0;
	}
}

function loadSection(section)
{
	if (loaded != 1)
	{
		changeOpac(0, "section0");
		changeOpac(100, "section1");
		changeOpac(0, "section2");
		changeOpac(0, "section3");
		document.getElementById("section0").style.visibility = "visible";
		document.getElementById("section2").style.visibility = "visible";
		document.getElementById("section3").style.visibility = "visible";
		document.getElementById("section0").style.display = "none";
		document.getElementById("section2").style.display = "none";
		document.getElementById("section3").style.display = "none";
		loaded = 1;
	}
	if (currentSection != section && !t)
	{
		//fade currentSection content
		opacity("section"+currentSection, 100, 0, 250);
		
		//color active links/de-color
		document.getElementById("link"+currentSection).style.color = "";
		document.getElementById("link"+section).style.color = "#111111";
		
		//move background
		fromX = bgPos[currentSection][0];
		fromY = bgPos[currentSection][1];
		toX = bgPos[section][0];
		toY = bgPos[section][1];
		incY = (toY-fromY)/50;
		incX = (toX-fromX)/50;
		t = setInterval("moveBG("+currentSection+", "+section+")", 20);
		
		
	}
}