// JavaScript Document

checkLayout();

$(document).ready(function() {

													 
	if($(".contentProjectPic").length > 0){
		$("#cover").show();
		setTimeout(function(){ $("#content").css("visibility", "visible"); }, 500);
	} else {
		$("#cover").hide();
		$("#content").css("visibility", "visible");
	}													 
	
	checkLayout();
	$(window).resize( function() { checkLayout(); });
	
	
	getIntroImage($(".introImage:first"),"first");
	
	$("#parent option").click( function(){
		$("#urlPath").html($(this).attr("rel"));
	});
	
	$("#nicetitle").keyup( function(){ makeURLfriendly(); });
	
	$("#subnav A, #editContentLink A, #editNavLink A, #languageSwitcher A").click( function(){
		var top = parseInt($("#leftnav_contentwrapper").css("top"));
		if(top < 0){
			var linkModified = $(this).attr("href") + "/" + top*(-1);
			location.href = linkModified;
			return false;
		}
	});
	
	$(".frontend #subnav A").hover(
		function(){ 
			if($("#projectPic"+$(this).attr("id").replace("a","")).length > 0){
				$("#projectpicsHover").show();
				$("#content").css("display", "none"); 
				$("#projectPic"+$(this).attr("id").replace("a","")).show();
				
			}
		},
		function(){ $("#content").show(); $(".projectPic").hide(); $("#projectpicsHover").hide(); }
	);	
	
	$(".projectThumb").hover(
		function(){ $(this).children(".iconDelete").show(); },
		function(){ $(this).children(".iconDelete").hide(); }
	);
	
	$(".iconDelete").click( function(){
		$(this).parent().fadeOut();
		var id = $(this).attr("id").replace("delete_", "");
		$("#deletePics").attr("value", $("#deletePics").attr("value") + "," + id);
		$("#introUpload .save, #introUpload .cancel").show();
		$("#introUpload .upload, #inputUpload, .msg").hide();
		$("#ajaxupload").attr("target", "").attr("onsubmit", ""); 
	});
	
	$("#introSkip").click( function(){ location.href = $("#introText_de .firstPage").attr("href"); });
	$("#introEnglish").click( function(){ start("en"); });	
	
	$(".contentProjectPic IMG").click( function(){
																								
		var div = $(this).parent();
		$(div).hide();
		if($(div).next().attr("id")=="cover"){
			$("#cover").hide();
			//$("#projectPicsNav").hide();
		} else {
			$(div).next().show();
		}
		
		$("#projectPicsNav .active").removeClass("active").next().addClass("active");
		
	});
	
	$("#content.clickable").click( function(){
		if($("#contentProjectPic1").length==1){
			$("#cover").show();
			$("#contentProjectPic1").show();
			//$("#projectPicsNav").show();
			$("#projectPicsNav A").removeClass("active");
			$("#projectPicsNav A:first").addClass("active");
		}
	});

	$("#projectPicsNavText").click( function(){
		$("#cover").hide();
		//$("#projectPicsNav").hide();
		$("#projectPicsNav A").removeClass("active");
		$(this).addClass("active");
		$(".contentProjectPic").hide();
	});
	
	$(".projectPicsNavImage").click( function(){
		var imgNr = $(this).attr("id").replace("projectPicsNav","");
		$("#cover").show();
		$(".contentProjectPic").hide();
		$("#contentProjectPic"+imgNr).show();
		$("#projectPicsNav A").removeClass("active");
		$("#projectPicsNav"+imgNr).addClass("active");
	});
	

	$(".introText").click( function(){ 
		location.href = $(this).children(".firstPage").attr("href");
	});
	
	$(".introImage").click( function(){
		start("de");
	});
	
});




function start(lang){
	$("#introEnglish, #introSkip").hide();
	$("#black").show();
	$("#black").css("opacity", "0").css("filter", "alpha(opacity=0.1)");
	$("#black a").attr("href", $("#introText_"+lang).children(".firstPage").attr("href"));
	$("#black").fadeTo(2000, 0.8, function(){ $("#introText_"+lang).fadeIn(2000); } );
	//setTimeout( function(){ location.href = $("#introText_"+lang).children(".firstPage").attr("href"); },10000);
}

function getIntroImage(obj, first){

	$(obj).load("render.php", { id: $(obj).attr("id"), width:  $(window).width() }, 
															function(){ getIntroImage($(obj).next(),0);
																					if(first) setTimeout( function(){ $(obj).fadeIn(2000); slideshow("start"); },1500); });
}

function slideshow(mode){

		var slide = setTimeout( function(){
			
			var introImageActive = $(".introImages .active");
			$(introImageActive).removeClass("active")
												 .fadeOut(2000);
															 
			if($(introImageActive).next().length == 1){
				$(introImageActive).next().fadeIn(2000).addClass("active"); 
			} else {
				start("de");
				$(introImageActive).siblings(".first").fadeIn(2000).addClass("active");
			}

			slideshow();
	
		},5000);

}

