jQuery(document).ready(function() {
	
	var thickBox = document.createElement('div');
	$(".panoramablok, .panoramatitel").click(function(){
		
		var klikVal = $(this).attr("id");
		var klikId 	= klikVal.substr(0,1);
		var klikPos = klikVal.substr(10,11);
		var panorama = $("#hidPanorama").attr("value");
		
		thickBox.setAttribute("id", "panorama_thickbox");
		$("#content_holder").append(thickBox);
		
		var srcString = "includes/trendpanorama_popup.asp?id=" + klikId + "&pos=" + klikPos + "&trendpanorama=" + escape(panorama);
		createFrame("panorama_frame", srcString, 880, 565, "panorama_thickbox");
		
		var closeButton = document.createElement('div');
		closeButton.setAttribute("id", "pano_close");
		$("#panorama_thickbox").append(closeButton);
		
		$("#pano_close").hover(
			function () {
				$(this).css("background-image", "url(/img/panorama_sluiten_hover.gif)");
			  }, 
			  function () {
				$(this).css("background-image", "url(/img/panorama_sluiten.gif)");
			  }
		);			
		$("#pano_close").click(function(){
			// Delete popup
			$("#pano_close").remove();
			$("#panorama_frame").remove();
			$("#panorama_thickbox").remove();
		});
		
		return false;
	});
	
	function createFrame(id, source, width, height, attach) {
		var panoFrame = document.createElement('iframe');
		panoFrame.setAttribute("id", id);
		panoFrame.setAttribute("src", source);
		panoFrame.setAttribute("width", width);
		panoFrame.setAttribute("height", height);
		panoFrame.setAttribute("frameborder", 0);
		panoFrame.setAttribute("allowtransparency", 1);
		panoFrame.setAttribute("cellspacing", 0);
		
		$("#"+attach).append(panoFrame);
	}
});
