/**********************************************************************************
/
/				 Fade Skript V 4.0
/
/
/ 				Autor: Markus Breunig
/
/ 				Datum: 30.07.2009 | 10:11
/
/
!!! Anmerkung: Damit ein Text im IE ausgeblendet werden kann,
!!! muss diesem entweder widht, height oder position: absolute zugewiesen werden.
/
/ Erläuterung zu den Parametern
/ -----------------------------
/ new fadebox( imgobj, textobj, linkobj , param);
/ 	werden imgobj bzw. linkobj = "" gesetzt, dann werden keine Text bzw. Links ersetzt
/  - textobj: id eines Objekts in das sich der Text per innerHTML schreiben lässt
/  - imgobj: id eines <img> Objekts für die Bilder
/  - linkobj: id eines <a> Objekts um href zu ändern
/  - param: Parameter
/	# zwingende notwendige Parameter #
/	> imgdir: String, der auf das Verzeichnis der Bilder hinweist
/	> imgnames: Array mit den Dateinamen der Bilder
/
/	# müssen angegeben werden, wenn id für text bzw
/	> imgtexts: Array mit den Texten zu den Bildern
/	> imglinks: Array mit den Link-Adressen zu den Bildern
/
/	# nicht notwendige Parameter #
/	> startimg: Nummer des Bildes das als erstes angezeigt werden soll
/	            -1 bedeutet Zufallsbild (Dafault: -1)
/	> delay: Wartezeit in Sekunden, sobald das Bild angezeigt wurde (Default: 4)
/	> speed: Geschwindigkeit der Überblendung (Default: 5)
/	> rand: [true : false] gibt an ob die Bilder zufällig angezeigt werden sollen (sonst der Reihe nach)
/	> debug: [true : false] zeigt Fehlermeldungen als alert an (Default: false)
/	> stoponover: [true : false] stoppt das Ausblenden solange, wie sich die Maus über dem Link befindet
/					hier ist es sinnvoll, das der Link das Bild und den Text umfasst (Default: false)
/
/
/
Beispielaufruf:
----------------
var fdbox_1 = new fadebox('fd_img','fd_text','fd_a',{
         		imgdir: './fileadmin/content/thumbs/',
                         imgnames: ['t_00.jpg', 't_01.jpg', 't_02.jpg', 't_03.jpg', 't_04.jpg', 't_05.jpg', 't_06.jpg', 't_07.jpg', 't_08.jpg', 't_09.jpg'],
                         imgtexts: ['www.abc.org', 'www.abc.de', 'www.xfv.com', 'www.sss.de', 'www.kkf.com', 'www.vde.de', 'www.test.de', 'www.blu.at', 'fu', 'www.fa.de'],
                         imglinks: ['?id=68', '?id=60', '?id=63', '?id=64', '?id=63', '?id=61', '?id=65', '?id=67', '?id=49', '?id=66'],
                         startimg: -1,
                         delay:	4
                         speed:  5
                       });
***********************************************************************************/

var fadebox = function(obj_img, obj_txt, obj_a, param)
{
//Standardwerte setzen
         this.imgdir = 'null';
         this.imgnames = 'null';
         this.imgtexts = 'null';
         this.imglinks = 'null';
         this.startimg = -1;  //Nummer des Startbildes (-1 => random)
         this.delay = 4;
         this.speed = 5;
         this.rand = false;
         this.debug = false;
	this.stoponover = false;

//weitere Variablen definieren
	//switch für bilder und links
	this.change_text = (obj_txt != "");
	this.change_link = (obj_a != "");
	//Namen der Elemente
         this.n_txt = obj_txt;
         this.n_img = obj_img;
         this.n_link = obj_a;
	//Pointer auf HTML Elemente
	this.p_txt = new Object();
         this.p_img = new Object();
         this.p_link = new Object();
         //aktuelles Bild
         this.nr = "";
         //nächstes Bild
         this.next_pic = this.startimg;
         //Puffer für Bilder
         this.imgbuff = new Image();
         //Transparenzzähler
         this.opac = 100;
         //Richtung des Fadens
         this.dir = 1;
         //Delta pro Schritt
         this.delta = 0;
         //speichert, ob die Maus über der Diashow ist
         this.mouseisover = false;

//Parameter einlesen
         for(var i in param)
         	this[i]=param[i];

//eingelesene Werte überprüfen
	//prüfen ob Werte angegeben
	if(this.imgdir == 'null')
         	this.showerr('Kein Verzeichnis für Bilder gewählt!');
         if(this.imgnames == 'null')
         	this.showerr('Keine Namen für Bilder angegeben!');
         if((this.change_text) && (this.imgtexts == 'null'))
         	this.showerr('Keine Texte für Bilder angegeben!');
         if((this.change_link) && (this.imglinks == 'null'))
         	this.showerr('Keine Links für Bilder angegeben!');


         
         //prüfen ob Anzahl der Namen, Text und Links gleich sind
         if(  ((this.change_text) && (this.imgnames.length != this.imgtexts.length)) || ((this.change_link) && (this.imgtexts.length != this.imglinks.length))    )
	{
         	this.showerr('Anzahl der Bilder, Texte und Links stimmt nicht überein!');
         	return 0;
         }

         //prüfen ob numerische Werte im erlaubten Bereich liegen
         if(this.delay < 0)
         {
		this.showerr('Delay ('+this.delay+') liegt nicht im erlaubten Bereich!\nWird auf Standardwert (4) gesetzt.');
          	this.delay = 4;
         }
         if((this.speed <= 0) || (this.speed > 5))
         {
         	this.showerr('Speed ('+this.speed+') liegt nicht im erlaubten Bereich!\nWird auf Standardwert (5) gesetzt.');
          	this.speed = 5;
         }

         //prüfen ob Startbild existiert
         if(this.startimg < -1 || this.startimg >= this.imgnames.length)
         {
         	this.showerr('Startbild ('+this.startimg+') liegt nicht im erlaubten Bereich!\nWird auf Standardwert (-1 = random) gesetzt.');
         }

	//bei Debug am Anfang die Wertetabelle anzeigen
         if(this.debug)
         {
         	var info = 'Wertetabelle der Bilder:\n-------------------------\n\n';
                 info += "\tText\t\tBild\t\tLink\n"
		for( var i = 0; i < this.imgnames.length; i++)
                 	{
                 	info += "\n" + this.imgtexts[i] + "\t\t";
                         info += this.imgnames[i] + "\t\t";
                         info += this.imglinks[i];
                         }
                 alert(info);
         }

         //init erst starten, wenn Seite geladen
         var _self = this;
         if(window.addEventListener)  // Standard
                 window.addEventListener("load", function(){_self.init();}, false);
         else if(window.attachEvent)  // IE
		window.attachEvent('onload', function(){_self.init();});
};


