function popupwindow(TargetUrl)
	{
	var win = new Window({
		className: "mac_os_x", 
		title: "", 
		width:900, 
		height:500, 
		top:40, 
		url: TargetUrl,
		destroyOnClose:true
			}) 
//	win.show(); 
	win.showCenter(); 
	}
	
function ajaxpop(TargetUrl)
{
Dialog.info({url: TargetUrl, options: {method: 'get'}}, 
	{
	className: "mac_os_x", 
	width:800, 
	minHeight:500, 
	closable:true,
	draggable:true,
	resizable:true,
	destroyOnClose:true
	});
}



/*
popup.js 
popupdiv. Handig gebruik binnen cake met de popupdiv helper.
heel sec code, maakt divs met de volgende id's
	popupblocker (over de hele pagina) ->altijd absolute
	popup -> altijd absolute, geef in elk geval een grootte op
		popuploading (wordt getoond tijdens laden: hierin dus een ajax-loader stoppen) -> altijd absolute, binnen de popup
		popupclose: heeft een onclick voor het sluiten van het geheel -> altijd absolute
		popupcontent: hierin komt de ajax content -> altijd absolute

die dus in stylesheet ofzo verder afwerken, in elk geval een grootte geven!
Elk van deze divs kan ook al bestaan, dan wordt de bestaande gebruikt. Er wordt dan nog wel gerommeld met abs-plaatsing enzo!
Handig om content erin te doen. Bijvoorbeeld alleen de close:
<div id="popupclose" style="display: none;">Sluiten</div>

alle a hrefs van class inpopup worden via de popup getoond
maar je kan ook popup.open(..) met een link aanroepen
Veronderstelt prototype.js

(c) Spin in het Web, Ugchelen. Geen toestemming tot kopieren tenzij schriftelijk overeengekomen
*/

