-/*\r
- * Ext JS Library 2.2.1\r
- * Copyright(c) 2006-2009, Ext JS, LLC.\r
- * licensing@extjs.com\r
- * \r
- * http://extjs.com/license\r
- */\r
-\r
+/*!
+ * Ext JS Library 3.1.0
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
/**\r
* @class Ext.ux.StartMenu\r
* @extends Ext.menu.Menu\r
\r
Ext.namespace("Ext.ux");\r
\r
-Ext.ux.StartMenu = function(config){\r
- Ext.ux.StartMenu.superclass.constructor.call(this, config);\r
- \r
- var tools = this.toolItems;\r
- this.toolItems = new Ext.util.MixedCollection();\r
- if(tools){\r
- this.addTool.apply(this, tools);\r
- }\r
-};\r
+Ext.ux.StartMenu = Ext.extend(Ext.menu.Menu, {\r
+ initComponent: function(config) {\r
+ Ext.ux.StartMenu.superclass.initComponent.call(this, config);\r
\r
-Ext.extend(Ext.ux.StartMenu, Ext.menu.Menu, {\r
- // private\r
- render : function(){\r
- if(this.el){\r
- return;\r
+ var tools = this.toolItems;\r
+ this.toolItems = new Ext.util.MixedCollection();\r
+ if(tools){\r
+ this.addTool.apply(this, tools);\r
}\r
- var el = this.el = new Ext.Layer({\r
- cls: "x-menu ux-start-menu", // this might affect item click\r
- shadow:this.shadow,\r
- constrain: false,\r
- parentEl: this.parentEl || document.body,\r
- zindex:15000\r
- });\r
- \r
+ },\r
+\r
+ // private\r
+ onRender : function(ct, position){\r
+ Ext.ux.StartMenu.superclass.onRender.call(this, ct, position);\r
+ var el = this.el.addClass('ux-start-menu');\r
+\r
var header = el.createChild({\r
tag: "div",\r
cls: "x-window-header x-unselectable x-panel-icon "+this.iconCls\r
});\r
+\r
this.header = header;\r
+\r
var headerText = header.createChild({\r
tag: "span",\r
cls: "x-window-header-text"\r
var tc = header.wrap({\r
cls: "ux-start-menu-tc"\r
});\r
- \r
+\r
this.menuBWrap = el.createChild({\r
tag: "div",\r
cls: "x-window-body x-border-layout-ct ux-start-menu-body"\r
var mc = this.menuBWrap.wrap({\r
cls: "x-window-mc ux-start-menu-bwrap"\r
});\r
- \r
+\r
this.menuPanel = this.menuBWrap.createChild({\r
tag: "div",\r
cls: "x-panel x-border-panel ux-start-menu-apps-panel"\r
tag: "div",\r
cls: "x-panel x-border-panel ux-start-menu-tools-panel"\r
});\r
- \r
+\r
var bwrap = ml.wrap({cls: "x-window-bwrap"});\r
var bc = bwrap.createChild({\r
tag: "div",\r
var br = bc.wrap({\r
cls: "ux-start-menu-br"\r
});\r
- \r
- this.keyNav = new Ext.menu.MenuNav(this);\r
\r
- if(this.plain){\r
- el.addClass("x-menu-plain");\r
- }\r
- if(this.cls){\r
- el.addClass(this.cls);\r
- }\r
- // generic focus element\r
- this.focusEl = el.createChild({\r
- tag: "a",\r
- cls: "x-menu-focus",\r
- href: "#",\r
- onclick: "return false;",\r
- tabIndex:"-1"\r
- });\r
- \r
- var ul = this.menuPanel.createChild({\r
- tag: "ul",\r
- cls: "x-menu-list"});\r
+ this.ul.appendTo(this.menuPanel);\r
+\r
var toolsUl = this.toolsPanel.createChild({\r
tag: "ul",\r
cls: "x-menu-list"\r
});\r
- \r
- var ulListeners = {\r
- "click": {\r
- fn: this.onClick,\r
- scope: this\r
- },\r
- "mouseover": {\r
- fn: this.onMouseOver,\r
- scope: this\r
- },\r
- "mouseout": {\r
- fn: this.onMouseOut,\r
- scope: this\r
- }\r
- };\r
- \r
- ul.on(ulListeners);\r
- \r
- this.items.each(\r
- function(item){\r
- var li = document.createElement("li");\r
- li.className = "x-menu-list-item";\r
- ul.dom.appendChild(li);\r
- item.render(li, this);\r
- }, this);\r
\r
- this.ul = ul;\r
- this.autoWidth();\r
+ this.mon(toolsUl, 'click', this.onClick, this);\r
+ this.mon(toolsUl, 'mouseover', this.onMouseOver, this);\r
+ this.mon(toolsUl, 'mouseout', this.onMouseOut, this);\r
+\r
+ this.items.each(function(item){\r
+ item.parentMenu = this;\r
+ }, this);\r
\r
- toolsUl.on(ulListeners);\r
- \r
this.toolItems.each(\r
function(item){\r
var li = document.createElement("li");\r
li.className = "x-menu-list-item";\r
toolsUl.dom.appendChild(li);\r
- item.render(li, this);\r
+ item.render(li);\r
+ item.parentMenu = this;\r
}, this);\r
- \r
+\r
this.toolsUl = toolsUl;\r
- this.autoWidth();\r
- \r
- this.menuBWrap.setStyle('position', 'relative'); \r
- this.menuBWrap.setHeight(this.height);\r
- \r
+\r
+ this.menuBWrap.setStyle('position', 'relative');\r
+ this.menuBWrap.setHeight(this.height - 28);\r
+\r
this.menuPanel.setStyle({\r
padding: '2px',\r
position: 'absolute',\r
overflow: 'auto'\r
});\r
- \r
+\r
this.toolsPanel.setStyle({\r
padding: '2px 4px 2px 2px',\r
position: 'absolute',\r
overflow: 'auto'\r
});\r
- \r
+\r
this.setTitle(this.title);\r
},\r
- \r
+\r
// private\r
findTargetItem : function(e){\r
var t = e.getTarget(".x-menu-list-item", this.ul, true);\r
\r
this.fireEvent("beforeshow", this);\r
this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign), parentMenu, false);\r
- \r
- var tPanelWidth = 100; \r
+ var tPanelWidth = 100;\r
var box = this.menuBWrap.getBox();\r
this.menuPanel.setWidth(box.width-tPanelWidth);\r
this.menuPanel.setHeight(box.height);\r
- \r
+\r
this.toolsPanel.setWidth(tPanelWidth);\r
this.toolsPanel.setX(box.x+box.width-tPanelWidth);\r
this.toolsPanel.setHeight(box.height);\r
},\r
- \r
+\r
addTool : function(){\r
var a = arguments, l = a.length, item;\r
for(var i = 0; i < l; i++){\r
}\r
return item;\r
},\r
- \r
+\r
/**\r
* Adds a separator bar to the Tools\r
* @return {Ext.menu.Item} The menu item that was added\r
}\r
return this.addToolItem(config);\r
},\r
- \r
+\r
setTitle : function(title, iconCls){\r
this.title = title;\r
this.header.child('span').update(title);\r