git.roojs.org Git - roojs1/blob - Roo/menu/BaseItem.js

   1 /*
   2  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * <script type="text/javascript">
  10  */
  11
  12
  13 /**
  14  * @class Roo.menu.BaseItem
  15  * @extends Roo.Component
  16  * @abstract
  17  * The base class for all items that render into menus.  BaseItem provides default rendering, activated state
  18  * management and base configuration options shared by all menu components.
  19  * @constructor
  20  * Creates a new BaseItem
  21  * @param {Object} config Configuration options
  22  */
  23 Roo.menu.BaseItem = function(config){
  24     Roo.menu.BaseItem.superclass.constructor.call(this, config);
  25
  26     this.addEvents({
  27         /**
  28          * @event click
  29          * Fires when this item is clicked
  30          * @param {Roo.menu.BaseItem} this
  31          * @param {Roo.EventObject} e
  32          */
  33         click: true,
  34         /**
  35          * @event activate
  36          * Fires when this item is activated
  37          * @param {Roo.menu.BaseItem} this
  38          */
  39         activate : true,
  40         /**
  41          * @event deactivate
  42          * Fires when this item is deactivated
  43          * @param {Roo.menu.BaseItem} this
  44          */
  45         deactivate : true
  46     });
  47
  48     if(this.handler){
  49         this.on("click", this.handler, this.scope, true);
  50     }
  51 };
  52
  53 Roo.extend(Roo.menu.BaseItem, Roo.Component, {
  54     /**
  55      * @cfg {Function} handler
  56      * A function that will handle the click event of this menu item (defaults to undefined)
  57      */
  58     /**
  59      * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to false)
  60      */
  61     canActivate : false,
  62
  63      /**
  64      * @cfg {Boolean} hidden True to prevent creation of this menu item (defaults to false)
  65      */
  66     hidden: false,
  67
  68     /**
  69      * @cfg {String} activeClass The CSS class to use when the item becomes activated (defaults to "x-menu-item-active")
  70      */
  71     activeClass : "x-menu-item-active",
  72     /**
  73      * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to true)
  74      */
  75     hideOnClick : true,
  76     /**
  77      * @cfg {Number} hideDelay Length of time in milliseconds to wait before hiding after a click (defaults to 100)
  78      */
  79     hideDelay : 100,
  80
  81     // private
  82     ctype: "Roo.menu.BaseItem",
  83
  84     // private
  85     actionMode : "container",
  86
  87     // private
  88     render : function(container, parentMenu){
  89         this.parentMenu = parentMenu;
  90         Roo.menu.BaseItem.superclass.render.call(this, container);
  91         this.container.menuItemId = this.id;
  92     },
  93
  94     // private
  95     onRender : function(container, position){
  96         this.el = Roo.get(this.el);
  97         container.dom.appendChild(this.el.dom);
  98     },
  99
 100     // private
 101     onClick : function(e){
 102         if(!this.disabled && this.fireEvent("click", this, e) !== false
 103                 && this.parentMenu.fireEvent("itemclick", this, e) !== false){
 104             this.handleClick(e);
 105         }else{
 106             e.stopEvent();
 107         }
 108     },
 109
 110     // private
 111     activate : function(){
 112         if(this.disabled){
 113             return false;
 114         }
 115         var li = this.container;
 116         li.addClass(this.activeClass);
 117         this.region = li.getRegion().adjust(2, 2, -2, -2);
 118         this.fireEvent("activate", this);
 119         return true;
 120     },
 121
 122     // private
 123     deactivate : function(){
 124         this.container.removeClass(this.activeClass);
 125         this.fireEvent("deactivate", this);
 126     },
 127
 128     // private
 129     shouldDeactivate : function(e){
 130         return !this.region || !this.region.contains(e.getPoint());
 131     },
 132
 133     // private
 134     handleClick : function(e){
 135         if(this.hideOnClick){
 136             this.parentMenu.hide.defer(this.hideDelay, this.parentMenu, [true]);
 137         }
 138     },
 139
 140     // private
 141     expandMenu : function(autoActivate){
 142         // do nothing
 143     },
 144
 145     // private
 146     hideMenu : function(){
 147         // do nothing
 148     }
 149 });