var $dom = YAHOO.util.Dom;
var $ = $dom.get;
var $class = $dom.getElementsByClassName;

var auto_scrollers = {
    init: function() {
	    this.scrollers = [];                                                                                                                                     
	    var containers = $class('scroll-container', 'div');
	    for(var i=0, item; item=containers[i]; i++) {
	        this.scrollers[i] = new Scroller(item)
	    }
    }
};


Scroller = function(scroll_container, speed, pause) {
    if (scroll_container) {
        this.init(scroll_container, speed, pause); 
    }
};

Scroller.prototype = {  
    init: function(scroll_container, speed, pause) {
        this.scroll_container = scroll_container;
        this.speed = speed || 1;
        this.pause = pause || 25;
        this.container = scroll_container;
        this.container_x = $dom.getX(this.container)
        var container_region = $dom.getRegion(this.container);
	    this.container_x_right = container_region['right'];
        
        this.scroller = $class('scroller', 'div', this.container)[0];
        this.scroller_x = $dom.getX(this.scroller);
        this.width = 0;
        this.next_x_position = this.container_x;
        this.pixels_since_last_move = 0;
        
        this.scroll_elements = []
        var dom_scroll_elements = $class('scroller-element', 'div',this.scroller);

        for(var i=0, item; item=dom_scroll_elements[i]; i++) {
	        $dom.setX(item, this.next_x_position);
	        $dom.setStyle(item, 'visibility', 'visible');
	        
	        var region = $dom.getRegion(item);
	        var item_width = region['right'] - region['left'];
	        this.width += item_width;
	        this.next_x_position += item_width
	        
	        this.scroll_elements[i] = {'el': item, 'width': item_width};
	    }
	    var scroller_region = $dom.getRegion(this.scroller);
	    var scroller_original_width = scroller_region['right'] - scroller_region['left'];
	    if (scroller_original_width > this.width) {
	        this.width = scroller_original_width;  
	    } else {
	        this.width += 100;
	    }
        $dom.setStyle(this.scroller, 'width', this.width);

        this.scroll();
    },
  
    scroll: function() {
        this.scroller_x = this.scroller_x - this.speed;
        $dom.setX(this.scroller, this.scroller_x)
        this.pixels_since_last_move += this.speed;
        
        var item_moved = false;
        for(var i=0, item; item=this.scroll_elements[i]; i++) {
    	    if ($dom.getX(item['el']) + item['width'] < this.container_x ) {
    	        this.moveToEnd(item, i, this.next_x_position - this.pixels_since_last_move, this.pixels_since_last_move);
    	        item_moved = true;
    	    }
    	    
  	    }
  	    if (item_moved) {
  	        this.pixels_since_last_move = 0;
  	    }
        var thisObj = this;
        setTimeout(function(){ thisObj.scroll() }, this.pause);
    },
	
    moveToEnd: function(item, scroll_elements_position, x, pixels_moved) {
        // In case the items are less than the width of the scroll area
        // we want to make sure they appear outside and scroll area instead of in the middl.
		if (x < this.container_x_right) {
		    x = this.container_x_right + this.speed;
		}
		this.width += pixels_moved;
		$dom.setStyle(this.scroller, 'width', this.width+'px');
	    $dom.setX(item['el'], x);
        this.next_x_position = x + item['width'];
    }
};
YAHOO.util.Event.addListener(window, 'load', auto_scrollers.init);
 