var Carousel = Class.create({
	initialize: function(id, auto) {
		// Setup vars
		this.moving = false;
		this.container = $(id);
		this.scroller = this.container.down('ul');
		this.paginator = this.container.up('div.module').down('ul.paginator');
		this.total_pages = this.paginator.childElements().length;
		this.current_page = parseInt(this.paginator.down('li.selected a').innerHTML);
		this.item_width = this.container.down('li').getWidth();
		// looks for "auto" in the params
		// if exists, thats the amount of seconds between auto paging
		// else, false, don't auto paginate
		this.autoPaginate = (auto != "" && auto != undefined && auto > 0) ? auto : false;
		this.timer;
		
		// Add events to paging buttons
		this.paginator.getElementsBySelector('a').invoke('observe', 'click', this.navigate.bind(this));
		
		// Prev/next
		this.buttons = this.container.up('div.module').down('ul.paginator-btns');
		this.buttons.down('a.prev').observe('click', this.back.bind(this));
		this.buttons.down('a.next').observe('click', this.forward.bind(this));
		
		//on load
		if (this.current_page != 1) {
			this.initialMove();
		} else {
		    this.automate();
		}
	},
	
	automate: function() {
	    if (this.autoPaginate) { 
	        var f_autoForward = this.autoForward.bind(this);
	        clearTimeout(this.timer);
	        this.timer = setTimeout( function() { f_autoForward(); }, 5000);
	    }
	},
	
	autoForward: function() {
	    new_position = this.current_page + 1;
	    if (new_position > this.total_pages) {
			new_position = 1;
		}
		this.move(this.current_page, new_position);
		this.update_page(false, new_position);
	},
	
	back: function(e) {
		Event.stop(e);
		new_position = this.current_page - 1;		
		if (new_position < 1) {
			new_position = this.total_pages;
		}
		clearTimeout(this.timer);
		this.autoPaginate = false;
		this.move(this.current_page, new_position);
		this.update_page(e, new_position);
	},
	
	forward: function(e) {
	    Event.stop(e);	    
		new_position = this.current_page + 1;		
		if (new_position > this.total_pages) {
			new_position = 1;
		}
		clearTimeout(this.timer);
		this.autoPaginate = false;
		this.move(this.current_page, new_position);
		this.update_page(e, new_position);
	},
	
	navigate: function(e) {
		Event.stop(e);
		var old_position = this.current_page;
		clearTimeout(this.timer);
		this.autoPaginate = false;
		this.update_page(e);
		this.move(old_position, this.current_page);
	},
	
	initialMove: function() {		
		this.move(1, this.current_page);
		this.automate();
	},
	
	move: function(origin, destination) {
		position = this.calculate_position(origin, destination);
		left = (origin - 1) * -this.item_width;
		left += (position * -1);
		
		new Effect.Move(this.scroller, { 
			x: left, 
			y: 0, 
			mode: 'absolute', 
			duration: 0.60, 
			transition: Effect.Transitions.sinoidal
		});
	},
	
	calculate_position: function(origin, destination) {
		return (destination - origin) * this.item_width;
	},
	
	update_page: function(e, position) {	
		var el;
		if (!e) {
		    el = $(this.paginator).select(".selected")[0].next() || $(this.paginator).firstDescendant();		    
	    } else {
	        el = Event.element(e);
	    }
		
		// Find new curret page
		this.current_page = (position == null) ? parseInt(el.innerHTML) : position;
		this.container.up('div.module').down('p.paginator-details span').innerHTML = this.current_page;
		
		// Add class to link
		this.paginator.getElementsBySelector('li').invoke('removeClassName', 'selected');
		
		if (position == null) {
			el.up().addClassName('selected');
		} else {
			this.paginator.getElementsBySelector('a').each(function(link) {
				if (parseInt(link.innerHTML) == position) {
					link.up().addClassName('selected');
				}
			});
		}
		
		this.automate();
	}
});

document.observe("dom:loaded", function() {
	new Carousel('home-slider', 6);
});