X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/b37ceabb82336ee82757cd32efe353cfab8ec267..f5240829880f87e0cf581c6a296e436fdef0ef80:/docs/resources/TabCloseMenu.js diff --git a/docs/resources/TabCloseMenu.js b/docs/resources/TabCloseMenu.js new file mode 100644 index 00000000..6725fc1d --- /dev/null +++ b/docs/resources/TabCloseMenu.js @@ -0,0 +1,150 @@ +/*! + * Ext JS Library 3.2.1 + * Copyright(c) 2006-2010 Ext JS, Inc. + * licensing@extjs.com + * http://www.extjs.com/license + */ +/** + * @class Ext.ux.TabCloseMenu + * @extends Object + * Plugin (ptype = 'tabclosemenu') for adding a close context menu to tabs. Note that the menu respects + * the closable configuration on the tab. As such, commands like remove others and remove all will not + * remove items that are not closable. + * + * @constructor + * @param {Object} config The configuration options + * @ptype tabclosemenu + */ +Ext.ux.TabCloseMenu = Ext.extend(Object, { + /** + * @cfg {String} closeTabText + * The text for closing the current tab. Defaults to 'Close Tab'. + */ + closeTabText: 'Close Tab', + + /** + * @cfg {String} closeOtherTabsText + * The text for closing all tabs except the current one. Defaults to 'Close Other Tabs'. + */ + closeOtherTabsText: 'Close Other Tabs', + + /** + * @cfg {Boolean} showCloseAll + * Indicates whether to show the 'Close All' option. Defaults to true. + */ + showCloseAll: true, + + /** + * @cfg {String} closeAllTabsText + *

The text for closing all tabs. Defaults to 'Close All Tabs'. + */ + closeAllTabsText: 'Close All Tabs', + + constructor : function(config){ + Ext.apply(this, config || {}); + }, + + //public + init : function(tabs){ + this.tabs = tabs; + tabs.on({ + scope: this, + contextmenu: this.onContextMenu, + destroy: this.destroy + }); + }, + + destroy : function(){ + Ext.destroy(this.menu); + delete this.menu; + delete this.tabs; + delete this.active; + }, + + // private + onContextMenu : function(tabs, item, e){ + this.active = item; + var m = this.createMenu(), + disableAll = true, + disableOthers = true, + closeAll = m.getComponent('closeall'); + + m.getComponent('close').setDisabled(!item.closable); + tabs.items.each(function(){ + if(this.closable){ + disableAll = false; + if(this != item){ + disableOthers = false; + return false; + } + } + }); + m.getComponent('closeothers').setDisabled(disableOthers); + if(closeAll){ + closeAll.setDisabled(disableAll); + } + + e.stopEvent(); + m.showAt(e.getPoint()); + }, + + createMenu : function(){ + if(!this.menu){ + var items = [{ + itemId: 'close', + text: this.closeTabText, + scope: this, + handler: this.onClose + }]; + if(this.showCloseAll){ + items.push('-'); + } + items.push({ + itemId: 'closeothers', + text: this.closeOtherTabsText, + scope: this, + handler: this.onCloseOthers + }); + if(this.showCloseAll){ + items.push({ + itemId: 'closeall', + text: this.closeAllTabsText, + scope: this, + handler: this.onCloseAll + }); + } + this.menu = new Ext.menu.Menu({ + items: items + }); + } + return this.menu; + }, + + onClose : function(){ + this.tabs.remove(this.active); + }, + + onCloseOthers : function(){ + this.doClose(true); + }, + + onCloseAll : function(){ + this.doClose(false); + }, + + doClose : function(excludeActive){ + var items = []; + this.tabs.items.each(function(item){ + if(item.closable){ + if(!excludeActive || item != this.active){ + items.push(item); + } + } + }, this); + Ext.each(items, function(item){ + this.tabs.remove(item); + }, this); + } +}); + +Ext.preg('tabclosemenu', Ext.ux.TabCloseMenu); \ No newline at end of file