var popupClass = Class.create({

	initialize: function()
	{
		// member variables
		this.popup = null;	//de popupdiv
		this.blocker = null; //de blocker eromheen
		this.ajaxKlaar = false;
		
		//uitstellen tot alles geladen is
		document.observe('dom:loaded',this.initPopup.bind(this));
	},

	initPopup: function()
	{
		//zorg dat alle a hrefs met inpopup via ons gaan
		$$('.inpopup').each(function (a)
		{
				Event.observe(a, 'click', this.openLink.bindAsEventListener(this, a));
				a.onclick = function() {return false;};
		}.bind(this));
	},

	openLink: function(e, a)
	{
		//er is op een link geklikt, dus we openen de popup
		this.open(a.href);
	},

	_checkMaakDivs : function()
	{
		//maak de divs. Als er al een div is met de juiste id, dan gebruiken we die. zo kunnen we dus in de app
		//onderdelen alvast definieren
		if (! this.popup )
		{
			if ($('popup'))
				this.popup = $('popup');
			else
				this.popup = new Element('div',{id : 'popup'});
			this.popup.setStyle({display: 'none', position: 'absolute', zIndex: 100});
			if ($('popuploading'))
				subdiv = $('popuploading');
			else
				subdiv = new Element('div',{id : 'popuploading'});
			subdiv.setStyle({display: 'none', position: 'absolute'});
			this.popup.insert(subdiv);
			
			if($('tooltip'))
				tooltip = $('tooltip');
			else
				tooltip = new Element('a', {id : 'tooltip', href : '#', title : 'Klik hier om terug te gaan' });
			tooltip.setStyle({position: 'absolute'});
			

			if ($('popupclose'))
				subdiv = $('popupclose');
			else
				subdiv = new Element('div',{id : 'popupclose'});
			subdiv.setStyle({position: 'absolute'});
			tooltip.insert(subdiv);
			this.popup.insert(tooltip);
			tooltip.show(); //binnen de andere div

			if ($('popupcontent'))
				subdiv = $('popupcontent');
			else
				subdiv = new Element('div',{id : 'popupcontent'});
			subdiv.setStyle({position: 'absolute'});
			this.popup.insert(subdiv);
			subdiv.show(); //binnen de andere div

			if ($('popupblocker'))
				this.blocker = $('popupblocker');
			else
				this.blocker  = new Element('div',{id : 'popupblocker'});
			this.blocker .setStyle({display: 'none', position: 'absolute', zIndex: 99});

			document.body.appendChild(this.popup);
			document.body.appendChild(this.blocker);
			Event.observe('popupclose','click',this.close.bind(this)); //never mind the event
		}
	},

	open : function(url)
	{
		this._checkMaakDivs();

		this.showBlocker();
		vpd = document.viewport.getDimensions();
		vpo = document.viewport.getScrollOffsets();
		this.popup.setStyle({
				left: (vpo.left + Math.max((vpd.width - this.popup.getWidth()) / 2,0)) + 'px',
				top: (vpo.top + Math.max((vpd.height - this.popup.getHeight()) / 3,0)) + 'px'
			});

		this.ajaxKlaar = false;

		new Ajax.Updater('popupcontent',url,
						{evalScripts: "force", //CAMELCASE!!
							onLoading: this.ajaxLoading.bind(this),
							onComplete: this.ajaxComplete.bind(this)
						});
		this.popup.show();
	},

	stilleActie: function(url,naActie, naFout)
	{
		/*
			voer de opgegeven url uit als stilleActie. Zolang de actie duurt tonen we de blokker en de loader
			als de actie klaar is voeren we naActie uit, met de respons als argument
			Als het misgaat voeren naFout, zonder (vastgestelde) argumenten, uit.
			Acties kunnen null zijn, dan gebeurt er niets
		*/

		this._checkMaakDivs();
		this.ajaxKlaar = false;
		this.showBlocker();
		var options = {
				evalScript: true,
				onLoading: this.ajaxLoading.bind(this),
				onComplete: function(response,json)
				{
					this.ajaxComplete();
					this.hideBlocker();
				}.bind(this),
				onException: function(req, ex)
				{
					alert(ex.message);
					this.ajaxComplete();
					this.hideBlocker();
				}.bind(this)
			};
		if (naActie)
		{
			options.onSuccess = naActie;
		}

		if (naFout)
		{
			options.onFailure = naFout;
		}
		R = new Ajax.Request(url,options);
	},

	ajaxLoading: function()
	{
		if (! this.ajaxKlaar) //anders is de complete er voor de loading, dat komt echt voor
		{
			$('popuploading').show();
		}
	},

	ajaxComplete: function ()
	{
		$('popuploading').hide();
		this.ajaxKlaar = true; //voor het geval dat ajaxLoading nog moet draaien
//		document.fire("popup:loaded");
	},

	showBlocker: function()
	{
		this._checkMaakDivs();
		vpd = document.viewport.getDimensions();
		vpo = document.viewport.getScrollOffsets();
		this.blocker.setStyle({left: vpo.left + 'px', top: vpo.top + 'px', width: vpd.width + 'px', height: vpd.height + 'px'});
		this.blocker.show();
		this.resizeBlockerEvent = this.resizeBlocker.bindAsEventListener(this); //bewaren voor unload
		Event.observe(window,'scroll',this.resizeBlockerEvent);
		Event.observe(window,'resize',this.resizeBlockerEvent);
	},


	resizeBlocker : function(e)
	{
		//resize de blocker
		vpd = document.viewport.getDimensions();
		vpo = document.viewport.getScrollOffsets();
		this.blocker.setStyle({left: vpo.left + 'px', top: vpo.top + 'px', width: vpd.width + 'px', height: vpd.height + 'px'});
	},

	hideBlocker : function()
	{
		if (this.blocker)
		{
			//anders is hij niet zichtbaar
			this.blocker.hide();
			if (this.resizeBlockerEvent)
			{
				Event.stopObserving(window,'scroll',this.resizeBlockerEvent);
				Event.stopObserving(window, 'resize',this.resizeBlockerEvent);
				this.resizeBlockerEvent = null;
			}
		}
	},

	close :	function()
	{
		//weg ermee
		if (this.popup)
		{
			var puContentChild = $('popupcontent').firstDescendant();
			if(puContentChild)
				puContentChild.remove();
			this.popup.hide();
			$('popupcontent').update();
			this.hideBlocker();
		}
	}


});

var popup = new popupClass;

