function Banners(elem){
	this.root=elem;
	this.banners=this.root.find('.banner');
	this.pages=$('<div class="promo_pages">');	
	this.links=null;
	this.timer=0;
	this.init();
}

Banners.prototype={
	init:function(){
	
		var me=this;
		
		if(this.banners.length >1){
			this.root.append(this.pages);
			this.banners.each(function(){
				var b=$(this);
				var i=$(this).index();
				$('<a class="circle" href="#'+i+'">'+(i+1)+'</a>').click(function(event){
					me.changeBan(i);
					clearInterval(me.timer);
					this.timer
					return false;
				}).appendTo(me.pages);
			})
			
			this.links=this.pages.find('a');
			this.links.eq(0).removeClass('circle');
			this.links.eq(0).addClass('active');
			
			this.timer=setInterval(function(){me.nextBan()}, 7000);
		}
	},
	
	changeBan:function(i){
		var me=this;
		me.banners.hide();
		me.links.removeClass('active');
		me.links.addClass('circle');
		me.links.eq(i).removeClass('circle');
		me.links.eq(i).addClass('active');
		me.banners.eq(i).fadeIn();
	},
	
	nextBan:function(){
		var a=this.pages.find('.active');
		var i=a.index()+1;		
		if(i>=this.links.size()){
			i=0;
		}		
		this.changeBan(i);
	}
}


$(function(){
	new Banners($('#banners'));
});