var Slidr = new Class({
        Implements: [Options, Events],
        options: {
            slidr: 'slidr',
            dura: 5
        },
    
    initialize: function(options) {
    	this.setOptions(options);
        /* ----------Config Vars----------- */
        this.slideTimer = this.options.dura * 1000;
        this.transitionTime = 1000;
        this.slidr = $(this.options.slidr);
        this.items = this.slidr.getElements('li.slidrArticle');
        this.prevBtn = this.slidr.getElements('.slidrPrev');
        this.nextBtn = this.slidr.getElements('.slidrNext');
        this.itemNum = 0;
        this.isPaused = 0;
        this.numItems  = this.items.length;
        /* --------end config vars-------- */
        this.init();
    },

    init: function() {
        var self = this;
        
        // Intialise
        this.items.each(function(element, index) {
            if (index == 0) {
                element.removeClass('first_item');
                //element.setStyle('left', "0");
                element.setStyle('opacity', 1);
            }
            else {
                //element.setStyle('left', "502px");
                element.setStyle('opacity', 0);
            }
        });

        // Next Btn
        this.nextBtn.addEvent('click', function() {
            if (self.isPaused == 0) {
                $clear(this.theTimer);
                self.theTimer = self.slideForward.periodical(self.slideTimer);
            }
            self.slideForward();
        });

        // Prev Btn
        this.prevBtn.addEvent('click', function() {
            if (self.isPaused == 0) {
                $clear(self.theTimer);
                self.theTimer = self.slideForward.periodical(self.slideTimer);
            }
            self.slideBackward();
        });
    
        // SlideForward Timer
        this.theTimer = this.slideForward.periodical(this.slideTimer, this);

        // Pause slidr on mouseenter
        this.slidr.addEvent('mouseenter', function() {
            self.isPaused = 1;
            $clear(self.theTimer);
        });

        // Restart on mouseleave
        this.slidr.addEvent('mouseleave', function() {
            self.isPaused = 0;
            self.theTimer = self.slideForward.periodical(self.slideTimer, self);
        });
        
    },

    // Slide Forward 
    slideForward: function() {
        var self = this;
        var curItem = this.items[self.itemNum];
        //change index
        if (this.itemNum < (this.numItems - 1)) {
            this.itemNum++;
        } else {
            this.itemNum = 0;
        }
        var newItem = this.items[self.itemNum];

        //curItem.getElements('.slidrContent').fade('out');

        var item_in = new Fx.Morph(newItem, {
            duration: this.transitionTime,
            transition: Fx.Transitions.Quad.easeInOut,
            wait: false
        }).start({'opacity': [0, 1]});

        var item_out = new Fx.Morph(curItem, {
            duration: this.transitionTime,
            transition: Fx.Transitions.Quad.easeInOut,
            wait: false
        }).start({'opacity': [0]});
    },

    // Slide Backward
    slideBackward: function() {
        var self = this;
        var curItem = this.items[self.itemNum];
        //change index for reverse movement
        if (this.itemNum > 0) {
            this.itemNum--;
        } else {
            this.itemNum = (this.numItems - 1);
        }
        var newItem = this.items[self.itemNum];
        
        //curItem.getElements('.slidrContent').fade('out');

        var item_in = new Fx.Morph(newItem, {
            duration: this.transitionTime,
            transition: Fx.Transitions.Quad.easeInOut,
            wait: false
        }).start({'opacity': [0, 1]});

        var item_out = new Fx.Morph(curItem, {
            duration: this.transitionTime,
            transition: Fx.Transitions.Quad.easeInOut,
            wait: false
        })
        item_out.start({'opacity': [0]});
    }
    
});