XFormsShape.prototype = new XFormsControl;

function XFormsShape (strParentId, strAlert, strHelp, strHint, strAccesskey, strAppearance, strClass, bDisabled, strEllipseheight, strEllipsewidth, strId, nNavindex, strStyle, strTag, strVisibility, strUserDefineAttrib)
{
	if (!strId)
	{
		return;
	}
	
	XFormsControl.call(this, strParentId, strAlert, strHelp, strHint, strAccesskey, strClass, bDisabled, strId, nNavindex, strStyle, strTag, strVisibility, strUserDefineAttrib);

	this.m_ObjChildDiv = document.getElementById("HE_" + strId + "_ChildDiv");

	/**
	 * Attribute
	 */
	this.attribute["appearance"] = strAppearance;
	this.attribute["ellipseheight"] = strEllipseheight;
	this.attribute["ellipsewidth"] =  strEllipsewidth;
	
	/**
	 * Property
	 */
};

/**
 * TF System Method
 */
XFormsShape.prototype.init = function ()
{
	XFormsControl.prototype.init.call(this);
	
	if (this.attribute["appearance"] != "rectangle")
	{
		this.m_heControl.style.borderColor = "";
		this.m_heControl.style.borderWidth = "";
		this.m_heControl.style.borderStyle = "";
		this.m_heControl.style.backgroundColor = "";
		this.m_heControl.style.backgroundImage = "";
		this.m_heControl.style.backgroundRepeat = "";
		this.m_heControl.style.backgroundStretch = "";
		this.m_heControl.style.backgroundPosition = "";
		this.draw();
	}
	this.resizeControl();
};

XFormsShape.prototype.setAttribute = function (strAttribute, strValue)
{
	XFormsControl.prototype.setAttribute.call(this, strAttribute, strValue);
};

