/*var picListJSON;
var picCounter = 0;
var isScrolling = 0;
var cCon = new Array();
var cHeight = 0;
var cWidth = 0;
var cPicWidth = 0;
var loaded = 0;
var cPicPointer = 0;
var oldID;
*/

var picCounter;
var cHeight = 0;
var cWidth = 0;
var curPic = 0;
var xPos= 0;

$(document).ready (function(){
	$(".pic").fadeTo(0,0.7);
	updateContainerPositions();
	picCounter = pic.length;
	
	$(".prevPic").fadeTo(0,0);
    $(".nextPic").fadeTo(0,0);
	
	thumbHandler();
	
	$("#about").click (function(){
		$(".aboutContainer").show();
		$(".thumbContainer").hide();
	});
	
	$("#home").click (function(){
		$(".thumbContainer").show();
		$(".aboutContainer").hide();
	});
	
	$("#clients").click (function(){
		$(".thumbContainer").hide();
		var c = "http://www.stefankoell.net/portfolio/includes/picScaler.php?width=900&height=600&pic=/portfolio/clients.jpg&hash="+Math.random();
		$('<img />')
	    .attr('src', c)
	    .addClass("currentPict")
	    .load(function(){
	    	$(".picContainer").fadeTo(510,1);
	        $(".picContainer").css({
				"background-image":"url("+c+")" 
			});  
			$(".picOverlay").unbind("click");

			var pWidth = $(window).width();
			var pHeight = $(window).height();
			
			$(".prevPic").css({
				"top":"0px",
				"left":"0px",
				"height":(pHeight)+"px"
			});
			$(".nextPic").css({
				"top":"0px",
				"left":(pWidth-200)+"px",
				"height":(pHeight)+"px"
			});
			
			$(".nextPic").unbind("mouseover");
			$(".prevPic").unbind("mouseover");
			$(".nextPic").unbind("mouseout");
			$(".prevPic").unbind("mouseout");
			$(".nextPic").unbind("click");
			$(".prevPic").unbind("click");
		
			
			
			$(".picCloser").click (function(){
				$(".picContainer").hide();
				$(".thumbContainer").fadeTo(200,1);
				$(".aboutContainer").hide();
			});

    	});   

	});
	
	$(".kat").mouseover(function(){
		$(this).addClass ("katActive");
	});
	
	$(".kat").mouseout(function(){
		$(".kat").removeClass ("katActive");
	});
	
	
	
	$(window).mousemove(function(e){
			//alert (e.pageX);
			xPos = e.pageX;
			/*
			if (xPos < $(window).width()/2){
				$(".mouseIndicator").css({
					"top":e.pageY+"px",
					"left":xPos+"px",
					"background-image":"url(http://www.stefankoell.net/portfolio/css/prev.gif)"
				});
			}else{
				$(".mouseIndicator").css({
					"top":e.pageY+"px",
					"left":xPos+"px",
					"background-image":"url(http://www.stefankoell.net/portfolio/css/next.gif)"
				});
			}*/
		});
		
});

function thumbHandler(){
	$(".katName").unbind("click");
	$(".katName").click (function(){
		curPic = this.id;
		imageLoader(pic[this.id]);
	});
	
	$(".pic").unbind("click");
	$(".pic").click (function(){
		picLoader(this.id);
	});
	$(".pic").unbind("mouseover");
	$(".pic").mouseover(function(){
		$(this).fadeTo(0,1);
	});
	$(".pic").unbind("mouseout");
	$(".pic").mouseout(function(){
		$(".pic").fadeTo(0,0.7);
	});
}

function picLoader(cPic){
	 
	$(".picContainer").css({
		"background-image":"url(http://www.stefankoell.net/portfolio/css/thumbloader.gif)",

	});
	$(".picContainer").fadeTo(0,1);
	$(".pic").unbind("click");
	curPic = cPic;
	imageLoader(pic[cPic]);
}




function updateContainerPositions(){
	cHeight = $(window).height();
	cWidth = $(window).width();
	cPicWidth = cWidth;
	$(".picContainer").css({
		"width":(cPicWidth)+"px",
		"height":(cHeight)+"px"
	});
	
	$(".picOverlay").css({
		"width":(cPicWidth)+"px",
		"height":(cHeight)+"px"
	});

	$(window).unbind("resize");
	$(window).resize(function(){
		updateContainerPositions();
	});
}


