var Ticker = new Class({
	setOptions: function(options) {
		 this.options = Object.extend({
		 delay: 30,
		 onComplete: Class.empty,
		 onStart: Class.empty
		 }, options || {});
	 }, 
	initialize: function(el,options){
		this.setOptions(options);
		this.el = $(el);
		this.items = this.el.getElements('li');
		this.itemLength = this.items.length;
		var w = 0;
		var h = 0;
		
		this.parentHeight = this.el.getParent().getHeight()

		w = this.el.getSize().x;
		this.items.each(function(li,index) {
			h += li.getSize().y;
		});
		
		this.height = h;
		
		if (this.height >= this.parentHeight) {
			this.items.clone().inject(this.el);
			this.items.clone().inject(this.el);
			h = h + h + h;
		}
		
		this.el.setStyles({
			'width': w,
			'height': h
		});
		
		if (this.height > this.parentHeight) {
			this.el.addEvents({
				mouseleave: function(){
					this.move();
				}.bind(this),
				mouseenter: function(){
					this.stop();
				}.bind(this)
			});
			
			this.move();
		}
	},
	
	frame: function() {			
		var h = 0;
		this.items.each(function(li,index) {
			h += li.getSize().y;
		});
		
		this.height = h;
		
		var t = this.el.getStyle('top').toInt() - 1;
		
		this.el.setStyle('top', t);
		
		if(t < -this.height)
			this.el.setStyle('top', 0);		

    },

	
	move: function() {
        // drives moving
        this.stop();
        this.moveTimer = (function() {
            this.frame();
        }).periodical(this.options.delay, this);
    },
	
	stop: function() {
        // stop moving.
        $clear(this.moveTimer);
    }

});

var mytimer = null;

window.addEvent('domready', function() {
	if($('brandsTicker'))
   		var hor = new Ticker('brandsTicker');
});