var voorpagina = {};

voorpagina.slider = function(){};

voorpagina.slider.prototype.config = {
	id: null,
	idObj: null,
	
	zIndex: 1000,
	itemCount: 0,
	itemObjs: [],
	itemCurrent: -1,
	itemNew: 0,
	
	width: 680,
	height: 240,
	
	ctBgColor: '#FFF',
	ctColor: '#333',
	ctOpacity: 80,
	ctHeight: 52,
	ctPaddingV: 4,
	ctPaddingH: 8,
	ctFontSize: 12,
	ctFont: 'Arial, Helvetica, sans-serif',
	
	animSteps: 60,
	animStep: 0,
	animInterval: 15,
	animPauze: 5000,
	animObj: null	
}

voorpagina.slider.prototype.init = function(idSlide) {
	if (!(idSlide  && /^[a-z0-9]+$/i.test(idSlide) && document.getElementById(idSlide)))
		return;
		
	this.config.id = idSlide;
	this.config.idObj = document.getElementById(idSlide);
	
	with (this.config.idObj.style) {
		width = this.config.width + 'px';
		height = this.config.height + 'px';
		overflow = 'hidden';
		position = 'relative';	
		fontFamily = this.config.ctFont;
		fontSize = this.config.ctFontSize + 'px';
		cursor = 'pointer';
		display = 'block';

	}
	
	var items = this.config.idObj.getElementsByTagName('div');
	for (var i = 0; i < items.length; i++)
	{
		var item = items[i];
		if (/sliderItem/i.test(item.className))
		{
			with(item.style)
			{
				width = this.config.width + 'px';
				height = this.config.height + 'px';
				overflow = 'hidden';
				position = 'absolute';
				left = '0px';
				top = '0px';
				color = this.config.ctColor;
				textDecoration = 'none';
				display = 'none';
				
				if (i == 0)
					zIndex = this.config.zIndex + 10;
				else
					zIndex = this.config.zIndex;		
			}
			this.config.itemObjs.push(item);	
		}
	}
	this.config.itemCount = this.config.itemObjs.length;
	
	
	for (var i = 0; i < this.config.itemCount; i++)
	{
		var item = this.config.itemObjs[i];
		
		var itemImg = item.getElementsByTagName('img')[0];
		with (itemImg.style)
		{
			position = 'absolute';
			left = '0px';
			top = '0px';
			width = this.config.width + 'px';
			height = this.config.height + 'px';
			border = '0px';
		}	
		
		var itemDivs = item.getElementsByTagName('div');
		for (var j = 0; j < itemDivs.length; j++)
		{
			var itemDiv = itemDivs[j];
			if (/sliderContent/i.test(itemDiv.className))
			{
				with (itemDiv.style)
				{
					width = this.config.width + 'px';
					height = this.config.ctHeight + 'px';
					position = 'absolute';
					left = '0px';
					bottom = -(this.config.ctHeight + this.config.ctPaddingV) + 'px';
				}
			}
			
			if (/sliderTekstAchtergrond/i.test(itemDiv.className))
			{
				_itemDiv = itemDiv;
				with (itemDiv.style)
				{
					width = (this.config.width - 2 * this.config.ctPaddingH) + 'px';
					height = (this.config.ctHeight - 2 * this.config.ctPaddingV) + 'px';
					padding = this.config.ctPaddingV + 'px ' + this.config.ctPaddingH + 'px';
					position = 'absolute';
					left = '0px';
					top = '0px';
					backgroundColor = this.config.ctBgColor;
					this.setOpacity(_itemDiv, this.config.ctOpacity);
				}
			}
			
			if (/sliderTekst/i.test(itemDiv.className))
			{
				with (itemDiv.style)
				{
					width = (this.config.width - 2 * this.config.ctPaddingH) + 'px';
					height = (this.config.ctHeight - 2 * this.config.ctPaddingV) + 'px';
					padding = this.config.ctPaddingV + 'px ' + this.config.ctPaddingH + 'px';
					position = 'absolute';
					left = '0px';
					top = '0px';
				}
			}
		}
	}
	
	var self = this;
	this.config.idObj['onclick'] = function() {
		if (self.config.itemCurrent >= 0)
		{
			var ahref = self.config.itemObjs[self.config.itemCurrent].getElementsByTagName('a')[0].href;
			window.location.href = ahref;
		}
	}
	
	this.animate();
}

voorpagina.slider.prototype.animate = function() {
	var self = this;
	if (this.config.animObj != null) {
		window.clearTimeout(this.config.animObj);
		this.config.animObj = null;	
	}
	
	this.config.animStep++;
	if (this.config.animStep > this.config.animSteps) {
		this.config.animStep = 0;
		this.wait();		
	}
	else {
		var opaNew = Math.ceil(100*Math.sin(Math.PI/2*this.config['animStep']/this.config.animSteps));
		var opaCurrent = 100 - opaNew;
		
		if (this.config.itemCurrent >= 0) {
			var item = this.config.itemObjs[this.config.itemCurrent];
			
			var itemImg = item.getElementsByTagName('img')[0];
			this.setOpacity(itemImg, opaCurrent);
			
			var ctCurrent = item.getElementsByTagName('div')[0];
			var halfSteps = Math.floor(this.config.animSteps / 2);
			if (this.config.animStep <= halfSteps) {
				var tmp = Math.PI/2 * this.config.animStep/halfSteps;
				ctCurrent.style.bottom = Math.ceil(-(this.config.ctHeight + 2 * this.config.ctPaddingH) * Math.sin(tmp)) + 'px';
			}
		}
		
		var item = this.config.itemObjs[this.config.itemNew];
		item.style.display = '';
			
		var itemImg = item.getElementsByTagName('img')[0];
		this.setOpacity(itemImg, opaNew);
		
		var ctNew = item.getElementsByTagName('div')[0];
		var halfSteps = Math.floor(this.config.animSteps / 2);
		if (this.config.animStep >= halfSteps) {
			var tmp = Math.PI/2 * (this.config.animStep - halfSteps)/halfSteps;	
			ctNew.style.bottom = Math.floor(-(this.config.ctHeight + 2 * this.config.ctPaddingH) * Math.cos(tmp)) + 'px';
		}
		
		this.config.animObj = window.setTimeout(function(){self.animate();},this.config['animInterval']);		
	}
}

voorpagina.slider.prototype.wait = function() {
	var self = this;
	if (this.config.animObj != null) {
		window.clearTimeout(this.config.animObj);
		this.config.animObj = null;	
	}
	
	this.config.itemCurrent = this.config.itemNew;
	
	this.config.itemNew++;
	if (this.config.itemNew >= this.config.itemCount)
		this.config.itemNew = 0;
		
	this.setZIndex();
		
	if (this.config.itemCount > 1)
		this.config.animObj = window.setTimeout(function(){self.animate();},this.config.animPauze);
}

voorpagina.slider.prototype.setZIndex = function() {
	for (var i = 0; i < this.config.itemCount; i++)
	{
		if (i == this.config.itemCurrent)
		{
			this.config.itemObjs[i].style.zIndex = this.config.zIndex + 10;	
		}
		else if (i == this.config.itemNew)
		{
			this.config.itemObjs[i].style.zIndex = this.config.zIndex;
		}
		else
		{
			this.config.itemObjs[i].style.display = 'none';
		}
	}
}

voorpagina.slider.prototype.setOpacity = function(object, opacity) {
	object.style.opacity = (opacity/100);
	object.style.MozOpacity = (opacity/100);
	object.style.KhtmlOpacity = (opacity/100);
	object.style.filter = "alpha(opacity="+opacity+")";
}
