/* 
 Script: menu.js
 
 Author:
  Caleb Kniffen, <http://knifenwebdesign.com>
 
 Version:
  1.6

 Class: Menu
  A simple menu widget. 
*/

Menu = Class.create();
Menu.prototype = {
 /*
  Function: intialize
   Initializes the Menu.
   
  Arguments:
   menu - HTML ELEMENT, The Menu's content.
   button - HTML ELEMENT, The button that when pressed will show Menu.
   options - object, An options object.
 */
 initialize: function(menu,button,options){
  this.menu=$(menu);
  this.button=$(button);
  $S(this.menu).position = 'absolute';
  $(this.menu).name = 'menu';
  this._setOptions(options);
  //this.button.onmouseup = this.toggle.bindAsEventListener(this);
  this.button.onmouseover = this.show.bindAsEventListener(this);
  switch(this.options.align){
   case 'center': this.position = function(elem,elemPos){this.center(elem,elemPos);}; break;
   case 'left'  : this.position = function(elem,elemPos){this.left(elem,elemPos);}; break;
  }
  if(this.options.hide == true) this.hide();
 },
 /*
  Function: toggle
   Toggles the Menu.
   
  Arguments: 
   e - Event, The event object for the click on the HTML Element designated for displaying the Menu.
 */
 toggle: function(e){
  elem = (isIE) ? e.srcElement : e.target;
  
  if ($S(this.menu).visibility!="visible" || elem != this.button) this.show(this.button);
  else this.hide();
 },
  /*
  Function: show
   Shows the Menu and hides all other menus.
   
  Argument
   element - HTML ELEMENT, The Element that was clicked to show the menu.
 */
 show: function(element){
  element = this.button;
  menus = $EN('menu')
  for(x=0;x<menus.length;x++){ $S(menus[x]).visibility = 'hidden'; }
  document.onmousemove = this.clickCheck.bindAsEventListener(this);
  //this.button = element
  elemPos = CurrentPosition(element);
  this.position(element,elemPos);
  $S(this.menu).visibility='visible';
 },
 /*
  Function: hide
   Hides the Menu.
 */
 hide: function(){
  $S(this.menu).visibility="hidden";
  document.onclick=null;
 },
 /*
  Function: position
   Is bound to either center or left functions according to options settings.
 */
  position:function(){},
 /*
  Function: center
   Shows the Menu centered under button.
 */
 center:function(elem,elemPos){
  elemCenter=elemPos.x
  $S(this.menu).left = (elemCenter + 1) +'px';
  $S(this.menu).top = (elemPos.y+21) + 'px';
 },
 /*
  Function: left
   Shows the Menu with its left side against the button.
 */
 left:function(elem,elemPos){
  elemLeft=elem.offsetWidth+elemPos.x
  $S(this.menu).left = elemLeft+2+'px';
  $S(this.menu).top = elemPos.y+'px';
 },
  /*
  Function: clickCheck
   Called when user clicks anywhere on the page. Checks to see if the menu was clicked or something else.
 */
 clickCheck:function(e){
  if(e==null) e = window.event;
  target = (isIE) ? e.srcElement : e.target;
  if(target!=$(this.menu) && !isParent(target,$(this.menu)) && target!=this.button && !isParent(target,$(this.button))) this.hide();
 },
 /*
  Function: _setOptions
   Sets the Menus's options.
  
  Arguments:
   options - Object, An options object.
 */
 _setOptions:function(options){
  this.options = { align:'center', hide:true }
  Object.extend(this.options, options || {});
 }
 /*
  Var: options
   object, An Options object.
  
  Var: menu 
    HTML ELEMENT, The Menu's content.
	
  Var: button
   HTML ELEMENT, The last element that when clicked called the toggle function.
  
  Option: align
   center|left, defaults to 'center', Desides where to position the Menu.
   
  Option: hide
   boolean, defaults to true, Whether or not to hide  Menu on initialization.
 */
};