window.addEvent('domready', function(){				
	

	
		// var id = knop.get('id').substr(14,3);
		// 	var knoppen = $$('.categorieknop');
		// 	var categorieen = $$('.categorie');
		// 	var categorie = $('categorie_' + id);
	
	$('homeknop').addEvents({
		'mouseenter' : function(){
						
		},
		'mouseleave' : function(){
			
		},
		'click' : function(){
			var knoppen = $$('.categorieknop');
			var categorieen = $$('.categorie');
			var actieveCategorie = $$('.navigatie li.actief');
			
			if(actieveCategorie){
			
				$$('.navigatie li.actief span.categorieachtergrond').each(function(restantKnop,k){
					var achtergrondmorph = new Fx.Morph(restantKnop,{
						duration: 400,
						link: 'cancel'
					});
					achtergrondmorph.start({
						'opacity' : [1,0]					
					});
				});
			
			
				$$('.navigatie li.actief span.categorielink').each(function(restantLink,l){
					var linkmorph = new Fx.Morph(restantLink,{
						duration: 400,
						link: 'cancel'
					});
					linkmorph.start({
						'color' : ['#2f44ac','#FFF']				
					});
					restantLink.getParent().removeClass('actief');
				});
			
				
				var actieve = $('contentblokcontainer').getElement('div.actief');

				if(actieve != null){
					var morph = new Fx.Morph(actieve,{
						duration: 200,
						link: 'cancel'
					});
					morph.start({
						'left' : ['0','441'],
						'opacity' : [1,0]
					});
					$$('.contentblok').removeClass('actief');
				}
				
			
				/*
				var status = knop.get('class').substr(14,7);
				if(status != 'actief'){
					link = knop.getElement('a');
					var linkmorph = new Fx.Morph(link,{
						duration: 800,
						transition: Fx.Transitions.Sine.easeOut
					});
					linkmorph.start({
						'color' : ['#FFF','#2f44ac']					
					});
			
					achtergrond = knop.getElement('span');
					var achtergrondmorph = new Fx.Morph(achtergrond,{
						duration: 1200,
						transition: Fx.Transitions.Sine.easeOut
					});
					achtergrondmorph.start({
						'opacity' : [0,1]					
					});
				}
				*/
			
			
				knoppen.removeClass('actief');
				knoppen.addClass('inactief');
			
				categorieen.removeClass('actief');
				categorieen.addClass('inactief');
			
				
				$$('.categorieen div.inactief').each(function(restantCategorie,r){
					var morph = new Fx.Morph(restantCategorie,{
						duration: 800,
						link: 'cancel'
					});
					morph.start({
						'top' : '-540px'
					});
				});
			
			
				
			
			}
			
		}
	});

	
	$$('.categorieknop').each(function(knop,i){
		
		var id = knop.get('id').substr(14,3);
		var knoppen = $$('.categorieknop');
		var categorieen = $$('.categorie');
		var categorie = $('categorie_' + id);

		knop.addEvents({
			'mouseenter' : function(){
				knop.addClass('hover');
			},
			'mouseleave' : function(){
				knop.removeClass('hover');
			},
			'click' : function(){

				$$('.navigatie li.actief span.categorieachtergrond').each(function(restantKnop,k){
					
					//alert(restantKnop.getParent().get('id') + ' - ' + knop.get('id'))
					
					if(restantKnop.getParent().get('id') != knop.get('id')){
						var achtergrondmorph = new Fx.Morph(restantKnop,{
							duration: 400,
							link: 'cancel'
						});
						achtergrondmorph.start({
							'opacity' : [1,0]					
						});
						//alert('ja')
					}else{
						//alert('nee')
					}
				});
				
				
				$$('.navigatie li.actief span.categorielink').each(function(restantLink,l){
					
					if(restantLink.getParent().get('id') != knop.get('id')){
						var linkmorph = new Fx.Morph(restantLink,{
							duration: 400,
							link: 'cancel'
						});
						linkmorph.start({
							'color' : ['#2f44ac','#FFF']				
						});
					}else{
					//	alert('nee')
					}
				});
				
				
				var actieve = $('contentblokcontainer').getElement('div.actief');
				if(actieve != null){
					var morph = new Fx.Morph(actieve,{
						duration: 200,
						link: 'cancel'
					});
					morph.start({
						'left' : ['0','441'],
						'opacity' : [1,0]
					});
					$$('.contentblok').removeClass('actief');
				}
				
				
				
				var status = knop.get('class').substr(14,7);
				if(status != 'actief'){
					link = knop.getElement('span.categorielink');
					var linkmorph = new Fx.Morph(link,{
						duration: 800,
						transition: Fx.Transitions.Sine.easeOut
					});
					linkmorph.start({
						'color' : ['#FFF','#2f44ac']					
					});
				
					achtergrond = knop.getElement('span.categorieachtergrond');
					var achtergrondmorph = new Fx.Morph(achtergrond,{
						duration: 1200,
						transition: Fx.Transitions.Sine.easeOut
					});
					achtergrondmorph.start({
						'opacity' : [0,1]					
					});
				}
				
				
				knoppen.removeClass('actief');
				knoppen.addClass('inactief');
				knop.addClass('actief');
				knop.removeClass('inactief');
				
				
				categorieen.removeClass('actief');
				categorieen.addClass('inactief');
				categorie.addClass('actief');
				categorie.removeClass('inactief');
				
				
				$$('.categorieen div.inactief').each(function(restantCategorie,r){
					var morph = new Fx.Morph(restantCategorie,{
						duration: 800,
						link: 'cancel'
					});
					morph.start({
						'top' : '-540px'
					});
				});
				
				
				var morph = new Fx.Morph(categorie,{
					duration: 600,
					link: 'cancel'
				});
				morph.start({
					'top' : '0'
				});
			}
		});

	});
	
	
	
	
	
	
	
	$$('.siteknop').each(function(knop,i){
		
		var k = i + 1;
		var categorie = $('categorie_' + k);

		var id = knop.get('id').substr(9,3);
		var contentblokken = $$('.contentblok');
		var contentblok = $('contentblok_' + id);
		
		// 		
		// 		contentblokken.removeClass('actief');
		// 		contentblokken.addClass('inactief');
		// 		contentblok.addClass('actief');
		// 		contentblok.removeClass('inactief');
		
		knop.addEvents({
			'mouseenter' : function(){
							
			},
			'mouseleave' : function(){
				
			},
			'click' : function(){
				
				var actieve = $('contentblokcontainer').getElement('div.actief');
				var status = contentblok.get('class').substr(12,8);
				
				if(actieve != null && status != 'actief'){
					var morph = new Fx.Morph(actieve,{
						duration: 300,
						link: 'cancel'
					});
					morph.start({
						'left' : ['0','441'],
						'opacity' : [1,0]
					});
				}
				
				
				if(status != 'actief'){
					var morph = new Fx.Morph(contentblok,{
						duration: 600,
						link: 'cancel'
					});
					morph.start({
						'left' : ['441','0'],
						'opacity' : [0,1]
					});
				}
				
				contentblokken.removeClass('actief');
				contentblok.addClass('actief');
				
				
			}
		});
	});
	


});