function Container()
{
	this.spacing = 2;
	this.centerComponent = null;
	this.eastComponent = null;
	this.northComponent = null;
	this.southComponent = null;
	this.westComponent = null;
	this.layout = false;
}

function container_createComponent(content, va, ha)
{
	var vertical = "middle";
	var horizontal = "left";

	if(arguments[1] != "undefined")
	{
		if(arguments[1] == "top" || arguments[1] == "bottom")
		{
			vertical = arguments[1];
		}
		if(arguments[1] == "center" || arguments[1] == "right")
		{
			horizontal = arguments[1];
		}
	}
	if(arguments[2] != "undefined")
	{
		if(arguments[2] == "center" || arguments[2] == "right")
		{
			horizontal = arguments[2];
		}
	}

	return new Component(content, vertical, horizontal);
}


function container_createContainerHtml()
{
	var columns = 0;
	if(this.westComponent != null) columns++;
	if(this.centerComponent != null) columns++;
	if(this.eastComponent != null) columns++;
	if(columns == 0 && this.northComponent != null) columns++;
	if(columns == 0 && this.southComponent != null) columns++;

	if(columns == 0) return "No components have been added to this container...";

	var cHtml = "<table width='100%' ";
	cHtml += "cellpadding='0' cellspacing='" + this.spacing + "'>";

	if(this.northComponent != null)
	{
		cHtml += "<tr>";
		cHtml += "<td colspan='" + columns + "' ";
		if(this.layout) cHtml += "style='border: 1px dotted red;' ";
		cHtml += "valign='" + this.northComponent.verticalAlignment + "' ";
		cHtml += "align='" + this.northComponent.horizontalAlignment + "' >";
		cHtml += this.northComponent.getHtml();
		cHtml += "</td>";
		cHtml += "</tr>";
	}

	if(this.westComponent != null ||
		this.centerComponent != null ||
		this.eastComponent != null)
	{
		cHtml += "<tr>";
		if(this.westComponent != null)
		{
			cHtml += "<td ";
			if(this.layout) cHtml += "style='border: 1px dotted red;' ";
			cHtml += "valign='" + this.westComponent.verticalAlignment + "' ";
			cHtml += "align='" + this.westComponent.horizontalAlignment + "'>";
			cHtml += this.westComponent.getHtml();
			cHtml += "</td>";
		}
		if(this.centerComponent != null)
		{
			cHtml += "<td ";
			if(this.layout) cHtml += "style='border: 1px dotted red;' ";
			cHtml += "valign='" + this.centerComponent.verticalAlignment + "' ";
			cHtml += "align='" + this.centerComponent.horizontalAlignment + "'>";
			cHtml += this.centerComponent.getHtml();
			cHtml += "</td>";
		}
		if(this.eastComponent != null)
		{
			cHtml += "<td ";
			if(this.layout) cHtml += "style='border: 1px dotted red;' ";
			cHtml += "valign='" + this.eastComponent.verticalAlignment + "' ";
			cHtml += "align='" + this.eastComponent.horizontalAlignment + "'>";
			cHtml += this.eastComponent.getHtml();
			cHtml += "</td>";
		}
		cHtml += "</tr>";
	}

	if(this.southComponent != null)
	{
		cHtml += "<tr>";
		cHtml += "<td colspan='" + columns + "' ";
		if(this.layout) cHtml += "style='border: 1px dotted red;' ";
		cHtml += "valign='" + this.southComponent.verticalAlignment + "' ";
		cHtml += "align='" + this.southComponent.horizontalAlignment + "'>";
		cHtml += this.southComponent.getHtml();
		cHtml += "</td>";
		cHtml += "</tr>";
	}

	cHtml += "</table>";

	return cHtml;
}

function container_getHtml()
{
	return this.createContainerHtml();
}

function container_paintLayout(paint)
{
	this.layout = paint;
}

function container_setCenterComponent(c, vAlign, hAlign)
{
	this.centerComponent = Container.createComponent(c, vAlign, hAlign);
}

function container_setEastComponent(c, vAlign, hAlign)
{
	this.eastComponent = Container.createComponent(c, vAlign, hAlign);
}

function container_setNorthComponent(c, vAlign, hAlign)
{
	this.northComponent = Container.createComponent(c, vAlign, hAlign);
}

function container_setSouthComponent(c, vAlign, hAlign)
{
	this.southComponent = Container.createComponent(c, vAlign, hAlign);
}

function container_setSpacing(space)
{
	this.spacing = space;
}

function container_setWestComponent(c, vAlign, hAlign)
{
	this.westComponent = Container.createComponent(c, vAlign, hAlign);
}

Container.createComponent = container_createComponent;
Container.prototype.createContainerHtml = container_createContainerHtml;
Container.prototype.getHtml = container_getHtml;
Container.prototype.setCenterComponent = container_setCenterComponent;
Container.prototype.setEastComponent = container_setEastComponent;
Container.prototype.setNorthComponent = container_setNorthComponent;
Container.prototype.paintLayout = container_paintLayout;
Container.prototype.setSouthComponent = container_setSouthComponent;
Container.prototype.setSpacing = container_setSpacing;
Container.prototype.setWestComponent = container_setWestComponent;

