var cf = {
	
	nodes: [],
	contentNode: null,
	content: '',
	contentOverlayNode: null,
	itemCount: 0,
	currentItem: null,
	
	init: function() {
		// TODO: get starting condition
		this.itemCount = this.config.images.length;
		this.config.delay *= 1000;
		this.setupNodes();
		window.setTimeout("cf.fadeCycle()",this.config.delay);
	},
	
	setupNodes: function() {
		this.contentNode = $('kopfbild');
		this.contentNode.style.padding = '0';
		this.content = this.contentNode.innerHTML;
		this.contentNode.innerHTML = '';
		this.contentNode.style.position = 'relative';
		this.contentNode.style.height = this.config.containerHeight + 'px';
		var width = this.contentNode.style.width;
		
		for(var i = 0; i < this.itemCount; i++) {
			var ic = document.createElement('div');
			ic.id='imageContainer_'+i;
			ic.className='imageContainer';
			ic.style.height = this.config.containerHeight + 'px';
			
			// show first image
			if(i === 0) {
				ic.style.display = 'block';
				ic.style.zIndex = 2;
				this.currentItem = 0;
			}
			else {
				ic.style.display = 'none';
				ic.style.zIndex = 1;
			}

			this.contentNode.appendChild(ic);
			ic.style.backgroundImage = 'url('+this.config.images[i]+')';
			
			this.nodes.push($('imageContainer_'+i)); // add prototype extension
		}

		var on = document.createElement('div');
		on.innerHTML = this.content;
		on.id='contentOverlay';
		on.style.width = (this.contentNode.offsetWidth /* - 30 */ ) + 'px';
		//on.style.paddingLeft = on.style.paddingRight = '15px';
		this.contentNode.appendChild(on);
		this.contentOverlayNode = on;
	},
	
	fadeCycle: function() {
		var current = this.nodes[this.currentItem];
		var nextId = (this.currentItem + 1) == this.itemCount ? 0 : this.currentItem +1;
		var next = this.nodes[nextId];
		
		// set styles, if not done
		next.setStyle({opacity: 0, display: 'block'});
		
		// move next over current
		current.style.zIndex = 2;
		next.style.zIndex = 3;
		
		// move others below the two
		for(var i = 0; i < this.itemCount; i++) {
			if(i !== this.currentItem && i !== nextId ) {
				this.nodes[i].style.zIndex = 1;
			}
		}
		
		// fade in next
		next.appear({ duration: this.config.duration, from: 0.0, to: 1.0 });
		
		this.currentItem = nextId;
		window.setTimeout("cf.fadeCycle()",this.config.delay);
	}
};