function imageLoader(currentImage){
	var pWidth = $(window).width();
	var pHeight = $(window).height();
	/*$(".picContainer").fadeTo(0,0);*/
	$(".thumbContainer").hide();
	if (pWidth < 1200){
		var cW = pWidth;
	}else{
		var cW = 1200;
	}
	if (pHeight < 820){
		var cH = pHeight-20;
	}else{
		var cH = 800;
	}
	
	
	var c = "http://www.stefankoell.net/portfolio/includes/picScaler.php?width="+cW+"&height="+cH+"&pic="+currentImage+"&hash="+Math.random();
    //console.log(c);
	$('<img />')
    .attr('src', c)
    .addClass("currentPict")
    .load(function(){
    	//
    	
       // $('.currentPic').html( $(this) );
		//$(".currentPict").fadeTo(0,0);
        //$(".picContainer").fadeTo(0,0);
        $(".picContainer").fadeTo(510,1);
        $(".picContainer").css({
			"background-image":"url("+c+")" 
		});  
		$(".picOverlay").unbind("click");
		/*$(".picOverlay").click(function(){
			$(".picContainer").hide();
			$(".thumbContainer").fadeTo(200,1);
		});*/
		
		var pWidth = $(window).width();
		var pHeight = $(window).height();
		
		$(".prevPic").css({
			"top":"0px",
			"left":"0px",
			"height":(pHeight)+"px"
		});
		$(".nextPic").css({
			"top":"0px",
			"left":(pWidth-200)+"px",
			"height":(pHeight)+"px"
		});
		
		$(".nextPic").unbind("mouseover");
		$(".prevPic").unbind("mouseover");
		$(".nextPic").unbind("mouseout");
		$(".prevPic").unbind("mouseout");
		$(".nextPic").unbind("click");
		$(".prevPic").unbind("click");
	
		$(".prevPic").mouseover(function(){
			$(this).fadeTo(50,1);
		});
		$(".prevPic").mouseout(function(){
			$(this).fadeTo(50,0);
		});
		
		$(".nextPic").mouseover(function(){
			$(this).fadeTo(50,1);
		});
		$(".nextPic").mouseout(function(){
			$(this).fadeTo(50,0);
		});
		
		$(".picCloser").click (function(){
			$(".picContainer").hide();
			$(".thumbContainer").fadeTo(200,1);
			$(".aboutContainer").hide();
		});
		
		//$(".nextPic").click()
		/*$(".picOverlay,.mouseIndicator").unbind("click");
		$(".mouseIndicator").click (function(){
			//alert (xPos);
			if (xPos > $(window).width()/2){
				curPic++;
			}else{
				curPic--;
			}
			
			if (curPic <= 0){
				curPic = picCounter-1;
			}
			if (curPic > picCounter-1){
				curPic = 0;
			}
			
			imageLoader(pic[curPic]);
		});*/
		
		$(".nextPic").click (function(){
			curPic++;
			if (curPic > picCounter-1){
				curPic = 0;
			}
			
			imageLoader(pic[curPic]);
		});
		
		$(".prevPic").click (function(){
			curPic--;
			if (curPic == 0){
				curPic = picCounter-1;
			}
			
			imageLoader(pic[curPic]);
		});
		
		thumbHandler();
    });   
}


 function zufall() {
	return (Math.random() - Math.random());
}












