var ContentMenu = Class.create({
  initialize: function(anchor,content,round_borders,position)
  {
    if (round_borders===true)
    {
      this.round = 'ui-border-all';
    }
    this.shim = new Element('iframe', {
      style: 'display: none; background-color: #446622; left: 0px; position: absolute; top: 0px',
      src: "javascript:false;",
      frameBorder: "0",
      scrolling: "no"
		});
    this.ie = Prototype.Browser.IE;
    if (this.ie) 
    { 
      $(document.body).insert(this.shim);
    }
    this.position = position;
    obj = $(anchor);
    this.anchor = obj;
    if (obj)
    {
      Event.observe(obj,'mouseover',this.MouseOver.bind(this));
      Event.observe(obj,'mouseout',this.MouseOut.bind(this));
      Event.observe(obj,'click',this.Click.bind(this));
      if (!obj.visible())
      {
        obj.show();
      }
    }
    obj = $(content);
    this.content = obj;
    if (obj)
    {
      Event.observe(obj,'mouseover',this.MouseOverC.bind(this));
      Event.observe(obj,'mouseout',this.MouseOutC.bind(this));
      Event.observe(obj,'click',this.ClickC.bind(this));
      //Event.observe(obj,'mousemove',this.MoveC.bind(this));
      if (obj.visible())
      {
        obj.hide();
      }
    }
  },
  toJSON: function()
  {
    return Object.toJSON(this);
  },
  MouseOver: function(event)
  {
    var margin = 2;
    var offset = this.anchor.viewportOffset();
    var vpDim = document.viewport.getDimensions();
	  var vpOff = document.viewport.getScrollOffsets();
    var marginLeft = offset[0];
    var marginTop = offset[1];
    var absX = event.pointerX();
    var relX = absX - marginLeft;
    var absY = event.pointerY();
    var relY = absY - marginTop;
    var w = this.anchor.getWidth() - margin;
    var h = this.anchor.getHeight() - margin;
    if (this.content==null)
    {
      return;
    }
    if (!this.content.hasClassName(this.round))
    {
      this.content.addClassName(this.round);
    }
    var style;
    if (this.position==='right')
    {
      style = "position: absolute; left: " + (marginLeft+w) + "px; top: " + (marginTop) + "px;z-index:100;";
    }
    if (this.position==='bottom')
    {
      style = "position: absolute; left: " + (marginLeft) + "px; top: " + (marginTop+h) + "px;z-index:100;";
    }
    this.content_style = style;
    this.content.setStyle(style);
    if (!this.content.visible())
    {
      if (this.ie)
      {
        this.shim.setStyle(style + 'height:' + this.content.getHeight() + 'px;width:' + this.content.getWidth() + 'px;z-index:90;background-color:#AAFF55;');
        this.shim.show();
      }
      //Effect.Appear(this.content, {duration: 0.25})
      this.content.show();
    }
    //$('_bottom').innerHTML='MouseOver anchor';
  },
  MouseOut: function(event)
  {
    var margin = 2;
    var offset = this.anchor.viewportOffset();
    var marginLeft = offset[0];
    var marginTop = offset[1];
    var absX = event.pointerX();
    var relX = absX - marginLeft;
    var absY = event.pointerY();
    var relY = absY - marginTop;
    var w = this.anchor.getWidth() - margin;
    var h = this.anchor.getHeight() - margin;
    var out = 'none';
    if (relX<=margin)
    {
      out = 'left';
    }
    if (relX>=w)
    {
      out = 'right';
    }
    if (relY<=margin)
    {
      out = 'top';
    }
    if (relY>=h)
    {
      out = 'bottom';
    }
    if (out===this.position)
    {
      if (this.content)
      {
        if (!this.content.visible())
        {
          if (this.ie)
          {
            this.shim.show();
          }
          this.content.show();
        }
      }
    } else
    {
      if (this.content)
      {
        if (this.content.visible() && out!=='none')
        {
          if (this.ie)
          {
            this.shim.hide();
          }
          this.content.hide();
        }
      }
    }
    /*
    $('_bottom').innerHTML='MouseOut anchor ' + ' REL(' + relX + ',' + relY + ') '
    + ' ABS(' + absX + ',' + absY + ') w:' + w + ' h:' + h + ' out:' + out;
    */
  },
  Click: function(event)
  {
    //$('_bottom').innerHTML='MouseClick anchor';
  },
  MouseOverC: function(event)
  {
    if (!this.content.visible())
    {
      if (this.ie)
      {
        this.shim.show();
      }
      this.content.show();
    }
    //$('_bottom').innerHTML='MouseOver content';
  },
  MouseOutC: function(event)
  {
    if (this.content.visible())
    {
      if (this.ie)
      {
        this.shim.hide();
      }
      this.content.hide();
    }
    //$('_bottom').innerHTML='MouseOut click';
  },
  ClickC: function(event)
  {
    if (this.content.visible())
    {
      if (this.ie)
      {
        this.shim.hide();
      }
      this.content.hide();
    }
    //$('_bottom').innerHTML='MouseClick click';
  },
  MoveC: function(event)
  {
  }
});


function createMenu(name)
{
  var el = $(name);
  if (el == null)
  {
    return;
  }

  var m = $('SUB' + name);
  if (m != null)
  {
    m.hide();
    return obj_menu = new ContentMenu(name,'SUB' + name, false, 'bottom');
  }
}