PhotoSlider = Class.create();

PhotoSlider.prototype = ({ 
	initialize: function(element) { 
		this.element = $(element);
		this.slider = this.element;
		this.width = this.slider.down('div.frame').getWidth();
		this.expand = this.slider.down('div.expand');
		this.collection = this.slider.down('div.frame').down('ul').siblings();
		this.lastslide = this.collection.last().className;
		this.prev = $(element).down('div.prev').down('a');
		this.next = $(element).down('div.next').down('a');
		this.display = 1;
		this.initArrows();
		this.initEventHandlers();				
	},

	initArrows: function() {
		this.addOut(this.element.down('div.prev'));
		if (this.lastslide == 'slide_1') this.addOut(this.element.down('div.next'));
	},

	initEventHandlers: function() {
		this.handler = this.handleClick.bind(this);		
		$(this.prev).observe('click', this.handler);		
		$(this.next).observe('click', this.handler);						
	},
	
	handleClick: function(e) {
		var element = e.element();
		var actul = 'slide_' + 1;
		var position = 0; 
		
		if (element.up('div').hasClassName('prev')) {
			if (this.display != 1) {
				this.clearOut(element.up('div.prev'));
				this.clearOut(element.up('div.photoslider').down('div.next'));
				this.display -= 1;
				actul = 'slide_' + this.display;
				position += this.width;
			}
		} else {
			if (this.lastslide.gsub('slide_', '') > this.display) {
				this.clearOut(element.up('div.next'));
				this.clearOut(element.up('div.photoslider').down('div.prev'));
				this.display += 1;
				actul = 'slide_' + this.display;
				position -= this.width;				
			}
		}
		new Effect.Move (this.expand,{ x: position, y: 0, mode: 'relative', duration: 2.0});
		if (this.display == 1) this.addOut(element.up('div.prev'));
		if (this.display == this.lastslide.gsub('slide_', '')) this.addOut(element.up('div.next'));
		
	},
	
	addOut: function(e) {
		e.addClassName('out');
	},

	clearOut: function(e) {
		e.removeClassName('out');
	}
		
});

document.observe('dom:loaded', function() {
	$$('.photoslider').each(function(photoslider) {new PhotoSlider(photoslider); });
})