/*
function naviHandler(){
	$(".navi").unbind("click");
	$(".navi").click (function(){
		$(".navi").removeClass("naviActive");
		$(this).addClass("naviActive");
		if ($(this).hasClass("katNavi")){
			var cID = this.id;
			cID = cID.split("_");
			var cIDs = cID[1];
			cIDs = cIDs.split(",");
			
			
			$(".thumbCon").hide();
			
			for (i=0; i < cIDs.length; i++){
				$("."+cIDs[i]).show();
			}

			$(".aboutContainer").hide();
			$(".contactContainer").hide();
			$(".leftContainer").show();
			$(".picContainer").show();
			$(".descriptionContainer").show();
		}else{
			if (this.id == "home"){
				$(".thumbCon").hide();
				
				$(".aboutContainer").hide();
				$(".contactContainer").hide();
				$(".leftContainer").show();
				$(".picContainer").show();
				$(".descriptionContainer").show();
			}
			
			if (this.id == "about"){
				$(".aboutContainer").show();
				$(".contactContainer").hide();
				$(".leftContainer").hide();
				$(".picContainer").hide();
				$(".descriptionContainer").hide();
			}
			
			if (this.id == "contact"){
				$(".aboutContainer").hide();
				$(".contactContainer").show();
				$(".leftContainer").hide();
				$(".picContainer").hide();
				$(".descriptionContainer").hide();
			}
		}
	});
}

function updateContainerPositions(){
	cHeight = $(window).height();
	cWidth = $(window).width();
	cPicWidth = (cWidth-($(".thumbContainer").width())-20);
	$(".picContainer").css({
		"width":(cPicWidth)+"px",
		"height":(cHeight-80)+"px"
	});
	
	$(".picOverlay").css({
		"width":(cPicWidth)+"px",
		"height":(cHeight-80)+"px"
	});

	$(window).unbind("resize");
	$(window).resize(function(){
		updateContainerPositions();
	});
}

function loadPicList(){
	var cURL = "includes/contentLoader.php";
	
	$.ajax({
		url: cURL,
		cache: false,
		success: function(pics){
			picListJSON = $.parseJSON(pics);
			$(".allThumbs").html(picListJSON.picCount);
			getPicList();
		},
		error: function(e,f,g){
			alert ("Upps, da ist ein Fehler beim Laden aufgetreten: "+g);
		}
	});
}

function getPicList(){
	for(i=0; i < picListJSON.picCount; i++){
		loadThumb(picListJSON[i], i);
	}
}

function loadThumb(cThumb, pointer){
	if (oldID != cThumb.katID){
		$(".thumbContainerContent").append("<div style = 'height: 0px; clear:left' ></div>");
	}
	$(".cThumb").html(""+(pointer+1)+"");
	var cThumbContainer = picListJSON.thumbTemplate;
	cThumbContainer = cThumbContainer.replace("{cID}", cThumb.id);
	cThumbContainer = cThumbContainer.replace("{cKat}", cThumb.kat);
	cThumbContainer = cThumbContainer.replace("{cURL}", cThumb.filename);
	cThumbContainer = cThumbContainer.replace("{katName}", cThumb.katName);
	cThumbContainer = cThumbContainer.replace("{katDesc}", cThumb.katDesc);
	cThumbContainer = cThumbContainer.replace("{cKat}", cThumb.katID);
	cThumbContainer = cThumbContainer.replace("{cCount}", pointer);
	cThumbContainer = cThumbContainer.replace("{cCount}", pointer);
	oldID = cThumb.katID;
	$(".thumbContainerContent").append(cThumbContainer);
	if (pointer == picListJSON.picCount - 1){
		$(".thumbLoader").remove();
		fadeInThumbs();
	}
}

function fadeInThumbs(){
	for (i=0; i < picListJSON.picCount; i++){
		cCon.push(i);
	}
	cCon.sort(zufall);
	fadeInThumb(0);
}

function fadeInThumb(pointer){
	if (pointer == picListJSON.picCount){
		thumbHandler();
	}else{
		//$("#thumb_"+cCon[pointer]+" .thumb").delay(100+pointer*20).fadeTo(100+pointer*20,1, function(){});	
		$("#thumb_"+cCon[pointer]+" .thumb").fadeTo(0,1);
		fadeInThumb(pointer+1);
	}
}

function thumbHandler(){
	
	$(".thumbContainerContent").append("<br style = 'clear:left' />");
	$(".thumbCon").hide();
	loaded = 1;
	
	$(".thumb").unbind("mouseover");
	$(".thumb").unbind("mouseout");
	$(".thumb").unbind("click");
	
	$(".thumb").click (function(){
		$(".descriptionContainer").html($(this).attr("dtitle"));
		$(this).fadeTo(100,0.2);
		var cID = this.id;
		cID = cID.split("_");
		var cPic = cID[1];
		cPicPointer = cID[2];
		
		var cDatas = {};
		cDatas.picID = cPic;
		cDatas.width = cPicWidth;
		cDatas.height = cHeight;
		
		$(".currentPic").fadeTo(50,0);
        $(".picContainer").css({
			"background-image":"url(css/thumbloader.gif)"
		});
		
		$.ajax({
			url: "includes/picLoader.php",
			type:"post",
			data: cDatas,
			success: function(pic){
				imageLoader(pic);
			}
		});
		
		
	});
	$(".thumb").mouseover (function(){
		$(".thumb").removeClass ("thumbHover");
		$(this).addClass ("thumbHover");
		
	});
	$(".thumb").mouseout (function(){
		$(this).removeClass ("thumbHover");
	});
	
	//$(".thumb").tipsy({html:true, gravity: $.fn.tipsy.autoWE });
}

function imageLoader(currentImage){
	$('<img />')
    .attr('src', currentImage)
    .addClass("currentPict")
    .load(function(){
        $('.currentPic').html( $(this) );
        $(".currentPic").fadeTo(500,1);
        $(".picContainer").css({
			"background-image":"url()"
		});
		
		setPicNavi();
    });   
}

function homeLoader(currentImage){
	$('<img />')
    .attr('src', currentImage)
    .addClass("currentPict")
    .load(function(){
        $('.currentPic').html( $(this) );
        $(".currentPic").fadeTo(500,1);
        $(".picContainer").css({
			"background-image":"url()"
		});
		
		//setPicNavi();
    });   
}

function setPicNavi(){
	var pWidth = $(".currentPict").width();
	var pHeight = $(".currentPict").height();
	
	$(".prevPic").css({
		"top":"0px",
		"left":"0px",
		"height":(pHeight)+"px"
	});
	$(".nextPic").css({
		"top":"0px",
		"left":(pWidth-100)+"px",
		"height":(pHeight)+"px"
	});
	
	$(".nextPic").unbind("mouseover");
	$(".prevPic").unbind("mouseover");
	$(".nextPic").unbind("mouseout");
	$(".prevPic").unbind("mouseout");
	$(".nextPic").unbind("click");
	$(".prevPic").unbind("click");

	$(".prevPic").mouseover(function(){
		$(this).fadeTo(100,0.7);
	});
	$(".prevPic").mouseout(function(){
		$(this).fadeTo(100,0);
	});
	
	$(".nextPic").mouseover(function(){
		$(this).fadeTo(100,0.7);
	});
	$(".nextPic").mouseout(function(){
		$(this).fadeTo(100,0);
	});
	
	$(".nextPic").click(function(){
		$(".nextPic").unbind("click");
		if (parseInt(cPicPointer) == parseInt(picListJSON.picCount)-1){
			var cPic = 0;
		}else{
			var cPic = parseInt(cPicPointer) + 1;
		}

		var pID = picListJSON[cPic].id;
		var cDatas = {};
		cDatas.picID = pID;
		cDatas.width = cPicWidth;
		cDatas.height = cHeight;
		
		$(".currentPic").fadeTo(50,0);
        $(".picContainer").css({
			"background-image":"url(css/thumbloader.gif)"
		});
		
		$.ajax({
			url: "includes/picLoader.php",
			type:"post",
			data: cDatas,
			success: function(pic){
				$("#pic_"+pID+"_"+cPic).fadeTo(50,0.2);
				$(".descriptionContainer").html($("#pic_"+pID+"_"+cPic).attr("original-title"));
				cPicPointer = cPic;
				imageLoader(pic);
			}
		});
	});
	
	$(".prevPic").click(function(){
		$(".prevPic").unbind("click");
		if (parseInt(cPicPointer) == 0){
			var cPic = parseInt(picListJSON.picCount)-1;
		}else{
			var cPic = parseInt(cPicPointer) - 1;
		}

		var pID = picListJSON[cPic].id;
		var cDatas = {};
		cDatas.picID = pID;
		cDatas.width = cPicWidth;
		cDatas.height = cHeight;
		
		$(".currentPic").fadeTo(50,0);
        $(".picContainer").css({
			"background-image":"url(css/thumbloader.gif)"
		});
		
		$.ajax({
			url: "includes/picLoader.php",
			type:"post",
			data: cDatas,
			success: function(pic){
				$("#pic_"+pID+"_"+cPic).fadeTo(50,0.2);
				$(".descriptionContainer").html($("#pic_"+pID+"_"+cPic).attr("original-title"));
				cPicPointer = cPic;
				imageLoader(pic);
			}
		});
	});
}

function zufall() {
	return (Math.random() - Math.random());
}
*/