Mooquee = new Class({
    Implements: [Options],
 
    options: {
        element: 'mooquee',
        cssitem: 'mooquee_item',
        firstitem:0,
        trans:{'tin':'up', 'tout':'fade'}, //each transition is up, down, left, right, fade
        pause: 1, //seconds (keep pause equal or higher to duration to allow time for items to reset)
        duration: 1, //number of seconds to move marquee items
        overflow:'hidden', //if your item flows over how do you want to handle it. Auto(scroll) or Hidden work best...
        startOnLoad:true
    },
    initialize: function(options){
        this.setOptions(options);
        this.itemFXs = [];
		this.outDelay = 0;
		this.inDelay = 0;
        this.started = false;
        this.currentitem = this.options.firstitem;
        this.loop = true;
		if (typeof(this.options.trans) == "string") this.options.trans = {'tin':this.options.trans, 'tout':this.options.trans};
       
        window.addEvent('domready', function() {
            //get all mooqueeItems
            this.items = $$('#' + this.options.element + ' .' + this.options.cssitem);
            this.totalitems = this.items.length;
            if($(this.options.element).style.overflow != 'hidden')
                $(this.options.element).style.overflow = 'hidden';
            if($(this.options.element).style.position != 'relative')
                $(this.options.element).style.position = 'relative';
 
            this.setMooqueeFXs();
            this.setTrans(this.options.trans);// has setMooqueeItems in it
 
            if(this.options.startOnLoad)
                this.mooveAll.delay(this.options.pause*1000 ,this);
        }.bind(this));
       
       
    },
    setMooqueeItems: function(){
        this.resetting =true;
        var i=0;
       
        this.items.each(function (element){
            if($(element).style.position != 'absolute')
                $(element).style.position = 'absolute';
            $(element).style.width = $(this.options.element).clientWidth + 'px';
            $(element).style.overflow = this.options.overflow;
           
            if(i == this.currentitem)
            	this.itemFXs[i].set(this.resetStyle).set(this.inStyle);
            else
            	this.itemFXs[i].set(this.resetStyle).set(this.startStyle);
			
            i++;
        }.bind(this));
        this.resetting =false;
    },
    setMooqueeFXs: function(){
        var i=0;
        this.items.each(function (element){
            this.itemFXs[i] = new Fx.Morph(element,{duration:(this.options.duration*1000)});
            i++;
        }.bind(this));
    },
    mooveAll: function(){
 
        this.previousitem = this.currentitem;
       
        if((this.currentitem + 1) == this.totalitems)
            this.currentitem = 0;
        else
            this.currentitem = this.currentitem + 1;
        
        this.moove.delay(this.outDelay*this.options.duration*1000, this, this.previousitem);
        this.moove.delay(this.inDelay*this.options.duration*1000, this, this.currentitem);
 
    },
    moove: function(itemnumber){
        if(itemnumber == this.previousitem)
		{
            this.itemFXs[itemnumber].start(this.outStyle).chain(function(){
                if(!this.resetting)this.itemFXs[itemnumber].set(this.resetStyle).set(this.startStyle);
            }.bind(this));
		} else {
            this.itemFXs[itemnumber].start(this.inStyle).chain(function(){
                if(this.loop == true)
                    this.loopTimer = this.mooveAll.delay(this.options.pause*1000 ,this);
            }.bind(this));
		}
    },
    setTrans: function(newTrans){
		this.startStyle = {}
		this.inStyle = {};
		this.outStyle = {};
		this.resetStyle = {};
		this.inDelay = 0;
        switch(newTrans.tin){
                case 'up':
                    this.startStyle = {'top': $(this.options.element).clientHeight};
					this.inStyle = {'top': 0};
                break;
                case 'down':
                    this.startStyle = {'top': $(this.options.element).clientHeight * -1};
					this.inStyle = {'top': 0};
                break;
                case 'left':
                    this.startStyle = {'left': $(this.options.element).clientWidth};
					this.inStyle = {'left': 0};
                break;
                case 'right':
                    this.startStyle = {'left': $(this.options.element).clientWidth * -1};
					this.inStyle = {'left': 0};
                break;
                case 'fade':
                    this.startStyle = {'opacity': 0};
					this.inStyle = {'opacity': 1};
                break;
        }
        switch(newTrans.tout){
                case 'up':
					this.outStyle = {'top': $(this.options.element).clientHeight * -1};
                    this.resetStyle = {'top': 0};
                break;
                case 'down':
					this.outStyle = {'top': $(this.options.element).clientHeight};
                    this.resetStyle = {'top': 0};
                break;
                case 'left':
					this.outStyle = {'left': $(this.options.element).clientWidth * -1};
                    this.resetStyle = {'left': 0};
                break;
                case 'right':
					this.outStyle = {'left': $(this.options.element).clientWidth};
                    this.resetStyle = {'left': 0};
                break;
                case 'fade':
					this.outStyle = {'opacity': 0};
                    this.resetStyle = {'opacity': 1};
					this.inDelay = .5;
                break;
        }
        this.setMooqueeItems();
    }
});