// JavaScript Document

var ElementSlideShow = Class.create();

ElementSlideShow.prototype = {
  initialize: function( container_element, slides_container, slide_element, direction_container, number_element, back_button_element, forward_button_element ) {
   	this.items = $( slides_container ).select( slide_element ).toArray();
		this.slidenumbers = new Array();
		if (direction_container) {
   		this.slidenumbers = $( direction_container ).select( number_element ).toArray();
		}
		
		this.current = 0;
		
		this.items.each(function(slide, i) {
			if (i == this.current) {
				slide.show();
				this.slidenumbers[i].addClassName('on');
			} else {
				slide.hide();
				this.slidenumbers[i].removeClassName('on');
			}
		}.bind(this));
		
		this.el = this.items[this.current];
		this.numel = this.slidenumbers[this.current];
		
  	this.back_button_element = back_button_element;
  	this.forward_button_element = forward_button_element;

  	this.observeBackButton();
  	this.observeForwardButton();
		if (this.slidenumbers.length > 0) {
			this.observeNumbers();
		}
		this.startLoop();
  },
	
  observeBackButton: function() {
  	Event.observe( this.back_button_element, 'click', this.moveBack.bindAsEventListener(this));
  },
	
  observeForwardButton: function() {
  	Event.observe( this.forward_button_element, 'click', this.moveForward.bindAsEventListener(this));
  },
	
  observeNumbers: function() {
		this.slidenumbers.each(function(num, i) {
			Event.observe( num, 'click', function() { this.moveToNumber(i); }.bind(this));
		}.bind(this));
  },
	
  moveBack: function() {
		var next = this.current - 1;
		if (next < 0) next = this.items.length-1;
		this.moveToNumber(next);
	},
  
  moveForward: function() {
		var next = this.current +1 ;
		if (next == this.items.length) next = 0;
		this.moveToNumber(next);
  },
	
	moveToNumber: function(num) {
		if (num == this.current) return;
		new Effect.Fade(this.el);
		this.el = this.items[num];
		new Effect.Appear(this.el);
		this.numel.removeClassName('on');
		this.numel = this.slidenumbers[num];
		this.numel.addClassName('on');
		this.current = num;
		this.resetLoop();
	},
	
	resetLoop: function() {
		if (this.loopStarted == true) {
			this.loop.stop();
		}
		this.startLoop();
	},
	
	startLoop: function() {
		this.loop = new PeriodicalExecuter(this.moveForward.bindAsEventListener(this), 7);
		this.loopStarted = true;
	}
	
}
Event.observe(window, 'load', function() {
	new ElementSlideShow( 'slideshow', 'slides', 'li', 'slideshow-direction', 'li', 'prev', 'next' );
});