$(document).ready(function() {
	$(".openform").click(function() {
		openForm("contactform", "Kontaktformular")
	});
	
	$(".openfeedback").click(function() {
		openForm("feedback", "Kundenfeedback")
	});
});

function openForm(view, topic) {
	$("#page").append('<div id="layer" class="closable hidden"></div>')
	$("#page").append('<div id="screen" class="closable hidden"><div id="contactform"></div></div>')
	var loader = $("#loader").clone().removeClass("hidden")
	$("#layer").fadeIn(500);
	$("#screen").fadeIn(500);
	$("#imgprev").append(loader)
	var iframe = document.createElement("iframe")
	iframe.src = "/veranstaltungstechnik-berlin/verleih/" + view
	var w = 520
	var h = 422
	if (view == "feedback") {
		h = 650
	}
	iframe.width = w
	iframe.height = h
	$(iframe).css("border", 0)
	$(loader).remove()
	$("#contactform").append('<div id="formwrap"></div>')
	$("#formwrap").css('width', w + "px")
	$("#formwrap").css('margin-top', "-" + 211 + "px")
	$("#formwrap").css('margin-left', "-" + (Math.round(w/2) - 90) + "px")
	$("#formwrap").css('border', '1px solid #000')
	$("#formwrap").append('<div class="bar">' + topic + '<div class="closable close"></div></div>')
	$("#formwrap").append('<div class="clear"></div>')
	$("#formwrap").append(iframe)
	$(".closable").click(function() {
		$("#layer").fadeOut(500, function() { $(this).remove(); });
		$("#screen").fadeOut(500, function() { $(this).remove(); });
	})
}

