banner = {
	
	$slices: null,
	colors: new Array(),
	$banner: null,
	$scroller: null,
	visible: 0,
	$buttons: null,
	i_max: null,
	interval: null,
	
	init: function(){
		this.$banner = $('#fullbanner');
		this.$slices = this.$banner.find('a.slice');
		this.i_max = this.$slices.length - 1;
		this.$scroller = this.$banner.find('#scroller');
		this.$slices.each(function(){
			banner.colors.push(this.name);
		});
		var i = 0;
		this.$buttons = $('#buttons a');
		
		this.$buttons.bind('click',function(){
			clearInterval(banner.interval);
			banner.fade(this.i);
			return false;
		}).each(function(){
			this.i = i;
			i++;
		});
		this.timer();
	},
	
	fade: function(i) {
		if (i == banner.visible) return false;
		banner.rollButtons(i);
		return false;
	},
	
	rollButtons: function(i) {
		$(banner.$buttons[banner.visible]).animate({ backgroundPosition: "(0 0)" },150);
		$(banner.$buttons[i]).animate({ backgroundPosition: "(0 -72px)" },150,function(){
			banner.fadeTo(i);
		});
	},
	
	fadeTo: function(i) {
		$(banner.$slices[banner.visible]).fadeOut(150,function(){
			$(banner.$banner).animate({ backgroundColor: '#'+banner.colors[i] },200,function(){
				$(banner.$slices[i]).fadeIn(150);
				banner.visible = i;
			});
		});
	},
	
	timer: function() {
		banner.interval = setInterval(function() {
			if (banner.visible < banner.i_max) {
				var i = banner.visible + 1;
			} else {
				var i = 0;
			}
			banner.fade(i);
		},8000);
	}
};
$(function(){
	banner.init();
});
