var PopUp = Class.create({
	
	dom_element: null,
	position: {
		x: 200,
		y: 200
	},
	title: 'Title',
	url_var: null,
	popup_obj: null,
	contents: null,
	
	initialize: function (options)
	{
		Object.extend(this, options || { } );
		this.__id__ = "popup_"+this.url_var;
		
		var close_img = new Image();
		close_img.src = 'images/controls/close.png';
		close_img.className = 'popup_close_icon';
		
		var popup_content = Builder.node('div', {className: 'popup_content'});
		$H(this.contents).each(function(elt){
			var layout = Builder.node('div', {id: "popup_layout_"+elt[0], className: 'popup_layout'});
			$(layout).update(elt[1]);
			elt[0] != this.url_var ? $(layout).hide() : null;
			$(popup_content).insert({bottom:layout});
		}.bind(this));
	
		this.popup_obj = 
		Builder.node('div', {id: this.getId(), className: 'popup_container', style: 'position:absolute; top:'+this.position.y+'px; left:'+this.position.x+'px'}, [
			Builder.node('div', {className: 'popup_head'}, [
				Builder.node('a', {id: 'close_'+this.getId(), href: 'javascript:void(0)', className: 'popup_close'}, [ "Fermer ", close_img ]),
				Builder.node('p', {className: 'popup_title'}, this.title)
			]), 
			popup_content
		]);
		$(this.popup_obj).hide();
	
		$$('body')[0].insert($(this.popup_obj));
		$(this.popup_obj).down('#close_'+this.getId().toString()) ? $(this.popup_obj).down('#close_'+this.getId().toString()).observe('click', this.toggle.bind(this), false) : null;
		if(this.draggable)
			new Draggable(this.getId());
	},
	
	show: function() 
	{
		$(this.popup_obj).appear({duration:0.3});
	},
	
	hide: function() 
	{
		$(this.popup_obj).fade({duration:0.3});
	},
	
	toggle: function() 
	{
		Effect.toggle($(this.popup_obj), "appear", {duration: 0.3});
	},
	
	getId: function() 
	{
		return this.__id__;
	},
	
	toggleBind: function(el, evt) 
	{
		if (!$(el)) {
			throw(el+" doesn't exist!");
			return false;
		}
		var evt = evt || 'click';
		Event.observe(el, evt, this.toggle.bind(this), false);
		return this;
	}
	
});