var Lightbox = Class.create();

Lightbox.prototype = {
	initialize: function(el)
	{
		this.el = el;
		this.el.hide();
		
		// Reference element
		this.window = window;
		this.reference_el = $('page_area');
		this.footer_el = $('page_footer');
		
		// Display area
		this.display_area_el = fetchSingleElement(this.el, ".display_area");
		this.display_area_el.hide();
		
		// Background
		this.background_el = fetchSingleElement(this.el, ".background");
				
		// Buttons area
		this.buttons_area_el = new Element("div").addClassName("buttons_area").update("&nbsp;");
		this.display_area_el.appendChild(this.buttons_area_el);
		
		// Content
		this.content_el = new Element("div").addClassName("content").update("&nbsp;");
		this.display_area_el.appendChild(this.content_el);
		
		// contents
		this.contents = [];
		
		// buttons
		this.close_button = new Element("span").addClassName("image_button").update("<img src=\"/img/components/close_lightbox.gif\" title=\"Close\" alt=\"Close\" />");
		this.buttons_area_el.appendChild(this.close_button);
		
		// Dragabble
		this.drag_interface = new YAHOO.util.DD(this.display_area_el);
		this.drag_interface.setHandleElId("lightbox_drag_handle");
		
		// Apply event on window
		Element.observe(this.window, "resize", function(event)
		{
			if ( this.el.visible() )	
			{
				this.resizeBackground();
				this.resizeDisplayArea();
				
				this.setDragConstraint();
			}
			
		}.bind(this));
		
		// Apply events
		this.close_button.observe("click", function(event)
		{
			this.close();
			
		}.bind(this));
		
		
		/*
		this.el.observe("click", function(event)
		{
			var display_area_size = this.display_area_el.getDimensions();
			var display_area_position = this.display_area_el.positionedOffset();
			
			if ( event.pointerX() >= display_area_position[0] && event.pointerX() <= (display_area_position[0] + display_area_size.width) &&
				 event.pointerY() >= display_area_position[1] && event.pointerY() <= (display_area_position[1] + display_area_size.height) )
			{
			}
			else
			{
				this.display_area_el.hide();
				this.el.hide();
			}
			
		}.bind(this));
		*/
	},
	
	close: function()
	{
		this.display_area_el.hide();
		this.el.hide();
		this.hideAllContents();
		this.reference_el.select('select').invoke('show');
	},
	
	resizeBackground: function()
	{
		var reference_el_size = this.reference_el.getDimensions();
		var footer_el_size = this.footer_el.getDimensions();
		var viewport_size = document.viewport.getDimensions();
		
		reference_el_size.height += footer_el_size.height;
		
		var background_size = {
			width: (viewport_size.width < reference_el_size.width ? reference_el_size.width : viewport_size.width),
			height: (viewport_size.height < reference_el_size.height ? reference_el_size.height : viewport_size.height)
		};
		
		this.el.setStyle({
			width: parseInt(background_size.width)+"px",
			height: parseInt(background_size.height)+"px"
		});
	},
	
	resizeDisplayArea: function()
	{
		var viewport_size = document.viewport.getDimensions();
		var display_area_size = this.display_area_el.getDimensions();
		
		var viewport_scroll = document.viewport.getScrollOffsets();
		
		var display_area_position = {
			top:  (viewport_size.height / 2) - (display_area_size.height / 2) + viewport_scroll[0],
			left: (viewport_size.width / 2) - (display_area_size.width / 2)
		};
		
		this.display_area_el.setStyle({
			left: parseInt(display_area_position.left)+"px",
			top: parseInt(display_area_position.top)+"px"
		});
		
	},
	
	setDragConstraint: function()
	{
		var background_size = this.background_el.getDimensions();
		var display_area_position = this.display_area_el.positionedOffset();
		var display_area_size = this.display_area_el.getDimensions();
		
		// Constraint
		this.drag_interface.resetConstraints();
		this.drag_interface.setXConstraint(display_area_position[0], background_size.width - display_area_position[0] - display_area_size.width);
		this.drag_interface.setYConstraint(display_area_position[1], background_size.height - display_area_position[1] - display_area_size.height);
	},
	
	addContent: function(tag, content_el)
	{
		if ( this.findTaggedContent(tag) == null && this.findContent(content_el) == null )
		{
			var new_content = {tag: tag, content_el:content_el};
			this.contents.push(new_content);
			
			this.content_el.appendChild(content_el);
			content_el.hide();
		}
	},
	
	hideAllContents: function()
	{
		this.contents.each( function(content, content_index)
		{
			content.content_el.hide();
			
		}.bind(this));
	},
	
	findContent: function(content_el)
	{
		var found_content = null;
		this.contents.each( function(content, content_index)
		{
			if ( content.content_el == content_el )
			{
				found_content = content;
				throw $break;
			}
		}.bind(this));
		
		return found_content;
	},
	
	findTaggedContent: function(tag)
	{
		var found_content = null;
		this.contents.each( function(content, content_index)
		{
			if ( content.tag == tag )
			{
				found_content = content;
				throw $break;
			}
		}.bind(this));
		
		return found_content;
	},
	
	display: function(tag)
	{	
		var content = this.findTaggedContent(tag);
		
		this.hideAllContents();
		if ( content != null ) 
		{
			content.content_el.show();
		}
		
		// hide all SELECT
		this.reference_el.select('select').invoke('hide');
		
		this.el.show();
		this.display_area_el.show();
		
		this.resizeBackground();
		this.resizeDisplayArea();
		
		this.el.fire("lightbox:display", {});
		
		this.setDragConstraint();
	
	}
};