XFormsShape.prototype.draw = function ()
{
	if (this.attribute["appearance"] == "ellipse")
	{
		var strCurrentWidth = this.attribute["width"];
		var strCurrentHeight = this.attribute["height"];
		var nCurrentWidth;
		var nCurrentHeight;
		
		if (strCurrentWidth.substring(strCurrentWidth.length-1, strCurrentWidth.length) == "%")
		{
			var nParentWidth = this.m_heControl.parentNode.clientWidth;
			nCurrentWidth = nParentWidth * parseInt(strCurrentWidth.replace("%","")) / 100;
		}
		else
		{
			nCurrentWidth = parseInt(this.attribute["width"].replace("px",""));
		}

		if (strCurrentHeight.substring(strCurrentHeight.length-1, strCurrentHeight.length) == "%")
		{
			var nParentHeight = this.m_heControl.parentNode.clientHeight;
			nCurrentHeight = nParentHeight * parseInt(strCurrentHeight.replace("%","")) / 100;
		}
		else
		{
			nCurrentHeight = parseInt(this.attribute["height"].replace("px",""));
		}
		
		var strBorderColor = this.attribute["border-color"];
		if (!strBorderColor)
		{
			strBorderColor = "#000000";
		}
		
		var strBorderWidth = this.attribute["border-width"];
		if (!strBorderWidth)
		{
			strBorderWidth = "1";
		}
		
		var strBorderStyle = this.attribute["border-style"];
		if (!strBorderStyle)
		{
			strBorderStyle = "solid";
		}
		
		this.m_ObjChildDiv.parentNode.removeChild(this.m_ObjChildDiv);
		this.m_ObjChildDiv = document.createElement("div");
		this.m_ObjChildDiv.id = "HE_" + this.attribute["id"] + "_ChildDiv";
		this.m_heControl.appendChild(this.m_ObjChildDiv);

		var objGraphics = new jsGraphics("HE_" + this.attribute["id"] + "_ChildDiv");

		if (this.attribute["background-color"] && this.attribute["background-color"] != "" && this.attribute["background-color"] != "transparent")
		{
			// TODO 임시 테스트
			objGraphics.setColor(this.attribute["background-color"]);
			objGraphics.fillEllipse(0, 0, nCurrentWidth, nCurrentHeight);
		}
		
		if (strBorderStyle != "none")
		{
			var nBorderWidth = parseInt(strBorderWidth.replace("px",""));
			
			if (nBorderWidth == 1 && (strBorderStyle == "dotted" || strBorderStyle == "dashed"))
			{
				objGraphics.setStroke();
			}
			else
			{
				objGraphics.setStroke(nBorderWidth);
			}

			var nStartPosition = Math.floor(nBorderWidth / 2) * -1;
			objGraphics.setColor(strBorderColor);
			objGraphics.drawEllipse(nStartPosition, nStartPosition, nCurrentWidth-1, nCurrentHeight-1);
		}
		
		objGraphics.paint();

		if (this.attribute["visibility"] != "hidden")
		{
			this.setAttribute("visibility", "visible");
		}
	}
	else if (this.attribute["appearance"] == "roundrect")
	{
		var strCurrentWidth = this.attribute["width"];
		var strCurrentHeight = this.attribute["height"];
		var nCurrentWidth;
		var nCurrentHeight;

		if (strCurrentWidth.substring(strCurrentWidth.length-1, strCurrentWidth.length) == "%")
		{
			var nParentWidth = this.m_heControl.parentNode.clientWidth;
			nCurrentWidth = nParentWidth * parseInt(strCurrentWidth.replace("%","")) / 100;
		}
		else
		{
			nCurrentWidth = parseInt(this.attribute["width"].replace("px",""));
		}

		if (strCurrentHeight.substring(strCurrentHeight.length-1, strCurrentHeight.length) == "%")
		{
			var nParentHeight = this.m_heControl.parentNode.clientHeight;
			nCurrentHeight = nParentHeight * parseInt(strCurrentHeight.replace("%","")) / 100;
		}
		else
		{
			nCurrentHeight = parseInt(this.attribute["height"].replace("px",""));
		}
		
		var strBorderColor = this.attribute["border-color"];
		if (!strBorderColor)
		{
			strBorderColor = "#000000";
		}
		
		var strBorderWidth = this.attribute["border-width"];
		if (!strBorderWidth)
		{
			strBorderWidth = "1";
		}
		
		var strBorderStyle = this.attribute["border-style"];
		if (!strBorderStyle)
		{
			strBorderStyle = "solid";
		}

		this.m_ObjChildDiv.parentNode.removeChild(this.m_ObjChildDiv);
		this.m_ObjChildDiv = document.createElement("div");
		this.m_ObjChildDiv.id = "HE_" + this.attribute["id"] + "_ChildDiv";
		this.m_heControl.appendChild(this.m_ObjChildDiv);

		var objGraphics = new jsGraphics("HE_" + this.attribute["id"] + "_ChildDiv");
		var nEllipseWidth = parseInt(this.attribute["ellipsewidth"]);
		var nEllipseHeight = parseInt(this.attribute["ellipseheight"]);

		if (this.attribute["background-color"] && this.attribute["background-color"] != "" && this.attribute["background-color"] != "transparent")
		{
			objGraphics.setColor(this.attribute["background-color"]);
			objGraphics.fillRoundrect(0, 0, nCurrentWidth, nCurrentHeight, nEllipseWidth, nEllipseHeight);
		}
		
		if (strBorderStyle != "none")
		{
			var nBorderWidth = parseInt(strBorderWidth.replace("px",""));
			
			if (nBorderWidth == 1 && (strBorderStyle == "dotted" || strBorderStyle == "dashed"))
			{
				objGraphics.setStroke();
			}
			else
			{
				objGraphics.setStroke(nBorderWidth);
			}

			var nStartPosition = Math.floor(nBorderWidth / 2) * -1;
			objGraphics.setColor(strBorderColor);
			objGraphics.drawRoundrect(nStartPosition, nStartPosition, nCurrentWidth, nCurrentHeight, nEllipseWidth, nEllipseHeight);
		}
		
		objGraphics.paint();

		if (this.attribute["visibility"] != "hidden")
		{
			this.setAttribute("visibility", "visible");
		}
	}
};

XFormsShape.prototype.resize = function ()
{
	if (this.attribute["appearance"] != "rectangle")
	{
		var strWidth = this.attribute["width"];
		var strHeight = this.attribute["height"];
		if (null != strWidth && null != strHeight)
		{
			if (strWidth.substring(strWidth.length-1,strWidth.length) == "%" || strHeight.substring(strHeight.length-1,strHeight.length) == "%")
			{
				this.draw();
			}
		}	
	}
};

XFormsShape.create = function (strParentId, clAttribute, strStyle)
{
	// 메인노드 생성
	var xnShape = XFormsShape.createMainNode(clAttribute);
	var xnParent = document.getElementById("HE_"+strParentId);
	xnParent.appendChild(xnShape);

	// 하위노드 생성
	xnShape = XFormsShape.createSubNodes(xnShape, clAttribute);

	// object 생성
	return XFormsShape.createObject(strParentId, xnShape, clAttribute, strStyle);
};