fadebox.prototype.init = function(Event)
{
//prüfen ob Objekte existieren
         if(document.getElementById(this.n_img) == null)
         {
         	this.showerr('Objekt für Bild ('+this.n_img+') existiert nicht!\nBox kann nicht angezeigt werden.');
         }
         
         if((this.change_text) && (document.getElementById(this.n_txt) == null) )
         {
         	this.showerr('Objekt für Text ('+this.n_txt+') existiert nicht!\nBox kann nicht angezeigt werden.');
         }
           
         if((this.chnage_link) && (document.getElementById(this.n_link) == null)  )
         {
         	this.showerr('Objekt für Link ('+this.n_link+') existiert nicht!\nBox kann nicht angezeigt werden.');
         }

//Browserweiche
         this.ie = ((navigator.appVersion.indexOf("MSIE 5")>-1  && !window.opera) || (navigator.appVersion.indexOf("MSIE 6")>-1  && !window.opera) || (navigator.appVersion.indexOf("MSIE 7")>-1  && !window.opera)|| (navigator.appVersion.indexOf("MSIE 8")>-1  && !window.opera));

//Startwerte berechnen
	//je schneller, desto kleiner muss der Wert werden
         this.speed = 6 - this.speed;
	//Dauer beim ie halbieren (langsamere Darstellung)
	if(this.ie)
	{
			this.speed = this.speed / 2;
	}
	this.delta = (100 / (this.speed * 1000)) * 20;

         //Wenn Bild auf random, dann Wert bestimmen
         if(this.next_pic == -1)
         	this.next_pic = Math.floor((this.imgnames.length)*Math.random());

//Objektpointer auf Objekte setzen
         if(this.ie)
         {
         	 this.p_img = document.all[this.n_img];
                 if(this.change_text)
                 	this.p_txt = document.all[this.n_txt];
                 if(this.change_link)
                 	this.p_a = document.all[this.n_link];
                 //filter zuweisen um diese später zu ändern
                 if(this.change_text)
                 	this.p_txt.style.setAttribute("filter","alpha(opacity=100)");
                 this.p_img.style.setAttribute("filter","alpha(opacity=100)");
         }
         else
         {

                 //alert(document.getElementById(this.n_txt));
                 //alert(document.getElementById('fd_text'));
                 this.p_img = document.getElementById(this.n_img);
         	 if(this.change_text)
         	 	this.p_txt = document.getElementById(this.n_txt);
         	 if(this.change_link)
         	 	this.p_link = document.getElementById(this.n_link);
                 //opacity zuweisen
                 if(this.change_text)
                 	this.p_txt.style.opacity=100;
                 	
                 this.p_img.style.opacity=100;
         }

         //Erstes Bild vorladen
         this.buffnext(this.next_pic);

         //Objekt am Anfang gleich transparent setzen
	this.set_opac(this.opac);

         //erstes Bild setzen
         this.set_pic(this.next_pic);

	//wenn Stoppen bei Mouseover aktiviert, dann die Eventhandler zuweisen
         if(this.stoponover)
         {
         	var _self = this;
         	if(window.addEventListener)  // Standard
         	{
         		this.p_link.addEventListener("mouseover", function(){_self.set_mouseon(true);}, false);
         	        this.p_link.addEventListener("mouseout", function(){_self.set_mouseon(false);}, false);
		}
         	else if(window.attachEvent)  // IE
         	{
                        document.getElementById(this.n_link).attachEvent("onmouseover", function(){_self.set_mouseon(true);});
         	       document.getElementById(this.n_link).attachEvent("onmouseout", function(){_self.set_mouseon(false);});

                 }
	}

         //Fade starten
         var _self = this;
	setTimeout(function(){_self.fade();}, 2000); //etwas umständlich, damit der Zugriff funktioniert
};

