// listeners

// iconSlider
var iconSlider  = new iconSlider();
var timer;
var animationActive;

function clearClassName(element) {
	element.className = '';
}

function setAnimationActive() {
	animationActive = true;
}

function setAnimationPassive() {
	animationActive = false;
}
function setHeight() {
	alert("hallo");
}
function collapseCase(s) {

	if(s.className !== 'active') {	
		setAnimationActive();
		// klap de rest van de elementen in en reset de classname
		var elements = $('portfolioOverview').select("li");
		elements.each(function(s) {
		
			if(s.className == 'active') {
			
				var des = s.select(".description");
				new Effect.BlindUp(des[0], { duration: 0.2,scaleMode:'contents' });
				//new Effect.Morph(des[0], {style: {display: 'block'},duration:0.3} );
				clearClassName.delay(0.2,s);
			}
			
		});
		
		s.className = 'active';
		
		var des = s.select(".description");
		
		//new Effect.Tween(des[0], '', 'description','className');
		
		new Effect.BlindDown(des[0], { duration: 0.2 });
		setAnimationPassive.delay(0.5);
	}
}

function addEventListeners() {
		
	
	// het submenu
	// - moet uitklappen bij mouse over
	if($('navigation1')) {
		var elements = $('navigation1').select("ul li");
		
		// verberg de subitems van de hoofditems
		var subElements =  $('navigation1').select("ul li ul");
		
		subElements.each(function(s) {
			s.style.display = 'none';
		});
			
		elements.each(function(s) {
		
			
				
			// mouseover listener
			s.observe('mouseover',function(event) {
				// laat de subelementen zien
				var subElements =  s.select("ul");
		
				subElements.each(function(s) {
					s.style.display = 'block';
				});
			});
			
			// mouseout listener
			s.observe('mouseout',function(event) {
				// verberg de subelementen
				var subElements =  s.select("ul");
		
				subElements.each(function(s) {
					s.style.display = 'none';
				});
			});
			
			
			
		});
		// end foreach
	} else {
		alert("Kan nav1 niet lezen");
	}
	// Maxdoro websites dropdown
	if($('navigation4')) {
		
		
		
		var elements = $('navigation4').select("ul li");
	
						
		elements.each(function(s) {
		
							
			// mouseover listener
			s.observe('mouseover',function(event) {
				// laat de subelementen zien
				
				var subElements =  s.select("ul");
		
				subElements.each(function(s) {
					s.style.display = 'block';
				});
			});
			
			// mouseout listener
			s.observe('mouseout',function(event) {
				// verberg de subelementen
				var subElements =  s.select("ul");
		
				subElements.each(function(s) {
					s.style.display = 'none';
				});
			});
			
			
			
		});
		// end foreach
	}
	
	
	if($('klantenOverview')) {
		
		// deze gastjes willen ook een super deluxe tooltip
		iconSlider.toolTipLeftMargin = 88;	
			
		var elements = $('klantenOverview').select(".klantItem");
		
		elements.each(function(s) {
			
			var iconDiv = s;
		
			var iconImage = s.select(".projectItemTooltipImage");
			var iconLogo = s.select(".projectItemLogo");
			var iconImageGrey = s.select(".projectItemTooltipImageGrey");
	
			var _iconTitle  = s.select(".projectItemTooltipTitle");
			var iconTitle = _iconTitle[0].innerHTML;
			
			var _iconText = s.select(".projectItemTooltipText");
			var iconText = _iconText[0].innerHTML;
			var _icon  = new Icon(iconDiv,iconImage[0],iconImageGrey[0],iconLogo[0],iconTitle,iconText,true);
			
			iconSlider.addIcon(_icon);
			
			// plaats nog een mooie mouseover die de image vervangt
			s.observe('mouseover',function(event) {
				// vervang de iconImageGrey met die van iconImage
				_icon.switchImage(iconImageGrey[0],1);			
			});
			
			s.observe('mouseout',function(event) {
				// verrvang de iconImageGrey miet die van iconImage
				_icon.switchImage(iconImageGrey[0],0);	
			});
			
		
		});
	
		//iconSlider.setAmount(5);
		iconSlider.initTooltip();
		
		
	}
	
	if($('portfolioOverview')) {
		
		$('ctl1').className = ''; // cleart de padding om het element
		
		var elements = $('portfolioOverview').select("li");
		
		
		
		elements.each(function(s) {
			
			
			
			// mouseover listener, dan class tranformeren naar actief..
			
			s.observe('mouseover',function(event) {
			
				if(!animationActive) {
					timer = collapseCase.delay(0.4,s);
				}
					
			});
			
			s.observe('mouseout',function(event) {
			
				if(timer) {
					clearTimeout(timer);				
				}	
			});
			
		
		}
	
		);
		
		// open randomly een van de eerste vier items
		var randomKey = Math.floor(Math.random()*4);
		var s = elements[randomKey];
		s.className = 'active';
		var des = s.select(".description");
		des[0].style.display = 'block';
		
	}
}


