var ElsWitte = new Class({
	initialize: function() {
		this.initResize();
		this.initRowSizes();
		this.initXHR();
		
		var display = null;
		$('menu').getElements('a').each(function(oEl) {
			var show = false;
			if(oEl.get('href').contains("/producten/") && document.location.pathname.contains("/producten")) {
				show = true;
			}
			if(oEl.get('href') == document.location.pathname || show) {
				var elements = oEl.getParent('.elements');
				$('menu').getElements('.elements').each(function(oElements, nIndex) {
					if(oElements == elements) {
						display = nIndex;
					}
				});
			}
		});
		
		this.slide_x = 0;
		this.background_image_index = 0;
		window.addEvent("load", this.onLoad.bind(this));
		this.fx = new Fx.ApolloAccordion($$('.toggler'), $$('.elements'), {
			alwaysHide:true
			,display:display
			,initialDisplayFx: false
			,returnHeightToAuto:false
			,onActive:function(oToggler, oElement) {
				oToggler.getParent("li").addClass("open");
			}
			,onBackground: function(oToggler, oElement) {
				oToggler.getParent("li").removeClass("open");
			}
			,fixedElementHeight:30
		});
		$('menu').addClass(Browser.Engine.name);
		
		// set sizes of the anchors in the menu, so they can get 
		// a shadow in IE
		if(Browser.Engine.name == "trident") {
			var els = $('menu').getElements('a');
			els.combine($('menu').getElements('.parent_node'));
			els.each(function(oEl) {
				oEl.setStyles({
					'width': oEl.getSize().x +"px"
					,'display':'block'
					,'margin':'0px'
				});
			});
			$('menu').getElements('li').each(function(oEl) {
				oEl.setStyles({
					'margin':'0px'
					,'margin-bottom':'-3px'
				});
			});
		}
	}
	// some menu items use xhr.
	,initXHR: function() {
		var me = this;
		$('menu_producten').addClass('xhr');
		$('menu').getElements('.xhr').addEvent('click',function(oEv) {
			//oEv.stop();
			var url = this.getElement('a').get('href');
			if(this.get('id') == "menu_producten")
				url = "/producten";
			if(url == me.last_fetched_url) {
				return;
			}
			me.last_fetched_url = url;
			var req = new Request({
				url:url
				,onComplete:function(sResult) {
					$('page').set('html',sResult);
				}
			}).send();
		});
	}
	
	,toggleSelectedMenuItem : function() {
		$('menu').getElements('a').each(function(oEl) {
			if(oEl.get('href') == document.location.pathname) {
				var elements = oEl.getParent('.elements');
				$('menu').getElements('.elements').each(function(oElements, nIndex) {
					if(oElements == elements) 
						oElements.getParent('li').getElement('.toggler').fireEvent('click');
				});
			}
		});
	}
	
	,initRowSizes: function() {
		$$('.row').each(function(oEl) {
			oEl.setStyle('opacity','0.96');
			var cols = $$('.column');
			if(cols && cols.length > 0) {
				oEl.setStyle('width', (cols.length * 350)  +"px");
			}
			
		});
	}
	
	,setBackgroundImageIndex: function(iIndex) {
		Cookie.write("bg_index", iIndex);
		this.background_img_index = iIndex;
	}
	
	,onLoad: function() {
		// We remember the last shown background image, see iniBackgroundSlideShow
		var bg_img_index = Cookie.read("bg_index");
		if(!bg_img_index) 
			bg_img_index = 0;
		else 
			bg_img_index++; // start at the next one.
		this.background_img_index = bg_img_index;
		
		$('background_images').getElements('img')
		this.initBackgroundSlideshow();
		this.resize();
		this.resize();
		var me = this;
		var next_image = function() {
			me.nextImage();
			setTimeout(next_image, 3500);
		}
		setTimeout(next_image, 3500);
	}
	
	,initResize:function() {
		var me = this;
		window.addEvent('resize',function() {
			me.resize();		
		});
	}

	,initBackgroundSlideshow: function() {
		// collect all background images.
		$('background_images').setStyle('left','0');
		this.background_images = new Array();
		var me = this;
		$('background_images').getElements('img').each(function(oImg){
			me.background_images.push(oImg);
		});
		
		// here we pop the first couple of background images until we reach
		// the last seen one. We shuffle the deck a bit.
		if(this.background_img_index != 0) {
			for(var i = 0; i <= this.background_img_index; ++i) {
				var front = this.background_images.shift();
				this.background_images.push(front);
			}	
		}
		this.resize();
		this.positionBackgroundImages();
	}
	
	// when one has a horizontal scrollbar in chrome, the viewport height is incorrect.
	,positionBackgroundImages:function() {
		var pos_x = 0;
		if(!this.background_images) {
			return;
		}
		var count = 0;
		var total = this.background_images.length;
		this.background_images.each(function(oImg) {
			if(!oImg) return;
			oImg.setStyles({
				 "top":"0px"
				,"left":"0px"
				,"display":"none"
				,"z-index":(total-count)
			});
			count++;
		});
		
		this.background_images[0].setStyle('display','block');
		this.background_images[1].setStyle('display','block');
		this.resize();
	}
	,nextImage:function() {
		this.resize();
		var curr_img = this.background_images[0];
		var me = this;
		curr_img.set('tween', {
			duration:1000
			,fps:45
			,onComplete:function() {
				me.setBackgroundImageIndex((parseInt(me.background_img_index)+1) % me.background_images.length); 
				var front = me.background_images.shift();
				me.background_images.push(front);
				me.positionBackgroundImages(document.getSize());
				
				// hide all underlaying images.
				for(var i = 2; i < me.background_images.length; ++i){
					me.background_images[i].setStyle('display','none');
				}
				me.background_images[1].setStyles({'display':'block', 'opacity':1});
			}
		});
		curr_img.tween('opacity','0');
		}
	
	,resize: function() {
		var s = document.getSize();
		if(document.getScrollWidth() > s.x) {
			s.x = document.getScrollWidth();
		}
		if(document.getScrollHeight() > s.y) 
			s.y = document.getScrollHeight();
		
		// When the width of your browser is smaller than the width in the
		// content, webkit based browsers add a horizontal scrollbar causing
		// the height to become 15 pixels less. Therefore when you set the 
		// height of the content to the viewport height, you'll automatically
		// get a vertical scrollbar. 
		if(Browser.Engine.webkit && document.getElement('body').getStyle('overflow') != "hidden") {
			s.y -= 15;
		}
		$('site').setStyles( {
			"width":s.x +"px"
			,"height":s.y +"px"
		});
		this.resizeBackgroundImages(s);
	}
	,resizeBackgroundImages: function(oSize) {
		this.background_images.each(function(oImg) {
			if(!oImg) return;
			oImg.setStyles({
				"width":oSize.x +"px"
				,"height":oSize.y +"px"
			});
		});
	}
});


window.addEvent('domready',function() {
	var els = new ElsWitte();	
});