var Gates = Class.create();

Gates.prototype = {

	items :null,
	current: 0,
	prev_button: null,
	next_button: null,

	initialize: function(selector, prev, next) {
		this.items = $('header').getElementsBySelector(selector);
		setInterval(this.rotate.bind(this), 20000);

		if(next && prev) {
			this.next_button = $(next);
			this.prev_button = $(prev);

			this.next_button.observe('click', function() { this.next() }.bind(this) );
			this.prev_button.observe('click', function() { this.prev() }.bind(this) );
		}
	},

	rotate: function() {
		this.next();
		this.show();
	},

	next: function() {
		if(this.current < this.items.length-1) {
			this.current++;
		} else {
			this.current = 0;
		}

		this.show();
	},

	prev: function() {
		if(this.current == 0) {
			this.current = this.items.length-1;
		} else {
			this.current--;
		}

		this.show();
	},

	show: function() {
		this.items.each(function(item, index) {
			if(index == this.current) {
				item.setStyle({display: 'block'});
			} else {
				item.setStyle({display: 'none'});
			}
		}.bind(this));
	}
}

Event.observe(window, 'load', function() { new Gates('.top_bar .gates img') });
Event.observe(window, 'load', function() { new Gates('.top_bar .gallery img', 'g_prev', 'g_next') });