function startCloseAnimation(width, height, name, isOtherDivOpen) {
	// hide content
	
	new Effect.Fade(name +'_txt', {duration: 0.1, queue: { position: 'front', scope: 'introScope'}});
	//Industrie can have more then 1 _txt

	if ($(name +'_txt2') != null){
		new Effect.Fade(name +'_txt2', {duration: 0.1, queue: { position: 'front', scope: 'introScope'}});
	}
	if ($(name +'_txt3') != null){
		new Effect.Fade(name +'_txt3', {duration: 0.1, queue: { position: 'front', scope: 'introScope'}});
	}
	
	new Effect.Fade(name +'_image', {duration: 0.1, queue: { position: 'front', scope: 'introScope'}});  
	new Effect.Fade(name +'_close', {duration: 0.1, queue: { position: 'front', scope: 'introScope'}});
	
	// start animation
	animation(width, height, name);
	
	// this prevents underlining divs to show to soon
	setTimeout(function() {continueCloseAnimation(name); }, 800);
	
	//EXCEPTION for retail because retail needs to move down before closing
	if (name == 'retail') {
		$('block_retail').style.zIndex=2;
		new Effect.Move('block_retail', { x: 200, y: 400, mode: 'absolute' });
	}
	
	if (name == 'duurzaamheid') {
		$('block_duurzaamheid').style.zIndex=2;
		new Effect.Move('block_duurzaamheid', { x: 600, y: 400, mode: 'absolute' });
	}
	
	if (isOtherDivOpen == null) {
		moveHorti('horti');
	}
}

function continueCloseAnimation(name) {	
	// move the title
	if (name == 'duurzaamheid') {
		new Effect.Move(name +'_title', { x: 10, y: 135, mode: 'absolute' });
	} else {
		new Effect.Move(name +'_title', { x: 10, y: 155, mode: 'absolute' });
	}
				
	// show layer
	$(name +'_link').style.display='block';
	
	// lower the z-Index to 1
	var closingDiv = $('block_'+ name);
	closingDiv.style.zIndex=1;
	
	// Clear the hidden input 
	$('expandedDiv').value = "";
	
	//needed for the setTimeout in startCloseAnimation
	return true;
}

function startOpen(width, height, name) {
	//moving horti 
	
	alert('hihaho double click');
	moveHorti(name);
	
}

function startOpenAnimation(width, height, name) {
	// hide layer
	$(name +'_link').style.display='none';
	
	var expandedDiv = $('expandedDiv');

	if (expandedDiv.getValue() != "") {
		startCloseAnimation(187,187, expandedDiv.getValue(), false);
		setTimeout(function() {continueStartOpenAnimation(width, height, name); }, 1000);
		setTimeout(function() {moveHorti(name); }, 300);
	} else {
		setTimeout(function() {continueStartOpenAnimation(width, height, name) }, 300);
		moveHorti(name);	
	}
}

function moveHorti(name) {
	
	if (name == "agf" || name == "profiel" ) {
		$('block_horti').style.zIndex=2;
		new Effect.Move('block_horti', { x: 400, y: 400, mode: 'absolute' });
	}
	if (name == "industrie" || name == "retail" || name == "duurzaamheid") {
		$('block_horti').style.zIndex=2;
		new Effect.Move('block_horti', { x: 400, y: 0, mode: 'absolute' });
	}
		
	if (name == "horti") {
		$('block_horti').style.zIndex=2;
		new Effect.Move('block_horti', { x: 400, y: 200, mode: 'absolute' });
	}
	return true;
}

function continueStartOpenAnimation(width, height, name) {
	
	// set the z-index of the div to 5
	var blockNameDiv = $('block_'+ name);
	blockNameDiv.style.zIndex=5;
	
	// start animation
	animation(width, height, name);
	
	//EXCEPTION for retail because retail needs to move up before opening
	if (name == 'retail') {
		$('block_retail').style.zIndex=2;
		new Effect.Move('block_retail', { x: 200, y: 200, mode: 'absolute' });
	}
	
	if (name == 'duurzaamheid') {
		$('block_duurzaamheid').style.zIndex=2;
		new Effect.Move('block_duurzaamheid', { x: 400, y: 200, mode: 'absolute' });
	}
	
	
	// set the name as value of expandedDiv
	$('expandedDiv').value = name;
	
	// move the title		
	new Effect.Move(name +'_title', { x: 12, y: 16, mode: 'absolute' });
	
	// show content

	new Effect.Appear(name +'_txt', {queue: 'end', duration: 0.2});
	new Effect.Appear(name +'_image', {queue: 'end' , duration: 0.2});  
	new Effect.Appear(name +'_close', {queue: 'end' , duration: 0.2});
	
	//EXCEPTION for industrie it can haz more then 1 _txt
	if ($(name +'_txt2') != null){
		new Effect.Appear(name +'_txt2', {queue: 'end', duration: 0.2});
	}
	if ($(name +'_txt3') != null){
		new Effect.Appear(name +'_txt3', {queue: 'end', duration: 0.2});
	}
	
	return true;
}

function animation(widthNew, heightNew, name) {
	// get current width and height
	var widthCurrent  = $('block_'+ name).getWidth();
	var heightCurrent = $('block_'+ name).getHeight();
	
	// scalars based on change from old to new
	var xScale = (widthNew  / widthCurrent)  * 100;
	var yScale = (heightNew / heightCurrent) * 100;
	
	// calculate size difference between new and old image, and resize if necessary
	var wDiff = widthCurrent - widthNew;
	var hDiff = heightCurrent - heightNew;
			
	if (hDiff != 0) {																												
		new Effect.Scale('block_'+ name, yScale, {scaleX: false, scaleContent: false, scaleFromCenter: false, duration: 0.6, transition: Effect.Transitions.sinoidal});	        
		new Effect.Scale(name +'_content', yScale, {scaleX: false, scaleContent: false, scaleFromCenter: false, duration: 0.6, transition: Effect.Transitions.sinoidal}); 			
	}
	
	if (wDiff != 0) {
		new Effect.Scale('block_'+ name, xScale, {scaleY: false, scaleContent: false, scaleFromCenter: false, duration: 0.6, delay: 0.2, transition: Effect.Transitions.sinoidal}); 
		new Effect.Scale(name +'_content', xScale, {scaleY: false, scaleContent: false, scaleFromCenter: false, duration: 0.6, delay: 0.2, transition: Effect.Transitions.sinoidal}); 			
	}
}

function fadeSplash() {
	new Effect.Fade('splash', { duration: 0.6 });
}

