var isExtended = 0;
var height = 345;
var width = 429;
var slideDuration = 400;
//var opacityDuration = 800;
var slideDurationFirst = 500;

function firstview(){
	
	sideBarSlideFirst(height, height, 0, width);

	sideBarOpacity(0, 1, 1000);

}

function extendContract(){
	
	if(isExtended == 0){
		
		sideBarSlide(height, height, 0, width);
		
		sideBarOpacity(0, 1, 1000);
	
		isExtended = 1;
		
		// make expand tab arrow image face left (inwards)
		//$('sideBarTab').childNodes[0].src = $('sideBarTab').childNodes[0].src.replace(/(\.[^.]+)$/, '-active$1');
		
	}
	else{
		
		sideBarSlide(height, height, width, 0);
		
		sideBarOpacity(1, 0, 500);
		
		isExtended = 0;
		
		// make expand tab arrow image face right (outwards)
		
		//$('sideBarTab').childNodes[0].src = $('sideBarTab').childNodes[0].src.replace(/-active(\.[^.]+)$/, '$1');
	}

}

function sideBarSlideFirst(fromHeight, toHeight, fromWidth, toWidth){
		var myEffects = new Fx.Styles('sideBarContents', {duration: slideDurationFirst, transition: Fx.Transitions.linear, onComplete: sideBarPause});
		myEffects.custom({
			 'height': [fromHeight, toHeight],
			 'width': [fromWidth, toWidth]
		});
}

function sideBarPause(){
		var myEffects = new Fx.Styles('sideBarContents', {duration: 2500, transition: Fx.Transitions.linear, onComplete: sideBarSlideSecond});
		myEffects.custom({
			 'height': [height, height],
			 'width': [width, width]
		});
}

function sideBarSlideSecond(){
		var myEffects = new Fx.Styles('sideBarContents', {duration: slideDurationFirst, transition: Fx.Transitions.linear, onComplete: function(){$('sideBarTab').addEvent('click', function(){extendContract()});}});
		myEffects.custom({
			 'height': [height, height],
			 'width': [width, 0]
		});
		sideBarOpacity(1, 0, 500);
}

function sideBarSlide(fromHeight, toHeight, fromWidth, toWidth){
		var myEffects = new Fx.Styles('sideBarContents', {duration: slideDuration, transition: Fx.Transitions.linear});
		myEffects.custom({
			 'height': [fromHeight, toHeight],
			 'width': [fromWidth, toWidth]
		});
}

function sideBarOpacity(from, to, optime){
		var myEffects = new Fx.Styles('sideBarContents', {duration: optime, transition: Fx.Transitions.linear});
		myEffects.custom({
			 'opacity': [from, to]
		});
}

function init(){
$('sideBarTab').addEvent('click', function(){extendContract()});
	//firstview();
}

window.addEvent('load', function(){init()});