function hideElement(element) {

	element.style.display = 'none';

}

function showElement(element) {
	element.style.display = 'block';
}


function setClassName(element,className) {
	element.className = className;
}





function observeNextButton() {
	
	
	$('nextSliderLink').observe('click',function(event) {
	
		if($('nextSliderLink').className !== "disabled") {
			// de vorige button mag zichtbaar worden
			$('prevSliderLink').className = '';
		
			iconSlider.nextItems();
			// disable de knop voor een halve seconde
			 $('nextSliderLink').stopObserving();
			// en begin maar weer
			observeNextButton.delay(1.2);
		}
	});

}	

function observePrevButton() {

	$('prevSliderLink').observe('click',function(event) {
		if($('prevSliderLink').className !== "disabled") {
			// de volgende button mag zichtbaar worden
			$('nextSliderLink').className = '';
		
			iconSlider.prevItems();
			// disable de knop voor een halve seconde
			 $('prevSliderLink').stopObserving();
			// en begin maar weer
			observePrevButton.delay(1.2);
		}
	});

}	
	
function init() {
	
	
	addEventListeners();
			
	
	// lees de items uit de html, in stop ze in de iconSlider class

	if($('lastProjects')) {
	
		var elements = $('lastProjects').select(".projectItem");
		
		
		
		elements.each(function(s) {
			
			var iconDiv = s;
		
			var iconImage = s.select(".projectItemTooltipImage");
			var iconImageGrey = s.select(".projectItemTooltipImageGrey");
						
			var _iconTitle  = s.select(".projectItemTooltipTitle");
			var iconTitle = _iconTitle[0].innerHTML;
			
			var _iconText = s.select(".projectItemTooltipText");
		
			var iconText = _iconText[0].innerHTML;
			
			var iconLogo = s.select(".projectItemLogo");
						
			var _icon  = new Icon(iconDiv,iconImage[0],iconImageGrey[0],iconLogo[0],iconTitle,iconText,true);
			iconSlider.addIcon(_icon);
			
			// plaats nog een mooie mouseover die de image vervangt
			s.observe('mouseover',function(event) {
				// vervang de iconImageGrey met die van iconImage
				_icon.switchImage(iconImageGrey[0],1);			
			});
			
			s.observe('mouseout',function(event) {
				// verrvang de iconImageGrey miet die van iconImage
				_icon.switchImage(iconImageGrey[0],0);	
			});
			
		});
		
		
		
		iconSlider.slideIn();
		iconSlider.setAmount(5,elements.length);
		
		iconSlider.initTooltip();
		
		observeNextButton();
		observePrevButton();
		
		
		//interval = setInterval("iconSlider.nextItems('auto');", 6000);
		
		//interval = setInterval("iconSlider.nextItems('auto');", 600000);
	}
	
	// image thumbs bij portfolio geomaps
	if($('geoRollOver')) {
		var imgLoader = new imageLoader();
	}
	
}