// JavaScript Animation
// KLEIN-WIELE.COM
// JQUERY Fadings 2011

var aniIndex = 0;
var aniTimer;
var win = window;
	$(document).ready(function(){
				$("#img_3").css({"opacity":0});
				$("#img_2").css({"opacity":0});
				$("#img_1").css({"opacity":0});
				$("#img_0").css({"opacity":0});
				$("#info_3").css({"opacity":0});
				$("#info_2").css({"opacity":0});
				$("#info_1").css({"opacity":0});
				$("#info_0").css({"opacity":0});
				$("#imgs").css("display","block");
				
				kwInitBtns();
				kw_startAni();
	});
	function kw_startAni(){
		
		if(aniIndex >= 4){
			aniIndex = 0;
		}
		img_str = "#img_"+String(aniIndex);
		$(img_str).stop(true, false);
		$(img_str).css("z-index", "10");
		$(img_str).animate({"opacity":1},1000);
		img_str = "#info_"+String(aniIndex);
		$(img_str).stop(true, false);
		$(img_str).css("z-index", "11");
		$(img_str).animate({"opacity":1},1000);
		aniTimer = window.setTimeout('kw_animation()', 3000);
	}
	
	function kwInitBtns(){
		var i;
		var cast_str;
		for(i=0; i<4;i++){
			cast_str = "#btn_"+String(i);
			$(cast_str).data("index", i);
			$(cast_str).hover(kw_mouseIn,kw_mouseOut);
		};
	};
	function kw_mouseIn(){
		var i;
		var img_str, btn_str, a_str;
		win.clearTimeout(aniTimer);
		$(this).css({
			"background-color":"#fff",
			"color":"#609BB3"
		});
		var index = $(this).data("index");
		aniIndex = Number(index);
		kw_stopAni();
		img_str = "#img_"+String(index);
		$(img_str).stop(true, false);
		$(img_str).css("z-index", "10");
		$(img_str).animate({"opacity":1},1000);
		img_str = "#info_"+String(index);
		$(img_str).stop(true, false);
		$(img_str).css("z-index", "11");
		$(img_str).animate({"opacity":1},1000);
	}
	function kw_mouseOut(){
		$(this).css({
			"background-color":"#609BB3",
			"color":"#CFE1E8"
		});
		var index = $(this).data("index");
		
		var img_str = "#img_"+String(index);
		//$(img_str).stop(true, false);
		aniIndex = index;
		aniTimer = win.setTimeout(kw_animation, 2000);
	}
	
	function kw_animation(){
		var idleTime = 10000;		
		var img_str = "#img_"+String(aniIndex);
		var info_str = "#info_"+String(aniIndex);
		kw_stopAni();
		$(img_str).animate({"opacity":0},1000);
		$(info_str).animate({"opacity":0},500);	
		
		//
		aniIndex = aniIndex +1;
		if(aniIndex >= 4)
		{
			aniIndex = 0;
		}
		
		img_str = "#img_"+String(aniIndex);
		info_str = "#info_"+String(aniIndex);
		$(img_str).stop(true, false);
		$(info_str).stop(true, false);
		$(img_str).css("z-index", "10");
		$(info_str).css("z-index", "11");
		$(info_str).delay(2500).animate({"opacity":1},1000);
		$(img_str).animate({"opacity":1},2000);
		aniTimer = win.setTimeout('kw_animation()', idleTime);
		
	}
	function kw_stopAni(){
		var i;
		var cast_str;
		for(i=0;i<4;i++){
			cast_str = "#img_"+String(i);
			$(cast_str).stop(true, false);
			cast_str = "#info_"+String(i);
			$(cast_str).stop(true, false);
			if(i != aniIndex){
				cast_str = "#img_"+String(i);
				$(cast_str).css("z-index", String(i+5));
				$(cast_str).animate({"opacity":0},500);
				cast_str = "#info_"+String(i);
				$(cast_str).animate({"opacity":0},500);
				$(cast_str).css("z-index", String(i+6));
			}
		};
	};
	
