
var MooToolsOfferRotator = new Class({
    Implements: Options,

    options: {
        activeSlide: 0	//initally opened tab
		, transitionDuration: 500	//duration in millisecond of  opening effect (1000ms = 1 sec)
		, transition: Fx.Transitions.Sine.easeOut	//effect's transitions. See http://docs.mootools.net/Fx/Fx.Transitions for more details
		, activeClassname: "selected" //classname for active item
		, firstClassname: "first" //classname for first item
		, lastClassname: "last" //classname for last item		
		, navigationTabsListItem: null //use of tabs to selct offer directly
		, useAutoPlay: true
		, isPaused: false
		, autoPlayDuration: 1000

    },

    initialize: function(panelClass, options) {
        this.setOptions(options);
        this.panelClass = panelClass;
        this.tabEffects = [];
        window.addEvent('domready', this.domready.bind(this));
    },


    domready: function() {
        this.morphElements = $$(this.panelClass);
        if (this.options.navigationTabsListItem != null) {
            this.tabElements = $(this.options.navigationTabsListItem).getElements('li');
            this.tabElements[this.options.activeSlide].addClass(this.options.activeClassname);

            for (var i = 0; i < this.tabElements.length; i++) {
                this.tabEffects[i] = new Fx.Morph(this.morphElements[i], { duration: this.options.transitionDuration, transition: this.options.transition });
                this.tabElements[i].addEvent('click', this.tabClicked.bind(this));

                if (i == 0)
                    this.tabElements[i].addClass(this.options.firstClassname);
                if (i == this.tabElements.length - 1)
                    this.tabElements[i].addClass(this.options.lastClassname);
                if (i != this.options.activeSlide)
                    this.morphElements[i].style.display = 'none';
            }
        } else {
            for (var i = 0; i < this.morphElements.length; i++) {
                this.tabEffects[i] = new Fx.Morph(this.morphElements[i], { duration: this.options.transitionDuration, transition: this.options.transition });
                this.morphElements[i].setStyle('position', 'absolute');
                if (i != this.options.activeSlide)
                    this.morphElements[i].setStyle('display', 'none');
            }
        }
        if ((this.options.useAutoPlay && !this.options.isPaused) || this.options.navigationTabsListItem == null) {
            this.slideIntervall = this.showNextSlide.periodical(this.options.autoPlayDuration, this);
        }


    },

    hideAll: function() {
        for (var i = 0; i < this.morphElements.length; i++) {
            this.tabEffects[i].cancel();
            this.tabEffects[i].set({ display: 'none' });
            if (this.options.navigationTabsListItem != null)
                this.tabElements[i].removeClass(this.options.activeClassname);
        }
    },

    tabClicked: function(event) {
        this.showSlide.bind(this, this.tabElements.indexOf(event.target));
    },

    showNextSlide: function() {
        if (this.options.activeSlide < this.morphElements.length - 1)
            this.showSlide(this.options.activeSlide + 1);
        else
            this.showSlide(0);
    },

    showSlide: function(slideToShow) {
        //console.log("showSlide"+this + slideToShow + this.options.navigationTabsListItem); //Firebug testing
        this.tabEffects[this.options.activeSlide].start({
            'opacity': [1, 0]
        });

        this.options.activeSlide = slideToShow;
        //this.hideAll();
        if (this.options.navigationTabsListItem != null)
            this.tabElements[this.options.activeSlide].addClass(this.options.activeClassname);
        this.tabEffects[this.options.activeSlide].start({
            'display': ['none', 'block'],
            'opacity': [0, 1]
        });
    }


});