// function: Rectangle
// Container class to attributes of a rectangle
// Rectangle represents the orbit of a control.
function Rectangle (left, top, width, height) {
	this.left = (null != left ? left : 0);
	this.top = (null != top ? top : 0);
	this.width = (null != width ? width : 0);
	this.height = (null != height ? height : 0);
	this.right = left + width;
	this.bottom = top + height;
}

// function GetXY
// returns the x & y position of an element
function GetXY (elem) {
	var offset = null;
	var pos = [];
	var box;
	if (elem.getBoundingClientRect) {
		box = elem.getBoundingClientRect();
		var scrlTop = document.documentElement.scrollTop || document.body.scrollTop;
		var scrlLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
		var x = box.left + scrlLeft - 2;
		var y = box.top + scrlTop - 2;
		return [x, y];
	}
	else {
		if (document.getBoxObjectFor) {
			box = document.getBoxObjectFor(el);
			pos = [box.x - 1, box.y - 1];
		}
		else {
			pos = [elem.offsetLeft, elem.offsetTop];
			offset = elem.offsetParent;
			if (offset != el) {
				while (offset) {
					pos[0] += offset.offsetLeft;
					pos[1] += offset.offsetTop;
					offset = offset.offsetParent;
				}
			}
		}
	}
	if (window.opera) {
		offset = elem.offsetParent;
		while (offset && offset.tagName.toUpperCase() != "BODY" && offset.tagName.toUpperCase() != "HTML") {
			pos[0] -= offset.scrollLeft;
			pos[1] -= offset.scrollTop;
			offset = offset.offsetParent;
		}
	}
	else {
		offset = elem.parentNode;
		while (offset && offset.tagName.toUpperCase() != "BODY" && offset.tagName.toUpperCase() != "HTML") {
			pos[0] -= offset.scrollLeft;
			pos[1] -= offset.scrollTop;
			offset = offset.parentNode;
		}
	}
	return pos;
}

// function: GetElementRect
// returns the rectangle object for the given element
function GetElementRect (elem) {
	if (!elem) {
		elem = this;
	}
	var pos = GetXY(elem);
	var left = pos[0];
	var top = pos[1];
	var width = elem.offsetWidth;
	var height = elem.offsetHeight;
	return new Rectangle(left, top, width, height);
}

// function: DisplayLoadingPanel
// displays the loading panel over the given content panel.
// parameters: contentPanId - id of content panel
// parameters: loadPanId - id of loading panel
function DisplayLoadingPanel (contentPanId, loadPanId) {
	var loadingPanelZIndex = 120000;
	var transparency = 25; // In percentage;
   var loadPan = document.getElementById(loadPanId);
   if (loadPan != null) 
   {
      var contentPan = document.getElementById(contentPanId);

      var rect = GetElementRect(contentPan);
      loadPan.style.position = "absolute";
      loadPan.style.width = rect.width + "px";
      loadPan.style.height = rect.height + "px";
      loadPan.style.left = rect.left + "px";
      loadPan.style.top = rect.top + "px";
      loadPan.style.textAlign = "center";
      loadPan.style.zIndex = loadingPanelZIndex;
      loadPan.style.backgroundColor ='#ffffff';
      var opacity = 100 - parseInt(transparency);
      if (parseInt(transparency) > 0) {
        if (loadPan.style && loadPan.style.MozOpacity != null) {
            loadPan.style.MozOpacity = opacity / 100;
        }
        else  {
            if (loadPan.style && loadPan.style.opacity != null) {
                loadPan.style.opacity = opacity / 100;
            }
            else  {
                if (loadPan.style && loadPan.style.filter != null) {
                    loadPan.style.filter = "alpha(opacity=" + opacity + ");";
                }
            }
        }
      }
      else  {
        contentPan.style.display = 'none';
      }
      loadPan.style.display = '';
   }
};

// function: HideLoadingPanel
// hides the loading panel, that was apearing over the content panel
// parameters: contentPanId - id of content panel
// parameters: loadPanId - id of loading panel
function HideLoadingPanel (contentPanId, loadPanId) {
   var loadPan = document.getElementById(loadPanId);
   var contentPan = document.getElementById(contentPanId);
   contentPan.style.display = '';
   loadPan.style.display = 'none';
}