
function createHelpPopin(title, content, width)
{
	if(width == undefined || width == "")
		width = "400";

	$(document.body).adopt(
		$$(
			new Element("div", 
				{
					id:"popin-wrapper",
					styles: { "height": window.getScrollSize().y.toInt() }
				}
			)
		),
		popin = 
			new Element("div", { id:"help-popin", "style":"width:" + width + "px" }).adopt(
			    new Element("div", { id:"help-container" }).adopt(
				    $$(	new Element("img", { src:"/images/common/popin-top.png", "style":"margin:-43px 0 0 320px;float:left;" }) )
				    ,
				    $$(	new Element("img", { src:"/images/common/question-mark.png", "style":"margin:-36px 0 0 326px;float:left;" }) )
				    ,
				    $$(	new Element("div", {"style":"border-bottom:1px solid grey;" }) ).adopt(
					    $$(	new Element("div", { "html":title, "style":"font-size:1.7em;" }) )				
				    )
				    ,
				    $$(	new Element("br", { }) )
				    ,
				    $$(	new Element("div", { id:"help-content", "html":content }) )
				    ,
				    $$(	new Element("div", { "style":"display:block;text-align:right;margin: 10px 0 0 0;" }) ).adopt(
					    $$(	new Element("a", { id:"help-close", href:"#", "html":"(st&auml;ng f&ouml;nster)" }) )
				    )	
			    )
		)
	);
	
	$('help-close').addEvent("click", function(e) {
		e.stop();
		if($('help-popin')){
			$('help-popin').fade(0);
			DisposeHelpPopin();
		}
	});
		
	$('popin-wrapper').addEvent("click", function(e) {
		e.stop();
		if($('help-popin')){
			$('help-popin').fade(0);
			DisposeHelpPopin();
		}
	});
		
    /**$('popin-wrapper').addEvent('keydown', function(event){
        if (event.key == 'esc') DisposeHelpPopin();
    });*/
	
	rePositionHelpPopin();
}

function createHelpVideoPopin(title, videoID, content, width)
{
	var videoURL =
		"<object width='425' height='344'>"
			+ "<param name='movie' value='http://www.youtube.com/v/" + videoID + "'></param>"
			+ "<param name='allowFullScreen' value='true'></param>"
			+ "<param name='allowscriptaccess' value='always'></param>"
			+ "<embed src='http://www.youtube.com/v/" + videoID + "' type='application/x-shockwave-flash' allowscriptaccess='always' allowfullscreen='true' width='425' height='344'></embed>"
		+ "</object>";

	createHelpPopin(title, videoURL + content, width)
}

function DisposeHelpPopin()
{
	$('help-popin').setStyle('display','none');
	$('popin-wrapper').setStyle('display','none');
	$('help-popin').dispose();
	$('popin-wrapper').dispose();
}

function rePositionHelpPopin() {
	if ($("popin-wrapper"))
		$("popin-wrapper").setStyle("height", window.getScrollSize().y.toInt());
	if ($("help-popin"))
		$("help-popin").setStyle("left", window.getSize().x/2 - $("help-popin").getStyle("width").toInt()/2);
}

