var coverfade = 0.5;
var hasImage = 0;
var thumbBase = "/thumbs/x"
var thumbWidth = "1280";
var thumbURI = thumbBase+thumbWidth;

//*******************************


function bg(str){
	$(document.body).append("<div class='choos' id='"+str+"' style='position:absolute; right:0px; top:0px; width:120px; border:solid 1px red; height:99%; display:none;z-index:100; overflow:auto; background-color:#DDD;'></div>");
	$("#"+str).load("/common/background/listimages.php?folder="+str, function(){
		$("#hof").append("<div id='show_"+str+"'>"+str+"</div>");
		$("#show_"+str).toggle( 
			function(){ $("#"+str).show("slow"); $(".choos").hide(); },
			function(){ $("#"+str).hide("slow")}
		);
		$("#"+str).hide();
		$("#"+str+" img").bind("click", function(){
			$("#daimage").html("<img style='width:100%;' src='"+thumbURI + "/" + $(this).attr("title") + "' />" );
			doImage( thumbURI + "/" + $(this).attr("title") );
		});
	});

}
var bgColor = "FFFFFF";
var fgColor = "000000";
var opaCity = 100;

//*******************************
function setColor(){
	$("canvas").remove();
	$(".boom").css({"backgroundColor":"#"+bgColor,"opacity":opaCity/100});
	$(".render").css({"backgroundColor":"#"+bgColor, "color":"#"+fgColor,"opacity":opaCity/100});
	$("a").css({"color":"#"+fgColor });
}

//*******************************
//*******************************
$(document).ready(function() {
return;
//	$(document.body).append("<div id='result' style='display:none'></div>");

//	$(document.body).append("<div id='panel' style='display:none;position:absolute;right:125px; top:0px;width:200px; border:solid 1px black; background-color:#DDD;font-size:small;z-index:101'><div id='hof' style='margin-left:4px;'></div></div>");

//	$(document.body).append("<div id='dacover' style='position:absolute; right:0px; top:0px; width:100%;height:99%;z-index:2;'>&nbsp;</div>");

	//****************************
	bg("wasser");
	bg("stein");
	bg("holz");
	bg("struktur");
	$("#header").toggle( 
		function(){ $("#panel").show() },
		function(){ $("#panel").hide(); $(".choos").hide(); }
	);


	//****************************
	var html = "<br/><div class='tp'>Transparenz Deckfarbe</div><div class='slider1' style='margin:5px;width:180px; height:10px;'></div>";
	$("#panel").append(html);
	$(".slider1").slider({
		orientation: "horizontal",
		value:100,
		min: 0,
		max: 255,
		slide: function(event, ui) { 
			opaCity = ui.value;
			setColor();
		},
		stop: function(event, ui){ /*doFade(ui.value, "#dacover");*/}
	});	
	//****************************
	var html = "<br/><div class='tp'>Abstand</div><div class='slider2' style='margin:5px;width:180px; height:10px;'></div>";
	$("#panel").append(html);
	$(".slider2").slider({
		orientation: "horizontal",
		value:10,
		min: 0,
		max: 20,
		slide: function(event, ui) {
			var pT = 87-9;
			$(".boom").css({"margin":ui.value});
			$(".colorframe").css({"paddingTop":pT+ui.value});
		},
		stop: function(event, ui){ /* doFade(ui.value, "#dacover"); */}
	});	

	//****************************
	var html = "";
	html += "<div style='float:left;cursor:pointer; width:70px; height:20px;color:black;background-color:white;' id='black'>schwarz</div>";
	html += "<div style='float:left;cursor:pointer; width:70px; height:20px;color:white;background-color:black;' id='white'>weiss</div>";
	$("#panel").append("<br/><div class='tp' style='clear:both;'>schwarz-weiss</div>"+html+"</div>");
	$("#white").click( function(){
		bgColor = "000000"; fgColor="FFFFFF";
		setColor();		
	});
	$("#black").click( function(){
		bgColor = "FFFFFF"; fgColor="000000";
		setColor();		
	});


});

//*******************************
//*******************************
//*******************************


//*******************************

function doColor(color){
	$("#dacover").css({"backgroundColor":color});
	setCss("#dacover", "background-color", color);
}
function doFade(val, tgt){
	setCss(tgt, "opacity", val/100)
}
function doImage(image){
	setCss("#daimage", "background-image", "url("+""+image+")");
}

function setCss(target, key, val, page){
	var where = (typeof(page)=="undefined") ? window.location.href : page
//	$("#result").load("/common/background/preset.php?action=css"+"&target="+escape(target)+"&key="+escape(key)+"&value="+escape(val)+"&page="+escape(where));
}
function cssreset(){
	var where = (typeof(page)=="undefined") ? window.location.href : page
	$("#result").load("/common/background/preset.php?action=reset&target=page&page="+escape(where));
}