var Coverflow = Class.create({
    initialize: function(id, options){
        //User Parameters
        this.btn_r = options.left || null;
        this.btn_l = options.right || null;
        this.elements = options.elements

        this.g = { id: id }   
        this.css = new Template('##{id} > img');
		
		this.show = options.show || 3;
		this.picwidth = (options.picwidth)?options.picwidth+"px":"auto";
		this.zoom = options.zoom || 1;
		this.globalWidth = $(this.g.id).getWidth();
		this.start = options.start || 0;
		this.timer = "";
		
		this.setup();
    },
	setup: function() {
		this.getShowArray();
		for(var i=0; i<this.show+2; i++) {
			var wert = Math.abs(this._calcPos(i));
			var width = parseInt(parseInt(this.picwidth) / Math.pow(this.zoom, (wert+1)));
			//alert(this.showarray[i].file);
            var img = new Element('img', {src: this.showarray[i].file }).setStyle({
                position: 'absolute',
                width: width + "px",
                background: 'transparent',
                left: this._calcLeft( this._calcPos(i) ) + "px",
				top: this._calcTop( this._calcPos(i) ) + "px"
            });
			img.observe('click', this.click.bind(this, this.showarray[i].link));
			img.observe('mouseover', this._hover.bind(this, this.showarray[i]) );
			img.observe('mouseout', this.mouseout.bind(this) );
			$(this.g.id).insert(img);
		}
		this.updateLogo();
	},
	click: function(link) {
//		alert (link);
		if (angemeldet) window.location.href = link; //nur wenn angemldet soll der Link funktionieren
	},
	_hover: function(index) {
		clearTimeout(this.timer);
//		if (index.schlagwoerter != "")
//		this.timer = setTimeout( this.hover.bind(this, index), 500);
	},
	hover: function(index) {
		new Tagcloud('tagcloud', index);
	},
	mouseout: function() {
		clearTimeout(this.timer);
	},
	_calcPos: function(index) {
		return index + 1 - ( parseInt( (this.show+2)/2 )+1 );
	},
	_calcLeft: function(pos) {
		var width = parseInt(parseInt(this.picwidth) / Math.pow(this.zoom, (Math.abs(pos)+1)));
		var abstand = this.globalWidth / this.show / (this.globalWidth/parseInt(this.picwidth)/2);
		var left = parseInt((this.globalWidth/2)-(width/2)) + (pos*abstand*(this.globalWidth/parseInt(this.picwidth)/2) );
		return left;
	},
	_calcTop: function(pos) {
		return Math.abs(pos*(parseInt(this.picwidth)-(parseInt(this.picwidth)/this.zoom)))/3 + 10;
	},
	_goto: function(direction) {
		var allimg = $$(this.css.evaluate(this.g));
		allimg.each( this._animate.bind(this, direction) );
		
		this.updateLogo(direction);
		
		setTimeout(this._getNewStart.bind(this,direction),1000);
		setTimeout(this.getShowArray.bind(this),1150);
		setTimeout(this.updatePics.bind(this,direction),1200);		
	},
	_getNewStart: function(direction) {
		var ret = (this.start + direction) % this.elements.length;
		if (ret < 0) ret = this.elements.length - 1;
		this.start = ret;
		return this.start;
	},
    _animate: function(direction, el, n){
        $(el).morph({
            left: this._calcLeft(this._calcPos(n - direction)) + "px",
            top: this._calcTop(this._calcPos(n - direction)) + "px",
			width: parseInt(parseInt(this.picwidth) / Math.pow(this.zoom, (Math.abs(this._calcPos(n-direction))+1))) + "px"
        }, {transition: Effect.Transitions.sinoidal, duration: 0.75});
    },
	getShowArray: function() {
		this.showarray = new Array();
		var string = "";
		for (var i = 0; i < this.show + 2; i++) {
			var index = (i+this.start) % (this.elements.length);
			this.showarray[i] = this.elements[index];
		}
		return this.showarray;
	},
	updateLogo: function(direction) {
		//Infologo START
		direction = direction || 0;
		var index = parseInt((this.show+2)/2) + direction;
		$$('#coverflow_wrapper .logo')[0].setStyle({backgroundPosition: '-8px '+(-4-(this.showarray[index].icon*28))+'px'});
		$$('#coverflow_wrapper .text')[0].update( this.showarray[index].name )
		//Infologo ENDE		
	},
	updatePics: function(direction) {
		if (direction == -1)     var index = $$(this.css.evaluate(this.g)).length - 1;
		else if (direction == 1) var index = 0;
		
		var img = $$(this.css.evaluate(this.g))[index];
		if (direction == -1) {
			img.src = this.showarray[0].file;
			img.stopObserving('click').observe('click', this.click.bind(this, this.showarray[0].link));
			img.stopObserving('mouseover').observe('mouseover', this._hover.bind(this, this.showarray[0]) );
			img.stopObserving('mouseout').observe('mouseout', this.mouseout.bind(this) );
			
			$(img).setStyle({
				left: this._calcLeft(this._calcPos(0)) + "px",
				top: this._calcTop(this._calcPos(0)) + "px",
				width: parseInt(parseInt(this.picwidth) / Math.pow(this.zoom, (Math.abs(this._calcPos(0)) + 1))) + "px",
				background: 'transparent'
			});
			$(this.g.id).insert({top: img});
		}
		else if (direction == 1) {
			img.src = this.showarray[this.showarray.length-1].file;
			img.stopObserving('click').observe('click', this.click.bind(this, this.showarray[this.showarray.length-1].link));
			img.stopObserving('mouseover').observe('mouseover', this._hover.bind(this, this.showarray[this.showarray.length-1]) );
			img.stopObserving('mouseout').observe('mouseout', this.mouseout.bind(this) );
			
			$(img).setStyle({
				left: this._calcLeft(this._calcPos(this.show+1)) + "px",
				top: this._calcTop(this._calcPos(this.show+1)) + "px",
				width: parseInt(parseInt(this.picwidth) / Math.pow(this.zoom, (Math.abs(this._calcPos(this.show+1)) + 1))) + "px"
			});
			$(this.g.id).insert({bottom: img});			
		}
		
	}

});