//private
function rgb(r,g,b){ //color-Object
	this.r=r;
	this.g=g;
	this.b=b;
}



// FARB-REIHENFOLGE & DAZUGEHÖRIGE BILDER
	//orange	rgb(255,135,0)		img1	produkte_designglas_glass.jpg
	//grün		rgb(150,200,40)		img2	branchen_dichroic_architektur.jpg
	//blau		rgb(0,80,190)		img3	leistung_optische_filter.jpg
	//violett	rgb(140,0,85)		img4	technik_farbfilter_tauchbeschichtung.jpg
	//rot		rgb(195,5,10)		img5	unternehmen_prinz_optics_sol_gel_coating.jpg

var currentColor=0;  //zum Durchiterireren des Color-Arrays - welche Farbe ist gerade aktuell
var count=0; // zählt die Anzahl der Durchläufe während Änderung einer Farbe
var picOpacity=0; // opacitiy-wert der content-bilder
var pause = 3000; // ms die gewartet werden sollen, wenn eine Farbe/Bild durchgelaufen ist
var flag = false;


//public
function changeBackground(speed, steps){
	var intAktuelleSeite = getCategory(getCategoryString()); // Pfad der angezeigten html auslesen und checken welches Verzeichnis aktuell ist
	// 2dimensionales Array, das zu jeder Farbe das entsprechende Bild bereit stellt
	// kann erst nach onload-Event created werden, weil sonst die images noch nicht existieren
	// wird ja aber nur einmal gemacht

	arrBgContent = new Array();
	arrBgContent[0] = new Array();
	arrBgContent[0]['color'] = new rgb(255,135,0); //orange
	arrBgContent[0]['img'] = document.getElementById('img1');
	arrBgContent[1] = new Array();
	arrBgContent[1]['color'] = new rgb(130,180,20); //gruen
	arrBgContent[1]['img'] = document.getElementById('img2');
	arrBgContent[2] = new Array();
	arrBgContent[2]['color'] = new rgb(0,80,190); //blau
	arrBgContent[2]['img'] = document.getElementById('img3');
	arrBgContent[3] = new Array();
	arrBgContent[3]['color'] = new rgb(140,0,85); //violett
	arrBgContent[3]['img'] = document.getElementById('img4');
	arrBgContent[4] = new Array();
	arrBgContent[4]['color'] = new rgb(195,5,10); //rot
	arrBgContent[4]['img'] = document.getElementById('img5');


	var colorIndex = intAktuelleSeite;
	if (colorIndex < 0 || colorIndex > 4) colorIndex = 0; //falls der pfad undefined ist oder man im home verzeichnis ist, soll die startfarbe (orange) angezeigt werden
	
	if(intAktuelleSeite != 6){
		//das zur farbe passende Bild sichtbar machen:
		arrBgContent[colorIndex]['img'].style.display='block';
		arrBgContent[colorIndex]['img'].style.opacity = ''; //FF
		arrBgContent[colorIndex]['img'].style.filter=''; // IE
	
		//zunächst Body-Background-Color setzen, auf erste Farbe (hier Orange):
		document.body.style.backgroundColor='rgb('+arrBgContent[colorIndex]['color'].r+','+arrBgContent[colorIndex]['color'].g+','+arrBgContent[colorIndex]['color'].b+')';
		// global, enthält die Content-Divs, um auf sie zugreifen und ihre Farbe wechseln zu können:
		arrColoredContentBlocks = getElementsByClassName_inDiv('colored-content-block','content');
		//dann allen content-divs gleich die startfarbe zuweisen:
		for ( i=0; i<arrColoredContentBlocks.length;i++)
			arrColoredContentBlocks[i].style.backgroundColor='rgb('+arrBgContent[colorIndex]['color'].r+','+arrBgContent[colorIndex]['color'].g+','+arrBgContent[colorIndex]['color'].b+')';
	}
	if (intAktuelleSeite ==6){     //dieser Block nur für Sitemap
		
		arrBgContent[colorIndex]['img'].style.display='none';
		arrBgContent[colorIndex]['img'].style.opacity = ''; //FF
		arrBgContent[colorIndex]['img'].style.filter=''; // IE
		document.body.style.backgroundColor='rgb(70,70,70)';
		arrColoredContentBlocks = getElementsByClassName_inDiv('colored-content-block','content');
		for ( i=0; i<arrColoredContentBlocks.length;i++)
			arrColoredContentBlocks[i].style.backgroundColor='rgb(70,70,70)';
		//div id content hintergrundfarbe 59,59,59 zuweisen:
		document.getElementById('content').style.backgroundColor='rgb(59,59,59)';
		//und Punkte im content-bereich anzeigen:
		document.getElementById('content').style.backgroundImage='url(../../media/global/rasterpunkt.gif)';
	}
	
	if (typeof(objDock)== 'undefined') // animation soll nicht im cc-editiermodus laufen
		if ( intAktuelleSeite == 5 ) //nur auf home-Seite soll animation laufen
			changeColor(0,1,speed,steps);//einmalig starten, ruft sich rekursiv immer wieder auf
}

