NP_TrackBack/branches/DOM-branch/trackback/js/rico/ricoMenu.js

   1 Rico.Menu = Class.create();
   2
   3 Rico.Menu.prototype = {
   4
   5   initialize: function(options) {
   6     Object.extend(this, new Rico.Popup());
   7     Object.extend(this.options, {
   8       width        : "15em",
   9       margin       : 6   // account for shadow
  10     });
  11     if (typeof options=='string')
  12       this.options.width=options;
  13     else
  14       Object.extend(this.options, options || {});
  15     this.hideFunc=null;
  16     this.highlightElem=null;
  17     new Image().src = Rico.imgDir+'left.gif';
  18     new Image().src = Rico.imgDir+'right.gif';
  19   },
  20
  21   createDiv: function(parentNode) {
  22     if (this.div) return;
  23     this.div = document.createElement('div');
  24     this.div.className = Prototype.Browser.WebKit ? 'ricoMenuSafari' : 'ricoMenu';
  25     this.div.style.position="absolute";
  26     this.div.style.width=this.options.width;
  27     if (!parentNode) parentNode = document.getElementsByTagName("body")[0];
  28     parentNode.appendChild(this.div);
  29     this.width=this.div.offsetWidth
  30     this.setDiv(this.div,this.cancelmenu.bindAsEventListener(this));
  31     this.direction=Element.getStyle(this.div,'direction') || 'ltr';
  32     this.direction=this.direction.toLowerCase();  // ltr or rtl
  33     this.hidemenu();
  34     this.itemCount=0;
  35   },
  36
  37   showmenu: function(e,hideFunc){
  38     Event.stop(e);
  39     this.hideFunc=hideFunc;
  40     if (this.div.childNodes.length==0) {
  41       this.cancelmenu();
  42       return false;
  43     }
  44     this.openmenu(e.clientX,e.clientY,0,0);
  45   },
  46
  47   openmenu: function(x,y,clickItemWi,clickItemHt) {
  48     var newLeft=RicoUtil.docScrollLeft()+x;
  49     //window.status='openmenu: newLeft='+newLeft+' width='+this.width+' windowWi='+RicoUtil.windowWidth();
  50     if (this.direction == 'rtl') {
  51       if (newLeft > this.width+clickItemWi) newLeft-=this.width+clickItemWi;
  52     } else {
  53       if (x+this.width+this.options.margin > RicoUtil.windowWidth()) newLeft-=this.width+clickItemWi;
  54     }
  55     var newTop=RicoUtil.docScrollTop()+y;
  56     this.div.style.visibility="hidden";
  57     this.div.style.display="block";
  58     var contentHt=this.div.offsetHeight;
  59     if (y+contentHt+this.options.margin > RicoUtil.windowHeight())
  60       newTop=Math.max(newTop-contentHt+clickItemHt,0);
  61     this.openPopup(newLeft,newTop);
  62     this.div.style.visibility ="visible";
  63     return false;
  64   },
  65
  66   clearMenu: function() {
  67     this.div.innerHTML="";
  68     this.defaultAction=null;
  69     this.itemCount=0;
  70   },
  71
  72   addMenuHeading: function(hdg,translate) {
  73     var el=document.createElement('div')
  74     el.innerHTML =(translate==null || translate==true) ? RicoTranslate.getPhrase(hdg) : hdg;
  75     el.className='ricoMenuHeading';
  76     this.div.appendChild(el);
  77   },
  78
  79   addMenuBreak: function() {
  80     var brk=document.createElement('div');
  81     brk.className="ricoMenuBreak";
  82     this.div.appendChild(brk);
  83   },
  84
  85   addSubMenuItem: function(menutext, submenu, translate) {
  86     var dir=this.direction=='rtl' ? 'left' : 'right';
  87     var a=this.addMenuItem(menutext,null,true,null,translate);
  88     a.className='ricoSubMenu';
  89     a.style.backgroundImage='url('+Rico.imgDir+dir+'.gif)';
  90     a.style.backgroundRepeat='no-repeat';
  91     a.style.backgroundPosition=dir;
  92     a.onmouseover=this.showSubMenu.bind(this,a,submenu);
  93     a.onmouseout=this.subMenuOut.bindAsEventListener(this);
  94   },
  95
  96   showSubMenu: function(a,submenu) {
  97     if (this.openSubMenu) this.hideSubMenu();
  98     this.openSubMenu=submenu;
  99     this.openMenuAnchor=a;
 100     var pos=Position.page(a);
 101     if (a.className=='ricoSubMenu') a.className='ricoSubMenuOpen';
 102     submenu.openmenu(pos[0]+a.offsetWidth, pos[1], a.offsetWidth-2, a.offsetHeight+2);
 103   },
 104
 105   subMenuOut: function(e) {
 106     if (!this.openSubMenu) return;
 107     Event.stop(e);
 108     var elem=Event.element(e);
 109     var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
 110     try {
 111       while (reltg != null && reltg != this.openSubMenu.div)
 112         reltg=reltg.parentNode;
 113     } catch(err) {}
 114     if (reltg == this.openSubMenu.div) return;
 115     this.hideSubMenu();
 116   },
 117
 118   hideSubMenu: function() {
 119     if (this.openMenuAnchor) {
 120       this.openMenuAnchor.className='ricoSubMenu';
 121       this.openMenuAnchor=null;
 122     }
 123     if (this.openSubMenu) {
 124       this.openSubMenu.hidemenu();
 125       this.openSubMenu=null;
 126     }
 127   },
 128
 129   addMenuItem: function(menutext,action,enabled,title,translate,target) {
 130     this.itemCount++;
 131     if (translate==null) translate=true;
 132     var a = document.createElement(typeof action=='string' ? 'a' : 'div');
 133     if ( arguments.length < 3 || enabled ) {
 134       switch (typeof action) {
 135         case 'function':
 136           a.onclick = action;
 137           break;
 138         case 'string'  :
 139           a.href = action;
 140           if (target) a.target = target;
 141           break
 142       }
 143       a.className = 'enabled';
 144       if (this.defaultAction==null) this.defaultAction=action;
 145     } else {
 146       a.disabled = true;
 147       a.className = 'disabled';
 148     }
 149     a.innerHTML = translate ? RicoTranslate.getPhrase(menutext) : menutext;
 150     if (typeof title=='string')
 151       a.title = translate ? RicoTranslate.getPhrase(title) : title;
 152     a=this.div.appendChild(a);
 153     Event.observe(a,"mouseover", this.mouseOver.bindAsEventListener(this));
 154     Event.observe(a,"mouseout", this.mouseOut.bindAsEventListener(this));
 155     return a;
 156   },
 157
 158   mouseOver: function(e) {
 159     if (this.highlightElem && this.highlightElem.className=='enabled-hover') {
 160       // required for Safari
 161       this.highlightElem.className='enabled';
 162       this.highlightElem=null;
 163     }
 164     var elem=Event.element(e);
 165     if (this.openMenuAnchor && this.openMenuAnchor!=elem)
 166       this.hideSubMenu();
 167     if (elem.className=='enabled') {
 168       elem.className='enabled-hover';
 169       this.highlightElem=elem;
 170     }
 171   },
 172
 173   mouseOut: function(e) {
 174     var elem=Event.element(e);
 175     if (elem.className=='enabled-hover') elem.className='enabled';
 176     if (this.highlightElem==elem) this.highlightElem=null;
 177   },
 178
 179   isVisible: function() {
 180     return this.div && Element.visible(this.div);
 181   },
 182
 183   cancelmenu: function() {
 184     if (this.hideFunc) this.hideFunc();
 185     this.hideFunc=null;
 186     this.hidemenu();
 187   },
 188
 189   hidemenu: function() {
 190     if (!this.div) return;
 191     if (this.openSubMenu) this.openSubMenu.hidemenu();
 192     this.closePopup();
 193   }
 194
 195 };
 196
 197 Rico.includeLoaded('ricoMenu.js');