///////////////
// Klasse: Kiosk
// Author: Johannes Jarolim, j.jarolim@adwerba.at
// Benötigt prototype.js und erweiterte moo.fx.ma.js
///////////////

var Fader = Class.create();
Fader.prototype = {

	// Konstruktor
	initialize: function(params) {

		this.param = {
			boardid:		'board',		// id vom DIV der alle Teaser trägt
			teaserclass:	'teaser',		// Class von den Teasern
			fadetime:	    2000,			// Zeit für eine normale Überblendung in ms
			cmdfadetime:	300,			// Zeit für eine befohlene Überblendung in ms
			viewtime:		0,				// Zeit in ms, bis der nächste Teaser automatisch angezeigt wird (0 = kein autoscrolling)
			wakeuptime:		0,				// Zeit in ms, nach welcher das Autoscrolling wieder aktiviert wird, wenn es durch händisches Fading unterbrochen wurde
			transition:		fx.sinopow2,	// bewegungsfunktion
			direction:		'forward'		// Reihenfolge des fadings forward|backward|randomize
		}
		Object.extend(this.param, params || {});

		// Standardmässig mal kein automatisches scrollen
		this.wakeup = null;
		this.nextfade = null;
		this.fadeInProgress = false;

		// Jetzt mal alle DIV's holen, die gefaded werden sollen
		var board = $(this.param.boardid);
		this.teasers = document.getElementsByClassName(this.param.teaserclass, board);

		// Jetzt staffeln wir die teaser ordenlich per z-index,
		for (var i=this.teasers.length-2; i>=0; i--) {
			this.teasers[i].style.visibility = 'hidden';
			this.teasers[i].style.zIndex = 0;
		}

		// Jetzt bestimmen wir noch den Anfangspunkt
		this.currentImageIndex = this.teasers.length-1;

		// Das ist eigentlich schon alles - 
		// Wir können mit dem Faden beginnen
		if (this.teasers.length > 1 && this.param.viewtime > 0) {
			this.nextfade = setTimeout(this.fade.bind(this, null), this.param.viewtime);
		}
		
	},

	getNextImageIndex:function(direction) {
		if (!direction) direction = this.param.direction;
		var result;
		switch (direction) {
			case 'backward':
				if (this.currentImageIndex == (this.teasers.length - 1)) {
					result = 0;
				} else {
					result = this.currentImageIndex + 1;
				}
				break;
			case 'randomize':
				result = this.currentImageIndex + Math.floor(Math.random() * (this.teasers.length-1)) + 1;
				while (result >= this.teasers.length) { result -= this.teasers.length; }
				break;
			default:
			case 'forward':
				if (this.currentImageIndex == 0) {
					result = this.teasers.length-1
				} else {
					result = this.currentImageIndex - 1;
				}
				break;
		}
		return result;
	},

	next:function() {
		if (!this.fadeInProgress) {
			clearTimeout(this.nextfade);
			clearTimeout(this.wakeup);
			this.fade('forward');
			if (this.param.wakeuptime > 0) this.wakeup = setTimeout(this.fade.bind(this, null), this.param.wakeuptime);
		}
	},

	prev:function() {
		if (!this.fadeInProgress) {
			clearTimeout(this.nextfade);
			clearTimeout(this.wakeup);
			this.fade('backward');
			if (this.param.wakeuptime > 0) this.wakeup = setTimeout(this.fade.bind(this, null), this.param.wakeuptime);
		}
	},

	stop:function() {
		if (!this.fadeInProgress) {
			clearTimeout(this.nextfade);
			clearTimeout(this.wakeup);
		}
	},

	fade:function(directionCommand) {
		this.fadeInProgress = true;
		
		// Das nächste Bild herausfinden
		var nextImageIndex = this.getNextImageIndex(directionCommand);

		// Das derzeitige Bild auf den richtigen zIndex setzen
		this.teasers[this.currentImageIndex].style.zIndex = 2;
		this.teasers[this.currentImageIndex].style.visibility = 'visible';
		
		// Das nächste Bild auf den richtigen zIndex setzen und sichtbar machen
		this.teasers[nextImageIndex].style.zIndex = 1;
		this.teasers[nextImageIndex].style.visibility = 'visible';

		// Fader vorbereiten
		this.fadeEffect = new fx.Opacity(
			this.teasers[this.currentImageIndex], {
				duration:(directionCommand==null) ? this.param.fadetime : this.param.cmdfadetime,
				onComplete:this.afterFade.bind(this, nextImageIndex, (directionCommand==null) ? true : false)
			}
		);
		// Fader starten
		this.fadeEffect.custom(1,0);
	},

	afterFade:function(nextImageIndex, startNextFade) {
		// Das ausgeblendete Bild unsichtbar machen
		this.teasers[this.currentImageIndex].style.zIndex = 0;
		this.teasers[this.currentImageIndex].style.visibility = 'hidden';
		// Bei IE den Alpha-Filter manuell auf 100 setzen
		if (window.ActiveXObject) this.teasers[this.currentImageIndex].style.setAttribute('filter', 'alpha(opacity=100)', false);
		this.teasers[nextImageIndex].style.zIndex = 0;
		// und weiter geht es im wilden Reigen
		this.currentImageIndex = nextImageIndex;
		if (startNextFade) {
			if (this.param.fadetime > 0) 
				this.nextfade = setTimeout(this.fade.bind(this, null), this.param.viewtime)
		}
		this.fadeInProgress = false;
	},

	debug:function(text) {
		if ($('debug')) {
			var innerHTML = $('debug').innerHTML;
			$('debug').innerHTML = text + '<br>' + innerHTML;
		}
	}

}