var currentObjective =1;
var fadeLoop;
var fadeLoop2;

window.addEvent('domready', function() {
	$('fade1a').setStyle('opacity','0.3');
	$('fade1b').setStyle('opacity','0.3');
	$('list1').setStyles({'width':'0px','opacity':'0'});
	$('fade2a').setStyle('opacity','0.3');
	$('fade2b').setStyle('opacity','0.3');
	$('list2').setStyle('opacity','0');
	$('fade3a').setStyle('opacity','0.3');
	$('fade3b').setStyle('opacity','0.3');
	$('list3').setStyles({'width':'0px','height':'0px'});
	
	$("more1").addEvent('click',function(){
		if ($('content1').getStyle('height') == '165px'){
			bounceBlock('1','94px');
			$('fade1a').morph({'left':'-20px'});
			$('fade1b').morph({'top':'-104px'});
		}else {
			bounceBlock('1','165px');
			$('fade1a').morph({'left':'258px'});
			$('fade1b').morph({'top':'0px'});
		}
	});
	
	/*$("more2").addEvent('click',function(){
		if ($('content2').getStyle('height') == '180px'){
			bounceBlock('2','94px');
			$('fade2a').morph({'left':'-20px'});
			$('fade2b').morph({'top':'-104px'});
		}else {
			bounceBlock('2','180px');
			$('fade2a').morph({'left':'258px'});
			$('fade2b').morph({'top':'0px'});
		}
	});*/
	
	$("more3").addEvent('click',function(){
		if ($('content3').getStyle('height') == '230px'){
			bounceBlock('3','94px');
			$('fade3a').morph({'left':'-20px'});
			$('fade3b').morph({'top':'-104px'});
		}else {
			bounceBlock('3','230px');
			$('fade3a').morph({'left':'258px'});
			$('fade3b').morph({'top':'0px'});
		}
	});
		
});

//function to bounce the content areas in
function bounceBlock(dropId,toHeight){
	
	morphElement = $("content" + dropId);
	
	var customMorph = new Fx.Morph(morphElement, {
		transition: 'bounce:out',
		duration: 1500,
		onComplete:function(){
			if (dropId == 1){
				if (toHeight == "94px"){
					$("list" + dropId).morph({'width':'0px','opacity':'0'});
					//fadeLoop = $clear(fadeLoop);
				} else {
					$("list" + dropId).morph({'width':'228px','opacity':'1'});
					//var fadeLoop = window.setInterval(function(){loopObjectives();},4000);
					fadeLoop = $clear(fadeLoop);
					fadeLoop2 = function(){ loopObjectives(); };
					fadeLoop = fadeLoop2.periodical(3000);
				}
			}else if (dropId == 2){
				if (toHeight == "94px"){
					$("list" + dropId).morph({'opacity':'0','height':'0px'});
				} else {
					$("list" + dropId).morph({'opacity':'1','height':'75px'});
				}
			} else if (dropId == 3){
				if (toHeight == "94px"){
					$("list" + dropId).morph({'width':'0px','height':'0px'});
				} else {
					$("list" + dropId).morph({'width':'228px','height':'230px'});
				}
			}
			
		}
	});
	
	customMorph.start({'height':toHeight});
		
}

function loopObjectives(){
	if (currentObjective == 7){
		var nextObjective = 1;
	} else {
		var nextObjective = currentObjective + 1;
	}
	
	//get the current element and fade it out
	var objectElement = $(currentObjective+'');
	var objectMorph = new Fx.Morph(objectElement.parentNode.parentNode, {
		onComplete:function(){
			
			// now swith the content to show the next objective and move it back in
			objectElement.setStyle('display','none');
			$(nextObjective+"").setStyle('display','block');
			
			objectElement.parentNode.parentNode.morph({'width':'228px','opacity':'1'});
		}
   	});
	
	objectMorph.start({'width':'0px','opacity':'0'});
	if (currentObjective == 7){
		currentObjective = 1;
	} else {
		currentObjective = parseInt(currentObjective) + 1;
	}
}