var GUI_zIndex = 1;
var g_GUI_ObjectArray = new Array();



function GUI_Object()
{


  this.IsTargetOfClick = function(target)
  {
    while (target != document.body)
      if (target == this.m_htmlObject)
        return true;
      else
        target = target.offsetParent;
    return false;
  }




  this.GetPosition = function(target)
  {
    if (target == undefined)
      target = this.m_htmlObject;

    var w = target.offsetWidth;
    var h = target.offsetHeight;

    var offsetTrail = target;
    var offsetLeft = 0;
    var offsetTop = 0;
    while (offsetTrail)
    {
        offsetLeft += offsetTrail.offsetLeft;
        offsetTop += offsetTrail.offsetTop;

        offsetTrail = offsetTrail.offsetParent;
    }
    if (navigator.userAgent.indexOf("Mac") != -1 && 
        typeof document.body.leftMargin != "undefined") 
    {
        offsetLeft += document.body.leftMargin;
        offsetTop += document.body.topMargin;
    }

    return {left:offsetLeft, top:offsetTop};
  }


  this.GetSize = function(target)
  {
    if (target == undefined)
      target = this.m_htmlObject;
    return {width:target.offsetWidth, height:target.offsetHeight};    
  }


  this.MoveToFront = function()
  {
    if (GUI_zIndex != undefined)
    {
      this.m_dropShadow.style.zIndex = ++GUI_zIndex;
      this.m_htmlObject.style.zIndex = ++GUI_zIndex;
    }
  }



  this.SetPosition = function(x, y)
  {
    this.m_htmlObject.style.position = 'absolute';
    this.m_left = x;
    this.m_top = y;
    this.m_htmlObject.style.left = x;
    this.m_htmlObject.style.top = y;

    this.m_dropShadow.style.position = 'absolute';
    this.m_dropShadow.style.left = (x + 5) + 'px';
    this.m_dropShadow.style.top = (y + 5) + 'px';
  }



  this.Show = function()
  {
    if ((this.m_visible == true) && (this.m_fadeIn == false))
      return;

    if (this.m_fadeIn)
    {
      this.FadeIn(1, this.m_fadeStep);
    }
    else
    {
      this.m_opacity = 1;
      this.SetOpacity();
      this.SetVisibility(true);
    }
  }





  this.Hide = function()
  {
    if (this.m_fadeHide)
    {
      if (this.m_visible == false)
        return;
      this.FadeOut(1, this.m_fadeStep);
    }
    else
      this.SetVisibility(false); 
 }





  this.CancelFade = function()
  {
    clearInterval(this.m_fadeHandle);
    this.m_fadeHandle = 0;
  }



  this.SetFadeFilter = function()
  {
    if (this.m_fadeFilterSet)
      return;

    if (typeof this.m_htmlObject.style.opacity == 'undefined')
    {
      this.m_useAlphaFilter = true;
      this.m_htmlObject.style.filter = 'progid:DXImageTransform.Microsoft.alpha()';
      this.m_dropShadow.style.filter = 'progid:DXImageTransform.Microsoft.alpha()';
    }

    this.m_fadeFilterSet = true;
  }


  this.SetOpacity = function()
  {
    this.SetFadeFilter();
    if (this.m_opacity < 0)
      this.m_opacity = 0;
    if (this.m_opacity >= 1)
      this.m_opacity = 1;

    var dsOpacity = this.m_opacity * this.m_dropShadowOpacity;
    if (this.m_useAlphaFilter)
    {
      this.m_dropShadow.style.filter = 'progid:DXImageTransform.Microsoft.alpha(opacity=' + (dsOpacity * 100) + ')';
      this.m_htmlObject.style.filter = 'progid:DXImageTransform.Microsoft.alpha(opacity=' + (this.m_opacity * 100) + ')';
    }
    else
    {
      this.m_dropShadow.style.opacity = dsOpacity;
      this.m_htmlObject.style.opacity = this.m_opacity;
    }
  }




  this.FadeOut = function(speed, step)
  {
    if (this.m_fadeHandle != 0)
      this.CancelFade();
    else
    {
      this.m_opacity = 1.0;
      this.SetOpacity();
    }
    if (step != undefined)
      this.m_fadeStep = step;
    g_GUI_ObjectArray[this.m_id] = this;
    var st = "var obj = g_GUI_ObjectArray['" + this.m_id + "']; obj.ContFadeOut();";
    this.m_fadeHandle = setInterval(st, speed);
  }


  this.ContFadeOut = function()
  {
    if (this.m_opacity <= 0)
    {
      this.SetOpacity();
      this.CancelFade();
      if (this.m_onHide)
        this.m_onHide();
      this.SetVisibility(false);
    }
    else
    {
      this.m_opacity -= this.m_fadeStep;
      this.SetOpacity();
    }
  }



  this.FadeIn = function(speed, step)
  {
    if (this.m_fadeHandle != 0)
      this.CancelFade();
    else
    {
      this.m_opacity = 0.001;
      this.SetOpacity();
    }
    if (step != undefined)
      this.m_fadeStep = step;
    g_GUI_ObjectArray[this.m_id] = this;
    this.SetOpacity();
    this.SetVisibility(true);
    var st = "var obj = g_GUI_ObjectArray['" + this.m_id + "']; obj.ContFadeIn();";
    this.m_fadeHandle = setInterval(st, speed);
  }


  this.ContFadeIn = function()
  {
    if (this.m_opacity >= 1)
    {
      this.m_htmlObject.style.opacity = 1;
      this.SetOpacity();
      this.CancelFade();
    }
    else
    {
      this.m_opacity += this.m_fadeStep;
      this.SetOpacity();
    }
  }




  this.GetStyle = function(style)
  {
    return this.m_style[style];
  }


  this.GetStyles = function()
  {
    return this.m_style;
  }


  this.AssertStyle = function()
  {
    if (this.m_styleChanged)
    {
      this.m_styleChanged = false;
      for (var property in this.m_style)
      {
        switch (property)
        {
          case 'bgImage':
		this.m_htmlObject.style.backgroundImage = this.m_style[property];
		break;

          case 'cursor':
		this.m_htmlObject.style.cursor = this.m_style[property];
		break;

          case 'bgPosition':
		this.m_htmlObject.style.backgroundPosition = this.m_style[property];
		break;

          case 'bgRepeat':
		this.m_htmlObject.style.backgroundRepeat = this.m_style[property];
		break;

          case 'bgColor': 
            this.m_htmlObject.style.backgroundColor = this.m_style[property];
            break;

          case 'font': 
            this.m_htmlObject.style.font = this.m_style[property];
            break;

          case 'fontColor': 
            this.m_htmlObject.style.color = this.m_style[property];
            break;

          case 'border': 
            this.m_htmlObject.style.border = this.m_style[property];
            break;

          case 'borderLeft': 
            this.m_htmlObject.style.borderLeft = this.m_style[property];
            break;

          case 'borderRight': 
            this.m_htmlObject.style.borderRight = this.m_style[property];
            break;

          case 'borderTop': 
            this.m_htmlObject.style.borderTop = this.m_style[property];
            break;

          case 'borderBottom': 
            this.m_htmlObject.style.borderBottom = this.m_style[property];
            break;

         case 'width':
            this.m_htmlObject.style.width = this.m_style[property];
            this.m_width = this.m_style[property];
            break;

          case 'height':
            this.m_htmlObject.style.height = this.m_style[property];
            this.m_height = this.m_style[property];
            break;

          case 'dropShadow':
            if ((this.m_style[property] == 'true') || (this.m_style[property] == true))
              this.m_dropShadow.style.display = '';
            else
              this.m_dropShadow.style.display = 'none';
            break;

          case 'dropShadowOpacity':
	    this.m_dropShadowOpacity = parseFloat(this.m_style[property]);
            this.m_dropShadow.style.opacity = this.m_style[property];
            if (document.all)
            {
              var val = this.m_style[property];
              if (isNaN(val))
                val = parseFloat(val);
              val *= 100;
              this.m_dropShadow.style.filter = 'progid:DXImageTransform.Microsoft.alpha(opacity=' + val + ')';
            }
            break;

          case 'dropShadowColor':
            this.m_dropShadow.style.backgroundColor = this.m_style[property];
            break;

          case 'fadeIn':
            this.m_fadeShow = ((this.m_style[property] == 'true') || (this.m_style[property] == true));
	    break;

          case 'fadeOut':
            this.m_fadeHide = ((this.m_style[property] == 'true') || (this.m_style[property] == true));
            break;

          case 'visible':
            this.m_visible = ((this.m_style[property] == 'true') || (this.m_style[property] == true));
            if (this.m_visible)
              this.Show();
            else
              this.Hide();
            break;
        }

        if (this.m_onSetStyle)
          this.m_onSetStyle(property, this.m_style[property]);
      }
    }
  }



  this.Redraw = function()
  {
    this.m_dropShadow.style.width = this.m_htmlObject.offsetWidth;
    this.m_dropShadow.style.height = this.m_htmlObject.offsetHeight;
    if (this.m_onRedraw)
      this.m_onRedraw();
  }




  this.SetVisibility = function(visible)
  {

    if (this.m_visible == visible)
      return;
    
    this.AssertStyle();
    this.m_visible = visible;
    this.CancelFade();

    if (this.m_visible)
    {
      if (this.m_onBeforeShow)
        this.m_onBeforeShow();
    }
    else
    {
      if (this.m_onBeforeHide)
        this.m_onBeforeHide();
    }

    if (this.m_parent)
    {
      if (this.m_visible)
      {
        this.m_parent.appendChild(this.m_dropShadow);
        this.m_parent.appendChild(this.m_htmlObject);
        this.m_dropShadow.style.width = this.m_htmlObject.offsetWidth;
        this.m_dropShadow.style.height = this.m_htmlObject.offsetHeight;
      }
      else
      {
        this.m_parent.removeChild(this.m_dropShadow);
        this.m_parent.removeChild(this.m_htmlObject);
      }
    }

    if (this.m_visible)
    {
      if (this.m_onShow)
        this.m_onShow();
    }
    else
    {
      if (this.m_onHide)
        this.m_onHide();
    }
  }  




  this.SetStyle = function(style, value)
  {
    if (this.m_style[style] != value)
    { 
      this.m_style[style] = value;
      this.m_styleChanged = true;
    }
    if (this.m_styleChanged)
      this.AssertStyle();
  }




  this.SetStyles = function(style)
  {
    for (var property in style)
      if (this.m_style[property] != style[property])
      {
        this.m_styleChanged = true;
        this.m_style[property] = style[property];
      }
    if (this.m_styleChanged)
      this.AssertStyle();
  }





  this.SetParent = function(parent)
  {
    if (this.m_parent == parent)
      return;

    if ((this.m_parent) && (this.m_visible))
    {
      this.m_parent.removeChild(this.m_dropShadow);
      this.m_parent.removeChild(this.m_htmlObject);
    }
    this.m_parent = parent;
    if ((this.m_parent) && (this.m_visible))
    {
      this.m_parent.appendChild(this.m_dropShadow);
      this.m_parent.appendChild(this.m_htmlObject);
      this.m_dropShadow.style.width = this.m_htmlObject.offsetWidth;
      this.m_dropShadow.style.height = this.m_htmlObject.offsetHeight;
    }
  }





  // member variable declarations:
  this.m_style = new Array();
  this.m_id = 'GUI_OBJECT_' + Math.random();
  this.m_GUI_ID = this.m_id;
  this.m_htmlObject = 0;

  this.m_dropShadow = document.createElement('div');
  this.m_dropShadow.style.opacity = '0.15';
  this.m_dropShadow.style.backgroundColor = '#c0c0c0';
  this.m_dropShadow.style.position = 'absolute';
  this.m_dropShadow.style.display = 'none';

  this.m_parent = 0;
  this.m_visible = false;
  this.m_onRedraw = 0;
  this.m_onSetStyle = 0;
  this.m_onBeforeShow = 0;
  this.m_onBeforeHide = 0;
  this.m_onShow = 0;
  this.m_onHide = 0;
  this.m_styleChanged = true;
 
  this.m_fadeShow = false;
  this.m_fadeHide = false;
  this.m_fadeHandle = 0;
  this.m_opacity = 100;
  this.m_dropShadowOpacity = 0.15;
  this.m_fadeFilterSet = false;
  this.m_useAlphaFilter = false;
  this.m_fadeStep = .05;
}





