//var init
var picarray = new Array();
var pickey = 0;
var mainchange = 1;
var intervalCounter = 0;
var fade=true;
		
var dur = 2000;
var counter = 1;
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//INIT
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
window.addEvent('domready', function(){
	if (Browser.Engine.name == "trident" && Browser.Engine.version < 5) {
		DD_belatedPNG.fix('.bg');
		$$('.subnav').each(function(item,key){
			// item.setStyles({
				// 'top':'40px'
			// })
		});
		if ($defined($('content'))) {
			$('content').setStyles({
				'width':400
			})
		}
	}
	if (aktivnav == 'home') {
		if ($defined($$('h1')[0])) {
			$$('h1')[0].setStyles({
				'color': '#FDC300'
			})
		}
		fontFade.periodical(dur);
	}
	if ($defined($('topnavi'))) {
		var topnaviWidth = $('topnavi').getStyle('width').toInt();
		$('topnavi').setStyles({
			'margin-left': -topnaviWidth / 2
		});
	}
	//spezielle BG-Bilder
	specPic = [40,41,42,47,48];
	if(specPic.contains(parseInt(id))){
		$('container').setStyle('background-image','url("'+root+'images/'+id+'.jpg")');
	}
	if(aktivnav == 0){
		new FX().showBoxes();
		new FX().fillBoxes();
		new FX().linkBoxes();
		if(id != 1)new FX().blendContent.delay(1000,this,'contentcontainerlife');
		
	}else{
		if(id != 1)new FX().blendContent.delay(1000,this,'contentcontainer');
	}
	if (aktivnav == 'home'){
		if (Browser.Engine.name == "trident" && Browser.Engine.version < 5) {
			for(i=1; i<5; i++){
				if ($defined($('boxcontent_' + i))) {
					$('boxcontent_' + i).setStyle('opacity', 1);
				}
			};
			new FX().linkBoxes();	
		}else{
			for(i=1; i<5; i++){
				if ($defined($('boxcontent_' + i))) {
					$('boxcontent_' + i).setStyle('opacity', 0);
				}
			};	
		}
	}
	if (id != 1){
		$(document.body).setStyle('overflow-y','auto');
	}
	new NAVI();
	//Mootools mit Array Shuffle Funktion erweitern
	Array.implement({
		shuffle: function() {
			for(var j, x, i = this.length; i; j = parseInt(Math.random() * i), x = this[--i], this[i] = this[j], this[j] = x);
			return this;
		}
	});
	if (id == 1 || id == 31 || id == 3 ) {
		$('header').setStyle('opacity',1);
		new FX().initfade();
		new FX().headern();
	}
	if ($defined($('topnavi_m'))) {
		$('topnavi_m').getChildren()[0].getChildren().each(function(item, key){
			item.addEvents({
				'mouseover': function(e){
					item.setStyles({
						'background': '#ffffff'
					});
					item.getChildren()[0].setStyles({
						'color': '#000000'
					});
				},
				'mouseleave': function(e){
					if (Browser.Engine.name == 'trident' && Browser.Engine.version < 6) {
						if (item.getAttribute('className') != 'active') {
							item.setStyles({
								'background': '#8CB0CC'
							});
							item.getChildren()[0].setStyles({
								'color': '#ffffff'
							});
						}
					}
					else {
						if (item.getAttribute('class') != 'active') {
							item.setStyles({
								'background': '#8CB0CC'
							});
							item.getChildren()[0].setStyles({
								'color': '#ffffff'
							});
						}
					}
				}
			});
			$$('.subholder').each(function(itm, ky){
				if ($defined($('subholder' + ky))) {
					$('subholder' + ky).getChildren().addEvents({
						'mouseover': function(e){
							if (key == ky) {
								item.setStyles({
									'background': '#ffffff'
								});
								item.getChildren()[0].setStyles({
									'color': '#000000'
								});
							}
						},
						'mouseleave': function(e){
							if (item.getAttribute('class') != 'active') {
								if (key == ky) {
									item.setStyles({
										'background': '#8CB0CC'
									});
									item.getChildren()[0].setStyles({
										'color': '#ffffff'
									});
									itm.setStyles({
										'color': '#000000'
									})
								}
							}
						}
					})
					
				}
			})
			$$('.nav').each(function(it, k){
			
				it.addEvents({
					'mouseover': function(e){
						it.setStyles({
							'color': '#0C5E99'
						})
					},
					'mouseleave': function(e){
						if (it.getParent().getAttribute('class') != 'aktivuunav') {
							it.setStyles({
								'color': '#000000'
							})
						}
					},
					'click': function(e){
						it.setStyles({
							'color': '#0C5E99'
						})
					}
				})
			})
		})
	}
});