XFormsShape.createMainNode = function (clAttribute)
{
	var xnShape = document.createElement("div");

	xnShape = XFormsShape.createAttribute(xnShape, clAttribute);

	var strAppearance = clAttribute.exists("appearance") ? clAttribute.item("appearance") : "";
	
	if (strAppearance != "rectangle" && strAppearance != "ellipse" && strAppearance != "roundrect")
	{
		xnShape.setAttribute("appearance", "rectangle");
	}
	else
	{
		xnShape.setAttribute("appearance", strAppearance);
	}
	
	if (clAttribute.exists("ellipsewidth") != "")
	{
		xnShape.setAttribute("ellipsewidth", clAttribute.item("ellipsewidth"));
	}
	else
	{
		xnShape.setAttribute("ellipsewidth", "");
	}

	if (clAttribute.exists("ellipseheight"))
	{
		xnShape.setAttribute("ellipseheight", clAttribute.item("ellipseheight"));
	}
	else
	{
		xnShape.setAttribute("ellipseheight", "");
	}
	
	if (xnShape.getAttribute("appearance", "rectangle"))
	{
		HtmlLib.setStyle(xnShape, "visibility", "hidden");
	}

	xnShape = XFormsShape.createStyle(xnShape, clAttribute);
	
	return xnShape;
};

XFormsShape.createSubNodes = function (xnShape, clAttribute)
{
	// 상위의 아이디를 가져온다.
	var strId = clAttribute.item("id");

	// 생성/삭제시 활용할 Child DIV
	var xnShapeChild = document.createElement("div");
	xnShapeChild.id = "HE_" + strId + "_ChildDiv";
	xnShape.appendChild(xnShapeChild);
	
	return xnShape;
};

XFormsShape.createObject = function (strParentId, xnShape, clAttribute, strStyle)
{
	var strClass = "";
	var bDisabled = false;
	var strEllipseHeight = xnShape.getAttribute("ellipseheight");
	var strEllipseWidth = xnShape.getAttribute("ellipsewidth");
	var strId = "";
	var nNavindex = 9007199254740992;
	var strVisibility = "visible";
	var strObjType = xnShape.getAttribute("appearance");
	var strUserDefineAttrib = "";

	for (var i=0; i<clAttribute.count(); i++)
	{
		var strAttributeName = clAttribute.keys()[i];
		switch (strAttributeName)
		{
			case "class" :
			{
				strClass = clAttribute.item(strAttributeName);
				break;
			}
			case "disabled" :
			{
				break;
			}
			case "id" :
			{
				strId = clAttribute.item(strAttributeName);
				break;
			}
			case "navindex" :
			{
				nNavindex = parseInt(clAttribute.item(strAttributeName));
				break;
			}
			case "visibility" :
			{
				strVisibility = clAttribute.item(strAttributeName);
				break;
			}
			
			// roundRect attribute
			case "ellipseheight" :
			{
				break;
			}
			case "ellipsewidth" :
			{
				break;
			}
			
			case "appearance" :
			{
				// 변수 선언부에 strObjType으로 선언되어 있음. 통과.
				break;
			}
			default :
			{
				if (!STYLE_LIST[strAttributeName])
				{
					strUserDefineAttrib += strAttributeName + ":" + clAttribute.item(strAttributeName) + "; ";
				}
				break;
			}
		}
	}
	var objShape = new XFormsShape(strParentId, "", "", "", "", strObjType, strClass, bDisabled, strEllipseHeight, strEllipseWidth, strId, nNavindex, strStyle, "xforms:shape", strVisibility, strUserDefineAttrib);
	return objShape;
};

XFormsShape.createAttribute = function (xnHtmlNode, clAttribute)
{
	xnHtmlNode = XFormsControl.createAttribute(xnHtmlNode, clAttribute);
	return xnHtmlNode;
};

XFormsShape.createStyle = function (xnHtmlNode, clAttribute)
{
	if (!clAttribute.exists("left"))
	{
		HtmlLib.setStyle(xnHtmlNode, "left", "0px");
	}

	if (!clAttribute.exists("top"))
	{
		HtmlLib.setStyle(xnHtmlNode, "top", "0px");
	}

	if (!clAttribute.exists("width"))
	{
		HtmlLib.setStyle(xnHtmlNode, "width", "0px");
	}

	if (!clAttribute.exists("height"))
	{
		HtmlLib.setStyle(xnHtmlNode, "height", "0px");
	}

	if (!clAttribute.exists("border-color"))
	{
		HtmlLib.setStyle(xnHtmlNode, "border-color", "#000000");
	}
	
	if (!clAttribute.exists("border-width"))
	{
		HtmlLib.setStyle(xnHtmlNode, "border-width", "1px");
	}
	
	if (!clAttribute.exists("border-style"))
	{
		HtmlLib.setStyle(xnHtmlNode, "border-style", "solid");
	}
	return xnHtmlNode;
};