src/src/ux/MenuButton.js

   1 /**
   2  * User extention designed to be used on the BB10 platform.
   3  *
   4  * @private
   5  */
   6 Ext.define('Ext.ux.MenuButton', {
   7     extend: 'Ext.Button',
   8     requires: ['Ext.ux.ContextMenu'],
   9
  10     config: {
  11         /**
  12          * @hide
  13          */
  14         ui: 'tab',
  15
  16         /**
  17          * @hide
  18          */
  19         cls: 'menu',
  20
  21         menuConfig: {},
  22
  23         menuItems: [],
  24
  25         /**
  26          * @hide
  27          */
  28         menuSide: 'right',
  29
  30         /**
  31          * @hide
  32          */
  33         menuCover: false,
  34
  35         /**
  36          * @hide
  37          */
  38         menuCls: null,
  39
  40         /**
  41          * @hide
  42          */
  43         listeners: {
  44             tap: 'onTap'
  45         }
  46     },
  47
  48     /**
  49      * @private
  50      * Used to show the menu associated with this button
  51      */
  52     onTap: function(e) {
  53         if (this.$menu) {
  54             this.$menu.destroy();
  55         }
  56
  57         this.element.addCls('x-open');
  58
  59         this.$menu = Ext.create('Ext.ux.ContextMenu', Ext.apply({}, this.getMenuConfig(), {
  60             cls: this.getMenuCls(),
  61             items: this.getMenuItems(),
  62             listeners: {
  63                 scope: this,
  64                 hide: function() {
  65                     if (this.$menu) {
  66                         this.element.removeCls('x-open');
  67                         Ext.Viewport.removeMenu(this.getMenuSide());
  68                         this.$menu.destroy();
  69                     }
  70                 }
  71             }
  72         }));
  73
  74         this.$menu.on({
  75             scope: this,
  76             tap: this.onMenuButtonTap,
  77             delegate: 'button'
  78         });
  79
  80         Ext.Viewport.setMenu(this.$menu, {
  81             side: this.getMenuSide(),
  82             cover: this.getMenuCover()
  83         });
  84
  85         Ext.Viewport.showMenu(this.getMenuSide());
  86     },
  87
  88     onMenuButtonTap: Ext.emptyFn
  89 });