function fontFade(){
	
	var col = counter % 2 == 0 ? '#FDC300' : '#0C5E99';
	
	me = $$('h1')[0];
	
	fadeClaimIn = new Fx.Morph(me, {
			duration: dur,
			transition: Fx.Transitions.Sine.easeInOut
		});
		fadeClaimIn.start({
			'color': col
		});
	
	counter++;
}
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//Navi Class
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var NAVI = new Class({
	initialize: function(){
		//SUBMENUDIVS SUCHEN
		var alldiv = $$('.subnav');
		alldiv.each(function(div,item,index) {
			div.addEvent('mouseenter',function(e) {
				this.showSub(div.id);
			}.bind(this));
			
			div.addEvent('mouseleave',function(e) {
				this.hideSub(div.id);
			}.bind(this));
		},this);
		//ALLEN MAINNAVS AKTION ZUORDNEN BEI OVER
		if ($defined($('topnavi_m'))) {
			var allmenu = $('topnavi_m').getElements('li');
			allmenu.each(function(li, item, index){
				var posi = li.getPosition().x ;
				li.addEvent('mouseenter', function(e){
					if ($defined($('subnav' + item))) {
						$('subnav' + item).setStyle('left', posi +1 + 'px');
						$('subnav' + item).setStyle('opacity', 1);
						$('subnav' + item).setStyle('display', 'block');
					}
				});
				//ALLEN MAINNAVS AKTION ZUORDNEN BEI LEAVE
				li.addEvent('mouseleave', function(e){
					if ($defined($('subnav' + item))) {
						$('subnav' + item).setStyle('opacity', 0);
						$('subnav' + item).setStyle('display', 'none');
					}
				});
			});
		}
	},
	showSub: function(subelement){
		var no = subelement.substr( subelement.length-1, 1);
		$(subelement).setStyle('opacity',1);
		$(subelement).setStyle('display','block');
	},
	hideSub: function(subelement){
		var no = subelement.substr( subelement.length-1, 1);
		$(subelement).setStyle('opacity',0);
		$(subelement).setStyle('display','none');
	}
});
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//FX CLASS // EFFEKTE, POPUPS, SCROLLBARS, ALLG. STEUER- UND EFFEKTFUNKTIONEN
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var FX = new Class({
	blendContent: function(cont){
		
		if($(cont)){
			$(cont).setStyle('opacity',0);
			$(cont).setStyle('display','block');
			
			mO2 = new Fx.Morph($(cont), {
				duration: 500
				,transition: Fx.Transitions.Sine.easeInOut
				,onComplete: function(){
					if(id != 1 && id != 31){
						new FX().initscrollbar();
						new FX().makeScrollbar(($$('.contentscroll')[0]), $('mTrack'), $('mThumb'));
					}
				}
			});
			mO2.start({
				'opacity':1
			});
		}
	},
	//Scrollbar erstellen
	makeScrollbar: function(content, scrollbar, handle, horizontal, ignoreMouse){
		var steps = (horizontal ? (content.getScrollSize().x - content.getSize().x) : (content.getScrollSize().y - content.getSize().y))
		if(steps>0){
			$('mThumb').setStyle('opacity', 1);
			$('mTrack').setStyle('opacity', 1);
		}else{
			$('mTrack').setStyle('opacity', 0);
			$('mThumb').setStyle('opacity', 0);
			return;
		}
		var slider = new Slider(scrollbar, handle,{
			steps: steps,
			mode: (horizontal?'horizontal':'vertical'),
			onChange: function(step){
				var x = (horizontal?step:0);
				y = (horizontal?0:step);
				content.scrollTo(x,y);
				if($defined($('pic1'))) reposDet();
			}
		}).set(0);
		if(!(ignoreMouse) ){
			$$(content, scrollbar).addEvent('mousewheel', function(e){
				e = new Event(e).stop();
				var step = slider.step - (e.wheel/2) * 30;
				slider.set(step);
			});
		}
	},
	initscrollbar: function(){
		if($defined($$('.contentscroll')[0])) trckheight = $$('.contentscroll')[0].getSize().y-30;
		trck = new Element('div',{
			'id':'mTrack'
			 ,'styles':{'display': 'block','top': 202,'height': trckheight,'right': 84,'background-color': '#7c7a78','width': 1,'float': 'left','z-index':999,'position': 'absolute','opacity':0}
		}).injectInside($('container'));
		thmb = new Element('div',{
			'id':'mThumb'
			 ,'styles':{'display': 'block','cursor': 'pointer','background-color': '#7c7a78','height': 20,'left': -2,'width': 5,'float': 'left','position': 'absolute'}
		}).inject(trck);
	},
	//Bildwechsel initialisieren
	initfade: function(){
		//Bilder generieren
		var pic1 = new Element('img', {
			'id' : 'pic1'
			,'src' : root+'images/0.gif'
			,'height':639
			,'width':960
			,'styles': {
				'position' : 'absolute'
				,'z-index' : 1
			}
		}).injectInside($('container'));
		var pic2 = new Element('img', {
			'id' : 'pic2'
			,'src' : root+'images/0.gif'
			,'height':639
			,'width':960
			,'styles': {
				'position' : 'absolute'
				,'z-index' : 2
			}
		}).injectInside($('container'));
		//picarray generieren
		for(var i=1; i<=4; i++){
			picarray.push(root+'images/fadepics/'+i+'.jpg');
		}
		picarray.shuffle();
		this.firstFade = false;
		//preload & start ani
		var preImages = new Asset.images(picarray, {
			onComplete: function(){
				this.fadeit();
			}.bind(this)
		},this)
	},
	//Bilder überblenden
	fadeit: function(){
		//Dauer des Bildwechsels, Wiederholungsrate und fps 
		this.s_duration = 1500;
		this.s_periodical = 5000;
		this.s_fps = 30;
		if (picarray.length > 1) {
			if ((picarray.length - 1) > pickey) {
	    		pickey++;
	   		}else{
	    		pickey = 0;
	   		}
			if (mainchange == 1) {
				$('pic2').set('opacity', 0);
				$('pic2').src = picarray[pickey];
				var myFx1 = new Fx.Tween('pic1', {
					duration: this.s_duration
					,fps: this.s_fps
				}).start('opacity', '1', '0');
				var myFx2 = new Fx.Tween('pic2', {
					duration: this.s_duration
					,fps: this.s_fps
				}).start('opacity', '0', '1');
				mainchange = 2;
			}
			else {
				$('pic1').set('opacity', 0);
				$('pic1').src = picarray[pickey];
				var myFx3 = new Fx.Tween('pic2', {
					duration: this.s_duration
					,fps: this.s_fps
				}).start('opacity', '1', '0');
				var myFx4 = new Fx.Tween('pic1', {
					duration: this.s_duration
					,fps: this.s_fps
				}).start('opacity', '0', '1');
				mainchange = 1;
			}
			if(this.firstFade == false){
				this.firstFade = true;
				intervalID = this.fadeit.periodical(this.s_periodical);
			}
		}else{
			$('pic2').set('opacity', 1);
			$('pic2').src = picarray[0];
		}
	},
	///////////////////////////////Startseiten Aufbau///////////////////////////////
	//Header auf Startseite einfaden
	headern: function(){
		bloobInterval = new FX().bloob.periodical(1000);
		new FX().linkBoxes();
		mO2 = new Fx.Morph($('header'), {
			duration: 10
			,transition: Fx.Transitions.Sine.easeInOut
			,onComplete: function(){
			}		
		});
		mO2.start({
			'opacity':1
		});
	},
	//Boxen mit Effekt einblenden
	bloob: function(){
		if (Browser.Engine.name == "trident" && Browser.Engine.version < 5) {	
		}else{
			intervalCounter ++;
			if(intervalCounter < 5){
				if ($defined($('box_' + intervalCounter))) {
					mO = new Fx.Morph($('box_' + intervalCounter), {
						duration: 400,
						transition: Fx.Transitions.Sine.easeInOut,
						onComplete: function(){
							mO2 = new Fx.Morph($('boxcontent_' + intervalCounter), {
								duration: 5
								,
								onComplete: function(){
									$(document.body).setStyle('overflow-y', 'auto');
								}
							});
							mO2.start({
								'opacity': 1
							});
						}
					});
					mO.start({
						'opacity': 1,
						'width': 183,
						'height': 99
					});
				}
			}else{
				bloobInterval = $clear(bloobInterval);
			}	
		}
	},
	//Boxen wenn nicht auf Home-Seite anzeigen
	showBoxes: function(){
		$(document.body).setStyle('overflow-y','auto');
		boxesArr = $$('.boxes');
		boxesArr.each(function(itm, key){
			itm.setStyles({
				'width':183
				,'height':99
				,'opacity':1
				,'visibility':'visible'
			});
		});
	},
	fillBoxes: function(){
		new Request.JSON({ 
				url: 'index.php'  
				,method: 'post'
				,data: 'mode=ajax&id='+homeID+'&reqCol=text, title'
				,onComplete: function(response){
					if (response != null) {
						if (response.text != null) {
							x = response.text.split('[box]');
							//Bestehender Inhalt (Navi-Punkte) mit restlichem Text zusammengesetzt in 4 Boxen reinschreiben
							for (i = 1; i < 5; i++) {
								$('boxcontent_' + i).set('html', ($('boxcontent_' + i).get('html') + x[i]));
							};
						}
					}
				}
		}).send();
		for(i=1; i<5; i++){
			if ($defined($('boxcontent_' + i))) {
				$('boxcontent_' + i).setStyles({
					'opacity': '1',
					'visibility': 'visible'
				});
			}
		};
	},
	linkBoxes: function(){
		for(var i=1; i<5; i++){
			if ($defined($('box_' + i))) {
				$('box_' + i).setStyle('cursor', 'pointer');
				$('box_' + i).addEvent('click', function(){
					var lnk = this.getElementsByTagName('a')[0].href;
					window.location.href = lnk;
				});
			}	
		};
	}
});