var banner = {
	view: null,
	banners: [],
	interval: null,
	changeSeconds: 5,
	fadeSeconds: 2,
	init: function(){
		this.view = $("banner");
		// mehr als ein banner werden benötigt
		if(this.view.childElements().size()<2)
			return false;
		// banner init
		this.banners = this.view.childElements().each(function(e,i){
			e.observe("click",this.handleInterval.bind(this,"toggle"));
			e.hide();
		}.bind(this));
		// active banner
		this.banners.last().addClassName("active").show();
		// start interval
		this.handleInterval("start");
	},
	handleInterval: function(action,element){
		if(action=="start"){
			this.interval = window.setInterval(this.fadeImage.bind(this),this.changeSeconds*1000);
		} else if(action=="toggle"){
			this.handleInterval((this.interval==null)?"start":"stop");
		} else if(action=="stop"){
			window.clearInterval(this.interval);
			this.interval = null;
		}
	},
	fadeImage:function(){
		var active = this.view.down(".active");
		var fade = null;
		// next
		if(Object.isElement(active.next("div"))){
			fade = active.next("div");
			fade.appear({duration:this.fadeSeconds,afterFinish: function(){
				active.removeClassName("active").hide();
				fade.addClassName("active");
			}});
		// first
		} else {
			fade = this.banners.first().show();
			active.fade({duration:this.fadeSeconds,afterFinish: function(){
				active.removeClassName("active");
				fade.addClassName("active");
			}});
		}
	}
};
document.observe("dom:loaded",banner.init.bind(banner));