function makeURLfriendly(){
	var url = $("#nicetitle").attr("value"),
	url = url.toLowerCase();
	url = url.replace(/ |_/, "-");
	url = url.replace(/[^1-9a-z-]/, "");
	$("#nicetitle").attr("value", url);
	$("#urlNicetitle").html(url);
}	

function resizeIntroImages(){
	var viewportWidth = $(window).width();
	$(".introImages img").attr("width", viewportWidth);
}

function checkLayout(){

	var viewportHeight = $(window).height();
	var viewportWidth = $(window).width();
	var minusFactor = ($.browser.msie) ? 455 : 440;
	
	$("#content").height(viewportHeight - 293).width(viewportWidth-minusFactor);
	$("#leftnav").height(viewportHeight - 300);
	$("#sliderVertical").height(viewportHeight - 330);
	$("#cover").height(viewportHeight - 200).width(viewportWidth-430);
	$("#content___Frame").height(viewportHeight - 330);
	$("#fadingBottomContent").width($("#content").width()-7);
	//if(viewportHeight < 730){ $("#contentFadingBottom").hide(); }
	
	if(($("#leftnavContent").height()+40) > $("#leftnav").height()){
		$("#scrollUp, #scrollDown").show();
	}	else {
		$("#scrollUp, #scrollDown").hide();
	}
	
}

function startUpload(){
	$("#f1_upload_process").show();
  $("#f1_upload_form").hide();
	return true;
	}

function stopUpload(success, id, filename){
	var result = '';
	if (success == 1){
		result = '<span class="msg">Datei wurde erfolgreich hochgeladen.<\/span><br/>';
		$("#introImagesContent").append('<div class="projectThumb" id="thumb_'+id+'"><img class="iconDelete" id="delete_'+id+'" src="../images/iconDelete.gif" /></img><img class="" src="../images/intro/thumbnails/'+filename+'" /></div>');			 
		
		$("#introImagesContent").sortable({
			update: function(){ $(".iconDelete").hide(); $("#thumbsOrder").attr("value", $(this).sortable("serialize")); },
			forcePlaceholderSize: true,
			placeholder: "ui-selected",
			opacity: 0.5,
			tolerance: "tolerance",
			zIndex: 100000,
			containment: "document"
		});			 
		
		$(".projectThumb").hover(
			function(){ $(this).children(".iconDelete").show(); },
			function(){ $(this).children(".iconDelete").hide(); }
		);
		
		$(".iconDelete").click( function(){
			$(this).parent().fadeOut();
			var id = $(this).attr("id").replace("delete_", "");
			$("#deletePics").attr("value", $("#deletePics").attr("value") + "," + id);
			$("#introUpload .save, #introUpload .cancel").show();
			$("#introUpload .upload").hide();
			$("#ajaxupload").attr("target", "").attr("onsubmit", ""); 
			$("#inputUpload").hide();
		});		
		
	} else {
		result = '<span class="msg">Hoppla, da ist irgendwo ein Fehler passiert!<\/span><br/>';
	}
	$("#f1_upload_process").hide();
	$("#f1_upload_form").show(); 
	$("#myfile").attr("value", "");
	return true;   
}

var scrolling;

function leftnavScroll(direction,action) {

	var speed;
	if(direction=="up"){ speed = "-4px"; } else { speed = "4px"; }
	
	if(action=='stop'){ clearTimeout(scrolling); }

	if(action=='go'){
		fleXcrollTo('leftnav', speed, speed, true);	
		scrolling = setTimeout('leftnavScroll("' + direction + '", "go")', 50);
	}
}


function fleXcrollTo(id,x,y,relative) {
	var scrollDiv = document.getElementById(id);
	//Return if the target is null
	if (scrollDiv == null) return;
	//Do the scroll by using custom method attached by fleXcroll
	//but first check if the method exists.
	if(scrollDiv.contentScroll) scrollDiv.contentScroll(x,y,relative);
	/*
	Following is the method to commit a scroll by defining
	relative or absolute values:
		element.contentScroll(x,y,relative);
	*x and y values are horizontal and vertical
	positions of content and can be set to false if we don't
	require any one of them to be scrolled.
	*x and y should be sent as string, between quotation marks.
	*x and y can take three different units:
	px, s, p
	where px is pixels, s is a single step, p is a page scroll.
	*relative can be either true or false. If true,
	x and y is used as relative scrolling.
	*x and y refer to content position
	*e.g. To scroll one page down, you can:
	element.contentScroll(false,"1p",true);
	*e.g. To scroll 3 steps to left, you can:
	element.contentScroll("-3s",false,true);
	*e.g. To set the content at 30px right, and 20px down:
	element.contentScroll("30px","20px",false);
	*e.g. To scroll down 100px relatively,
	element.contentScroll(false,"100px",true);
	*/
}