fadebox.prototype.set_mouseon = function(event)
{
         this.mouseisover = event;
};

fadebox.prototype.fade = function()
{

         //Maus ist über dem Link und Bild nicht am einblenden
         if(this.mouseisover && this.dir == -1)
         {
                 //Bild voll sichtbar machen
                 this.set_opac(100);
                 //Transparenz auf voll setzen (sonst flackern, wenn man Bild verlässt)
                 this.opac = 100;
		//Funktion wieder aufrufen
                 var _self = this;
                 setTimeout(function(){_self.fade();},500);
         }
         //normaler Ablauf
         else
         {
         	if((this.opac <= 0 && this.dir == -1) || (this.opac >= 100 && this.dir == 1))
         		{
         			this.dir = this.dir * -1;
				if(this.dir == 1)
                 		{
                 			this.set_pic(this.nr);

                         		var _self = this;
					setTimeout(function(){_self.fade();}, 500); //etwas umständlich, damit der Zugriff funktioniert

                 		}
                 		else {
                         		var _self = this;
					setTimeout(function(){_self.fade();}, this.delay*1000); //etwas umständlich, damit der Zugriff funktioniert
                 		}

         		}
         		else
         		{
         			this.opac += (this.dir * this.delta);
                 		var _self = this;
                 		setTimeout(function(){_self.fade();},20);
                 		this.set_opac(this.opac);
         		}
         }

         return 0;
};


//Wenn debugging aktiviert, dann Fehler ausgeben
fadebox.prototype.showerr = function(msg)
{
	if(this.debug)
		alert('Im FADEBOX-Skript ist ein Fehler aufgetreten:\n\n'+msg);
};


//Transparenz aller Objekte setzen
fadebox.prototype.set_opac = function(opac)
{

	//für alle Browser testen und dann einsetzen
         if(this.ie)
         {
                 this.p_img.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity="+ opac + ");"; //IE
		if(this.change_text)
			this.p_txt.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity="+ opac + ");";
         }
         else if(this.p_img.style.opacity) //normale opacity
         {
         	this.p_img.style.opacity = opac / 100;
		if(this.change_text)
			this.p_txt.style.opacity = opac / 100;
         }
         else if(this.p_img.style.MozOpacity) //alter Mozilla (FF)
         {
		this.p_img.style.MozOpacity = opac / 100;
                 if(this.change_text)
			this.p_txt.style.MozOpacity = opac / 100;
         }
	else if(typeof this.p_img.style.KHTMLOpacity!="undefined") //Safari (alt)
         {
		this.p_img.style.KHTMLOpacity= opac / 100;
                 if(this.change_text)
			this.p_txt.style.KHTMLOpacity = opac / 100;
	}

         return 0;

};


//Text aus dem Array in Link und Linkadresse einsetzen
fadebox.prototype.set_text = function(nr)
{

         //this.p_txt.innerHTML = this.imgtexts[0]; //ist zwar richtig gibt jedoch Probleme im IE
         if(this.change_text)
         	this.p_txt.firstChild.data = this.imgtexts[nr];
         if(this.change_link)
         	this.p_link.href = this.imglinks[nr];

         this.p_img.src = this.get_imgdir(nr);

         return 0;
};


//naechstes Bild einsetzen und uebernaechstes Bild vorladen
fadebox.prototype.set_pic = function(nr)
{
        //ein Bild weiterstellen
        this.nr = this.next_pic;
        
        //Folgebild ermitteln
        if(this.rand)
        {
        	//zufälliges Bild
        	this.next_pic = a = Math.floor(this.imgnames.length*Math.random());    	
        }
        else
        {
    		 //folgendes Bild
		 if(this.nr + 1 < this.imgnames.length)
		 {
		         this.next_pic = this.nr + 1;
		 }
		 else
		 {
		 	 this.next_pic = 0;
		 }
	}
	
	//folgendes Bild puffern
	this.buffnext(this.next_pic);

         this.set_text(this.nr);

         return 0;

};

//Laedt das Bild mit für nr
fadebox.prototype.buffnext = function(nr)
{

                 this.imgbuff.src = this.get_imgdir(nr);

		return 0;
};

//gibt die Adresse des Bildes mit nr zurueck
fadebox.prototype.get_imgdir = function(nr)
{

         	return this.imgdir+this.imgnames[nr];
};