function change(id) {
	$("why").className="hide";
	$("portfolio").className="hide";
	$("portfolio_detail").className="hide";
	$("quote").className="hide";
		if (identity.className=="hide") {
			identity.className="show";
		} else {
			identity.className="hide";
		}
	
	// fade it out
	opacity('whiteout', 100, 0, 500);
	setTimeout("$('whiteout').className='hide'", 500);
}

function fade(id) {
	identity=$(id);
	// fade in the whiteout
	$('whiteout').className="show";
	opacity('whiteout', 0, 100, 300);
	
	setTimeout("change('id')", 300);
}

opendiv = "";
infoPos = false;
scrolling = false;

function loadScreenshot(image, div)
{
    opendiv = div;
	$("portfolio_detail").style.background = 'url(/images/screens/'+image+')';
	fade('portfolio_detail');
	setTimeout("showInfo()", 500);
} 

function toggleInfo() {
	if(infoPos) {
		hideInfo();
	} else {
		showInfo();
	}
}

function hideInfo() {
	$("portfolio_info").style.display = "none";
	new Effect.Move('portfolio_buttons', { x: 250, y: 0 });	
	new Effect.Move('portfolio_back', { x: 250, y: 0 });	
	setTimeout("$('infoToggle').src = '_images/portfolio_button_left.png'", 1000);
	infoPos = false;
}

function showInfo() {
	$('portfolio_buttons').style.display = 'block';
	new Effect.Move('portfolio_back', { x: -250, y: 0 });
	new Effect.Move('portfolio_buttons', { x: -250, y: 0 });
	$(opendiv).className="show";
	setTimeout("new Effect.BlindDown('portfolio_info', { duration: 0.5 })", 1000);
	setTimeout("$('infoToggle').src = '_images/portfolio_button_right.png'", 1000);
	infoPos = true;
}

function unloadScreenshot() {
	$(opendiv).className='hide';
	if (infoPos) {
		hideInfo();
		setTimeout("$('portfolio_buttons').style.display = 'none'", 1000);
		setTimeout("fade('portfolio')", 800);
	} else {
		$('portfolio_buttons').style.display = 'none';
		fade('portfolio');
	}
}

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++;
        }
    }
}

function logoscroll(event) {
	setTimeout("scrolling = false", 1000);
	var ele = Event.element(event);
	var id = ele.getAttribute('id');
	
	if(!scrolling) {
		switch (id) {
			case 'left_arrow':
				scrolling = true;
				var lastLogo = $('logos').select('li')[$('logos').descendants().length/2 -1].remove();
				$('logos').insertBefore(lastLogo,$('logos').select('li')[0]);
				$('logos').setStyle({'left':'-340px'});
				new Effect.Move('logos', { x: 170, y: 0, duration: 0.75 }); 
				break;
			case 'right_arrow':
				scrolling = true;
				var firstLogo = $('logos').select('li')[0].remove();
				$('logos').appendChild(firstLogo);
				$('logos').setStyle({'left':'0px'});
				new Effect.Move('logos', { x: -170, y: 0, duration: 0.75 }); 
				break;
			default: break;
		}
	}
}

function shiftOpacity(id, millisec) {
    //if an element is invisible, make it visible, else make it ivisible
    if($(id).style.opacity == 0) {
        opacity(id, 0, 100, millisec);
    } else {
        opacity(id, 100, 0, millisec);
    }
} 

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