WWL.popbox = function ( name )
{
	var pop = new WWL ( 'popbox', name );

	pop._parent_div = null;
	pop._direction = "D";	// "U"P, "D"own, "L"eft and "R"ight
	pop._width = 0;
	pop._height = 0;
	pop._delta_x = 0;
	pop._delta_y = 0;
	pop._element = null;

	pop.set_parent = function ( div, direction )
	{
		if ( direction ) this._direction = String ( direction ).toUpperCase ();

		this._parent_div = div;
	};

	pop.set_delta = function ( x, y )
	{
		this._delta_x = x;
		this._delta_y = y;
	};

	pop.set_size = function ( width, height )
	{
		this._width = parseInt ( width, 10 );
		this._height = parseInt ( height, 10 );
	};

	pop.init = function ()
	{
		if ( ! this._element ) 
		{
			this._element = liwe.dom.create_element ( "div", this.id, document.body );
			this._element.style.display = "none";
		}

		return this._element;
	};

	pop.get = function ()
	{
		return this._element;
	};

	pop.show = function ( cback )
	{
		var pos = this._calc_pos ();
		var e;

		e = this.init ();

		e.style.top  = pos [ 'y' ] + "px";
		e.style.left = pos [ 'x' ] + "px";
		if ( this._width ) e.style.width = this._width + "px";
		if ( this._height ) e.style.height = this._height + "px";
		e.className = "wwl_popbox";

		e.style.display = 'block';

		this._element = e;

		return e;
	};

	pop.hide = function ( cback )
	{
		if ( ! this._element ) return;
	
		this._element.style.display = "none";
	};

	pop.is_hidden = function ()
	{ 
		if ( ! this._element ) return true;
		return ( this._element.style.display == "none" );
	};

	pop.destroy = function ()
	{
		if ( ! this._element ) return;

		document.body.removeChild ( this._element );
		this._element = null;
	};

	pop._calc_pos = function ()
	{
		var x = 0, y = 0;
		var size;

		if ( ! this._parent_div ) return { x: x, y: y };

		y = liwe.dom.get_offset_top ( this._parent_div );
		x = liwe.dom.get_offset_left ( this._parent_div );
		//size = liwe.dom.get_size ( this._parent_div );
		size = [ this._parent_div.offsetWidth, this._parent_div.offsetHeight ];

		switch ( this._direction )
		{
			case "D":
				y += size [ 1 ];
				break;

			case "U":
				y -= this._height;
				break;

			case "L":
				x -= this._width;
				break;

			case "R":
				x += size [ 0 ];
				break;
		}

		return { x: x + this._delta_x, y: y + this._delta_y };
	};

	return pop;
};

WWL.popbox.get_instance = function ( instance_name )
{
	return WWL.get_instance ( "popbox", instance_name );
};

// This is an internal function for popbox class only
WWL.popbox._set_class = function ( widget, div, class_name ) 
{ 
	div.className = WWL.mk_class_str ( widget, class_name );
};

WWL.popbox._int_events = {};

WWL.popbox._int_events [ 'over' ]     = function ( widget, div ) { WWL.popbox._set_class ( widget, div, "hover" ); };
WWL.popbox._int_events [ 'btn_down' ] = function ( widget, div ) { WWL.popbox._set_class ( widget, div, "click" ); };
WWL.popbox._int_events [ 'btn_up' ]   = function ( widget, div ) { WWL.popbox._set_class ( widget, div, "hover" ); }; 
WWL.popbox._int_events [ 'click' ]    = function ( widget, div ) { WWL.popbox._set_class ( widget, div, "hover" ); };
WWL.popbox._int_events [ 'out' ]      = function ( widget, div ) { WWL.popbox._set_class ( widget, div ); };