/**
 * @author gabriel
 */

var POPUPWIDTH = 600;
var POPUPHEIGHT = 350;
var POPUPOFFSET = 0;

var multipopupActiv = false;
var multipopupinfoShow = true;

 
//var popupURLPrefix = "http://h1905203.stratoserver.net/";
var popupURLPrefix = "";


function initDetailView()
{
	$("body").append("<div class='detailviewBg'></div>")
		$(".detailviewBg").hide();
			
	popupInitEvents();
}

function popupInitEvents()
 {
 	
	
	
	$(".popupSingleExtern").live("click", function(e)
	{
		e.preventDefault();
		createPopupFrame($(this).attr("href"), "popupCloseSingle", false);
		showPopupBackground();
	})
	$(".popupSingle").live("click", function(e)
	{
		e.preventDefault();
		createPopupFrame($(this).attr("href"), "popupCloseSingle");
		showPopupBackground();
	})
 	$(".detailviewBg, .popupCloseSingle").live('click', function() {
		
		closePopup();
	})
	

 	$(".popupMulti").live("click", function(e)
	{
		e.preventDefault();
		if(multipopupActiv)
		{
			createPopupFrame($(this).attr("href"), "popupCloseMulti");
		} else {
			createPopupFrame($(this).attr("href"), "popupCloseSingle", true);
			showPopupBackground();
		}
		
	})
 	$(".popupCloseMulti").live('click', function() {
		$(this).parent().fadeOut("fast", function()
		{
			$(this).parent().remove();
		});
		POPUPOFFSET--;
	})
 }


function closePopup()
{
	hidePopupBackground();
	$(".detailPopup").fadeOut("fast", function()
	{
		$(".detailPopup").remove();
	});
	POPUPOFFSET = 0;
}
function hidePopupBackground()
{
	$(".detailviewBg").fadeOut("fast");
}
function showPopupBackground()
{
	$(".detailviewBg").fadeIn("fast");
}



function createPopupFrame(target, popuptype, multipopupinfo, withPrefix)
{
	var str = '<div class="detailPopup" style="left:'+30*POPUPOFFSET+'px;top:'+30*POPUPOFFSET+'px;"><div>'
	str +=			'<img src="images/popup/popup-close_btn.png" class="'+ popuptype +' popupCloseBtn"> 	\
					<table> \
						<tr> \
							<td style="background: url(images/popup/p_tl.png) left top no-repeat; width:33px; height:28px;"></td> \
							<td style="background: url(images/popup/p_t.png) repeat-x;"></td> \
							<td style="background: url(images/popup/p_tr.png) left top no-repeat; width:35px; height:28px;"></td> \
						</tr> \
						<tr> \
							<td style="background: url(images/popup/p_l.png) repeat-y;"></td> \
							<td style="background-color:white;"><div id="popup'+POPUPOFFSET+'" class="popupContent" style="height:500px;">\
							 <img src="images/preloader.gif" style="margin: 40px 90px;">\
							</div></td> \
							<td style="background: url(images/popup/p_r.png) repeat-y;"></td> \
						</tr> \
						<tr> \
							<td style="background: url(images/popup/p_bl.png) left top no-repeat; width:33px; height:28px;"></td> \
							<td style="background: url(images/popup/p_b.png) repeat-x;"></td> \
							<td style="background: url(images/popup/p_br.png) left top no-repeat; width:35px; height:28px;"></td> \
						</tr> \
					</table> \
				</div></div> \
			';
		$("body").append(str)
		if(popuptype == "popupCloseMulti") $(".detailPopup").draggable();
		resizeSinglePopup(popuptype);
	
	var targetURL = popupURLPrefix+target;
	if(withPrefix == false) targetURL = target;
	
	//alert(targetURL)
	$.ajax({
		type: "GET",
		url: "assets/ExternalContentLoader.php?url="+targetURL,
		success: function(data){
			$("#popup"+POPUPOFFSET).html(data);
			resizeSinglePopup(popuptype);
			POPUPOFFSET++;
			$('.popupContent').jScrollPane();
			if(multipopupinfo && multipopupinfoShow) multiPopupInfo();
		}
	});
	
}


function resizeSinglePopup(popuptype)
{
	if(popuptype == "popupCloseSingle")
	{
		$(".detailPopup").css({
			top: $(window).height()/2 - $(".detailPopup").height()/2,
			left: $(window).width()/2 - $(".detailPopup").width()/2
			})
	}
}


function multiPopupInfo()
{
	var str = 	'<div class="multipopupinfo"><div>Aktiviere die Multiansicht, dann hast du mehr Kontrolle über die Popups<br><br> \
				<a href="javascript:multipopupOn()">Aktivieren</a> <a href="javascript:multipopupInfoHide()">Info ausblenden</a><br> \
				</div><img src="images/popup/tail-bottom.png"></div>';
	$(".detailPopup").append(str)
	$(".multipopupinfo").hide().delay(1000).fadeIn("normal");
}


function multipopupInfoHide()
{
	multipopupinfoShow = false;
	$(".multipopupinfo").fadeOut("fast").remove();
}
function multipopupOn()
{
	multipopupActiv = true;
	$(".detailPopup").draggable();
	hidePopupBackground();
	$(".popupCloseBtn").removeClass("popupCloseSingle").addClass("popupCloseMulti");
	$(".multipopupinfo").fadeOut("fast",function(){multiPopupInfoTwo()});
}

function multiPopupInfoTwo()
{
	$(".multipopupinfo").remove();
	var str = 	'<div class="multipopupinfo" style="top:-18px;"><div>Jetzt kannst du das Popup verschieben und andere Angebote öffnen! \
				</div><img src="images/popup/tail-bottom.png"></div>';
	$(".detailPopup").append(str)
	$(".multipopupinfo").hide().fadeIn("normal").delay(3000).fadeOut("fast");
}