//private
function changeColor(intColorOld,intColorNew,speed,steps){
	diff_r = arrBgContent[intColorNew]['color'].r - arrBgContent[intColorOld]['color'].r;
	diff_g = arrBgContent[intColorNew]['color'].g - arrBgContent[intColorOld]['color'].g;
	diff_b = arrBgContent[intColorNew]['color'].b - arrBgContent[intColorOld]['color'].b;
	step_r = diff_r/steps;
	step_g = diff_g/steps;
	step_b = diff_b/steps;
	if(currentColor < arrBgContent.length-1)
		arrBgContent[currentColor]['img'].style.display="block";
	else
		arrBgContent[arrBgContent.length-1]['img'].style.display="block";
	setTimeout('bgColorChange('+arrBgContent[intColorOld]['color'].r+','+arrBgContent[intColorOld]['color'].g+','+arrBgContent[intColorOld]['color'].b+','+speed+','+steps+')',pause); //hier setTimeout um nach einem Farbdurchlauf/Bildwechsel pause-ms lang zu warten
}

//private
function bgColorChange(color_old_r,color_old_g,color_old_b,speed,steps){ //Objekt-Referenzen können offenbar nicht übergeben werden im setTimeout (?), deswegen werden die einzelnen Attribute von color_old übergeben
	//Hintergrundfarbe um einen "Step" verändern:
	document.body.style.backgroundColor='rgb('+Math.round(color_old_r-Math.abs(step_r))+','+Math.round(color_old_g-Math.abs(step_g))+','+Math.round(color_old_b-Math.abs(step_b))+')';
	//Hintergrundfarbe der Content-Divs um jeweils einen Step verändern:




	for (i =0;i<arrColoredContentBlocks.length;i++){
		arrColoredContentBlocks[i].style.backgroundColor = 'rgb('+Math.round(color_old_r-Math.abs(step_r))+','+Math.round(color_old_g-Math.abs(step_g))+','+Math.round(color_old_b-Math.abs(step_b))+')';
	}
	//Opacity-Wert der Bilder ändern:
	if(currentColor < arrBgContent.length-1){
		arrBgContent[currentColor]['img'].style.filter="alpha(opacity="+(100-picOpacity)+")"; // für IE
		arrBgContent[currentColor]['img'].style.opacity=1-(picOpacity*0.01);  // für FF
		arrBgContent[currentColor+1]['img'].style.display="block";
		arrBgContent[currentColor+1]['img'].style.filter="alpha(opacity="+picOpacity+")"; // für IE
		arrBgContent[currentColor+1]['img'].style.opacity=(picOpacity*0.01);  // für FF
	}
	else{
		arrBgContent[arrBgContent.length-1]['img'].style.filter="alpha(opacity="+(100-picOpacity)+")"; // für IE
		arrBgContent[arrBgContent.length-1]['img'].style.opacity=1-(picOpacity*0.01);  // für FF
		arrBgContent[0]['img'].style.display="block";
		arrBgContent[0]['img'].style.filter="alpha(opacity="+picOpacity+")"; // für IE
		arrBgContent[0]['img'].style.opacity=(picOpacity*0.01);  // für FF
		if (!flag) flag = true;
	}

	picOpacity += (100/steps);
	count++;
	if(count<steps){
		setTimeout('bgColorChange('+(color_old_r+step_r)+','+(color_old_g+step_g)+','+(color_old_b+step_b)+','+speed+','+steps+')',speed);
	}
	else{
	//volle Farbe erreicht und Bild voll gefadet, jetzt zur nächsten überblenden und bilder tauschen:
		 count=0;
		 picOpacity=0;
		 if (!flag){
		 	arrBgContent[currentColor]['img'].style.display="none";
		 	arrBgContent[currentColor]['img'].style.opacity=''; //FF
		 	arrBgContent[currentColor]['img'].style.filter="";""
		 	currentColor++;
		 }
		 else{
		 	flag = false;
		 	currentColor=0;
		 	arrBgContent[arrBgContent.length-1]['img'].style.display="none";
		 	arrBgContent[arrBgContent.length-1]['img'].style.opacity=''; //FF
		 	arrBgContent[arrBgContent.length-1]['img'].style.filter="";
		 }
		 if(currentColor < arrBgContent.length-1){
		 	changeColor(currentColor,(currentColor+1),speed,steps);
		 }
		 else{
	 		changeColor(arrBgContent.length-1,0,speed,steps);
	 	 }
	}
}