
document.observe("dom:loaded", domloaded);

function domloaded(){
	var projects = $('content').down('ul').childElements();
	if(projects) for(var i=0; i<projects.length; i++){
		var pbt = $(projects[i]);
		
		pbt.baseColor = pbt.getStyle("background-color");
		pbt.observe('click', openproject.bind(this, pbt));
		pbt.observe('mouseover', function(){this.addClassName('over')});
		pbt.observe('mouseout', function(){this.removeClassName('over')});
		
		var mbtt = pbt.down('.moinsbtt');
		mbtt.hide();
		mbtt.observe('click', foldproject.bind(this, pbt));
		var mbtb = pbt.down('.moinsbtb');
		mbtb.hide();
		mbtb.observe('click', foldproject.bind(this, pbt));
	}
	
	
	
	setTimeout(function() { window.scrollTo(0, 1) }, 100);
}


var changingState = false;


function openproject(project){
	if(changingState) return;

	changingState = true;
	
	var projects = $('content').down('ul').childElements();
	for (var i = 0; i < projects.length; i++) {
		if(projects[i] != project) foldproject(projects[i]);
	}
	
	project.down('.plusbt').hide();
	project.stopObserving('click');
	
	var f = project.down('.fold');
	new Effect.SlideDown(f, {
	beforeSetup:function(){
		project.removeClassName('start');
	},
	afterFinish:function(){
		project.down('.moinsbtt').appear({ duration: 0.5 });
		project.down('.moinsbtb').appear({ duration: 0.5 });
		changingState = false;
	}});
	
	/*new Effect.Morph(project, {
		style: 'background:#fff; color: #000;'
	});*/
	project.morph('background:#fff; color: #000;');
}

function foldproject(project){
	//if(changingState) return;
	
	//changingState = true;
	
	project.down('.moinsbtt').hide();
	project.down('.moinsbtb').hide();
	var f = project.down('.fold');
	new Effect.SlideUp(f, {
	afterFinish:function(){
		project.down('.plusbt').appear({ duration: 0.5 });
		project.observe('click', openproject.bind(this, project));
		project.addClassName('start');
		//changingState = false;
	}});
	
	/*new Effect.Morph(project, {
		style: 'background:'+project.baseColor+'; color: #fff;'
	});*/
	project.morph('background:'+project.baseColor+'; color: #fff;');
}

