var Rotator = new Class(
{
    idleTime:        15000,
    container:       undefined,                  // jeweils letzter href aus loadContent(href)
    items:           [],
    autoRotate:      false,
    workInProgress:	 false,
    navigator:       undefined,
    mobileNavigator: undefined,					// MooSwipe Instanz
    timeIdle:        undefined,
    active:          undefined,
    absPosTop:		 undefined,
    absPosLeft:		 undefined,
    parentWidth:	 undefined,
    width:			 undefined,
    height:			 undefined,
    timer:			 undefined,
	autorotate:		 true,
	initRandom:		 false,

    initialize: function(el, timer, idleTime, autorotate, initRandom)
    {
		if (!el.hasClass('initialized'))
		{
			el.addClass('initialized');
			if (timer == undefined) var timer = new Timer();
	        if (idleTime != undefined) this.idleTime = idleTime;
			if (autorotate != undefined) this.autorotate = autorotate;
			if (initRandom != undefined) this.initRandom = initRandom;

	        this.container = el;
        	this.toAbsolutePosition();
//alert(0 + parseInt( Math.random() * this.items.length));
	        if (this.items.length > 1)              // nur, wenns was zu rotieren gibt
	        {
	            this.buildNavigation();
				if (this.initRandom) this.show(0 + parseInt( Math.random() * this.items.length ), true);
				if (this.autorotate)
				{
					this.startRotation();
					if (timer != undefined)
					{
						this.timer = timer;
						this.timer.register(this.showNext.bind(this));
					}
				}
	        }
		}
    },
    
    toAbsolutePosition: function ()
    {
        var items = this.container.getChildren('div');
    	var parentDimension = items[0].getParent().getComputedSize();
    	
    	this.parentWidth = parentDimension.totalWidth;
    	this.width = parentDimension.width;
    	this.height = parentDimension.height;
    	this.absPosTop = parentDimension.computedTop;
    	this.absPosLeft = parentDimension.computedLeft;
    	
    	items.each(function (el)
    	{
    		el.setStyles(
    		{
    			position: 'absolute',
    			width: this.width,
    			height: this.height
    		});
    		el.setPosition({x: this.absPosLeft, y: this.absPosTop});
    		this.items.push(el.dispose());
    	}, this);
    	
    	// erstes wieder einfügen
    	this.items[0].inject(this.container, 'top');
    },

    buildNavigation: function ()
    {
    	// Custom Browser Navigation
        var navigator = new Element('div', {
            'class': 'rotator-navigation'
        }).inject(this.container, 'top');

        var navUl = new Element('ul').inject(navigator);

        var tmpLi, tmpA;
        this.items.each(function (el, index)
        {
            tmpLi = new Element('li');
            tmpA = new Element('a').inject(tmpLi);
            tmpA.set('html', index + 1);
            tmpA.addEvent('click', this.navigatorClick.bind(this, index));
            tmpLi.inject(navUl, 'bottom');

            if (index == 0)
            {
                tmpA.addClass('active');
                this.active = index;
            }

        }, this);

        navUl.inject(navigator, 'top');
        this.navigator = navigator.getElements('a');
        
        // Mobile
        this.mobileNavigator = new MooSwipe(this.container, 
        {
        	tolerance: 50,
        	preventDefaults: true,
        	onSwipeLeft: this.swipeLeft.bind(this),
        	onSwipeRight:  this.swipeRight.bind(this)
        });
    },

    startRotation: function ()
    {
        this.autoRotate = true;
    },

    stopRotation: function ()
    {
        this.autoRotate = false;
        clearTimeout(this.timerIdle);
        this.timerIdle = this.startRotation.delay(this.idleTime, this);
    },

    navigatorClick: function (index)
    {
        this.stopRotation();
        this.show(index);
        return false;
    },

    swipeRight: function ()
    {
//alert('swipeRight');
        this.stopRotation();
        var show = (this.active > 0) ? this.active - 1 : undefined;
        if (show !== undefined) this.show(show);
        return false;
    },

    swipeLeft: function ()
    {
//alert('swipeLeft');
        this.stopRotation();
        var show = (this.active < (this.items.length - 1)) ? this.active + 1 : undefined;
        if (show !== undefined) this.show(show);
        return false;
    },

    showNext: function ()
    {
    	if (this.autoRotate)
    	{
            var show = (this.active < (this.items.length - 1)) ? this.active + 1 : 0;
            this.show(show, true);
    	}
    },

    // Implementieren in abgeleiteter Klasse für den gewünschten Effekt
    show: function (index, ignoreDirection)
    {}
});

var RotatorSlide = new Class(
{
    Extends: Rotator,
    show: function (index, ignoreDirection)
    {
//alert(index);
		if (!this.workInProgress && this.active != index)
		{
	        this.workInProgress = true;
	        this.navigator[this.active].removeClass('active');
	        
	        this.items[index].inject(this.items[this.active], 'after');
	        
	        if (index > this.active || ignoreDirection)
	        {
	        	var newPosActiveElement = -1 * this.parentWidth;
	        	this.items[index].setPosition({x: this.parentWidth, y: this.absPosTop});
	        }
	        else if (index < this.active)
	        {
	        	var newPosActiveElement = this.parentWidth;
	        	this.items[index].setPosition({x: -1 * this.parentWidth, y: this.absPosTop});
	        }

	        var slide = new Fx.Elements([this.items[this.active], this.items[index]],
	        {
	        	duration: 500,
	        	transition: Fx.Transitions.Expo.easeInOut,
	        	onComplete: function()
	        	{
	        		this.items[this.active].dispose();
		            this.active = index;
		            this.navigator[this.active].addClass('active');
		            this.workInProgress = false;
	        	}.bind(this)
	        });
	        
	        slide.start(
	        {
	        	'0': {left: newPosActiveElement},
	        	'1': {left: this.absPosLeft}
	        });
	        
	        return true;
		}
		else return false;
    }
});