/*
	element.js
	version 1.0
	Rob van Aarle
	=============
	
	A javascript for manipulating HTML elements.
	
	06-12-2006: initial release
*/

/*
	Shortcut function to get the Javascript pointer to an element
*/
function getElem(elementId)
{
	if(document.getElementById && document.getElementById(elementId))
		return document.getElementById(elementId);
  else if (document.all && document.all(elementId))
		return document.all(elementId);
  else if (document.layers && document.layers[elementId])
		return document.layers[elementId];
  else
		return false;
} // getElem

/*
	class Element
	Implements functions to manipulate HTML elements using DOM.
*/
function Element(elemId)
{
	this.elementId = elemId;
	
	if (typeof(_element_prototype_called) == 'undefined')
  {
     _element_prototype_called = true;
     Element.prototype.getElement = getElement;
     Element.prototype.getStyle = getStyle;
     Element.prototype.setStyleAttribute = setStyleAttribute;
     Element.prototype.setStyleAttributes = setStyleAttributes;
     Element.prototype.getStyleAttribute = getStyleAttribute;
     Element.prototype.hide = hide;
     Element.prototype.show = show;
     Element.prototype.getPosition = getPosition;
     Element.prototype.setPosition = setPosition;
     Element.prototype.move = move;
     Element.prototype.getHeight = getHeight;
     Element.prototype.getWidth = getWidth;
     Element.prototype.setHeight = setHeight;
     Element.prototype.setWidth = setWidth;
     Element.prototype.setSize = setSize;
     Element.prototype.setValue = setValue;
     Element.prototype.getValue = getValue;
     Element.prototype.getId = getId;
     Element.prototype.setAttribute = setAttribute;
     Element.prototype.getAttribute = getAttribute;
     Element.prototype.setClassname = setClassname;
  }
	
	function getElement()
	{
		return getElem(this.elementId);
	} // getElement
	
	function setClassname(name)
	{
		var elem = this.getElement();
		elem.className = name;
	} // setClassname
	
	function setAttribute(attribute, val)
	{
		var elem = this.getElement();
		elem.setAttribute(attribute, val);
	} // setAttribute
	
	function getAttribute(attribute)
	{
		var elem = this.getElement();
		return elem.getAttribute(attribute);
	} // getAttribute
	
	function getId()
	{
		return this.elementId;
	} // getId

	function setValue(value)
	{
		var elem = this.getElement();
		
		if (elem.value != undefined)
			elem.value = value;
		else if (document.layers)
		{
			var lyr = document.layers[this.elementId].document;
			lyr.open();
			lyr.write(value);
			lyr.close();
		}
		else
			elem.innerHTML = value;
	} // setValue

	function getValue()
	{
		var elem = this.getElement();
		
		if (elem.value != undefined)
			return elem.value;
		else if (document.layers)
			return false;
		else
			return elem.innerHTML;
	} // getValue

	/*
		CSS functions
	*/
	function getStyle()
	{
		
	  if(document.getElementById && document.getElementById(this.elementId))
			return document.getElementById(this.elementId).style;
	  else if (document.all && document.all(this.elementId))
			return document.all(this.elementId).style;
	  else if (document.layers && document.layers[this.elementId])
			return document.layers[this.elementId];
	  else
			return false;
	} // getStyle
	
	function setStyleAttribute(attribute, val)
	{
		var elemStyle = this.getStyle();
		elemStyle[attribute] = val;
	} // setStyleAttribute
	
	function setStyleAttributes(attributes)
	{
		var elemStyle = this.getStyle();
		for (attribute in attributes)
			elemStyle[attribute] = attributes[attribute];
	} // setStyleAttributes
	
	function getStyleAttribute(attribute)
	{
		var elemStyle = this.getStyle();
		return elemStyle[attribute];
	} // getStyleAttribute
	
	function hide()
	{
		this.setStyleAttribute('visibility', 'hidden');
	} // hide

	function show()
	{
		this.setStyleAttribute('visibility', 'visible');
	} // show
	
	function getPosition()
	{
		/*
		var elemStyle = this.getStyle();
		var left = parseInt(elemStyle.left);
		var top = parseInt(elemStyle.top);
		return {x:left, y:top};
		*/
		
		var elem = this.getElement();
		
		var left = 0;
		var top  = 0;

		while (elem.offsetParent)
		{
			left += elem.offsetLeft;
			top += elem.offsetTop;
			elem = elem.offsetParent;
		}
	
		left += elem.offsetLeft;
		top += elem.offsetTop;
	
		return {x:left, y:top};
	} // getPosition
	
	function setPosition(x, y)
	{
		var elemStyle = this.getStyle();
		
	  if (document.layers)
	  {
	    elemStyle.left = x;
	    elemStyle.top = y;
	  }
	  else 
	  {
	    elemStyle.left = x + 'px';
	    elemStyle.top = y + 'px';  
	  }
	} // setPosition
	
	function move(dx, dy)
	{
		var pos = this.getPosition();
		this.setPosition(pos.x + dx, pos.y + dy);
	} // move
	
	function getHeight()
	{
		return parseInt(this.getStyleAttribute('height'));
	} // getHeight
	
	function getWidth()
	{
		return parseInt(this.getStyleAttribute('width'));
	} // getWidth
	
	function setHeight(height)
	{
		this.setStyleAttribute('height', height);
	} // setHeight
	
	function setWidth(width)
	{
		this.setStyleAttribute('width', width);
	} // setWidth
	
	function setSize(width, height)
	{
		this.setHeight(height);
		this.setWidth(width);
	} // setSize
	
} // class Element