1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
</head>
<body onload="prettyPrint();">
<pre class="prettyprint lang-js">/*!
* Ext JS Library 3.4.0
* Copyright(c) 2006-2011 Sencha Inc.
* licensing@sencha.com
* http://www.sencha.com/license
*/
<div id="cls-Ext.layout.MenuLayout"></div>/**
* @class Ext.layout.MenuLayout
* @extends Ext.layout.ContainerLayout
* <p>Layout manager used by {@link Ext.menu.Menu}. Generally this class should not need to be used directly.</p>
*/
Ext.layout.MenuLayout = Ext.extend(Ext.layout.ContainerLayout, {
monitorResize : true,
type: 'menu',
setContainer : function(ct){
this.monitorResize = !ct.floating;
// This event is only fired by the menu in IE, used so we don't couple
// the menu with the layout.
ct.on('autosize', this.doAutoSize, this);
Ext.layout.MenuLayout.superclass.setContainer.call(this, ct);
},
renderItem : function(c, position, target){
if (!this.itemTpl) {
this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate(
'<li id="{itemId}" class="{itemCls}">',
'<tpl if="needsIcon">',
'<img alt="{altText}" src="{icon}" class="{iconCls}"/>',
'</tpl>',
'</li>'
);
}
if(c && !c.rendered){
if(Ext.isNumber(position)){
position = target.dom.childNodes[position];
}
var a = this.getItemArgs(c);
// The Component's positionEl is the <li> it is rendered into
c.render(c.positionEl = position ?
this.itemTpl.insertBefore(position, a, true) :
this.itemTpl.append(target, a, true));
// Link the containing <li> to the item.
c.positionEl.menuItemId = c.getItemId();
// If rendering a regular Component, and it needs an icon,
// move the Component rightwards.
if (!a.isMenuItem && a.needsIcon) {
c.positionEl.addClass('x-menu-list-item-indent');
}
this.configureItem(c);
}else if(c && !this.isValidParent(c, target)){
if(Ext.isNumber(position)){
position = target.dom.childNodes[position];
}
target.dom.insertBefore(c.getActionEl().dom, position || null);
}
},
getItemArgs : function(c) {
var isMenuItem = c instanceof Ext.menu.Item,
canHaveIcon = !(isMenuItem || c instanceof Ext.menu.Separator);
return {
isMenuItem: isMenuItem,
needsIcon: canHaveIcon && (c.icon || c.iconCls),
icon: c.icon || Ext.BLANK_IMAGE_URL,
iconCls: 'x-menu-item-icon ' + (c.iconCls || ''),
itemId: 'x-menu-el-' + c.id,
itemCls: 'x-menu-list-item ',
altText: c.altText || ''
};
},
// Valid if the Component is in a <li> which is part of our target <ul>
isValidParent : function(c, target) {
return c.el.up('li.x-menu-list-item', 5).dom.parentNode === (target.dom || target);
},
onLayout : function(ct, target){
Ext.layout.MenuLayout.superclass.onLayout.call(this, ct, target);
this.doAutoSize();
},
doAutoSize : function(){
var ct = this.container, w = ct.width;
if(ct.floating){
if(w){
ct.setWidth(w);
}else if(Ext.isIE){
ct.setWidth(Ext.isStrict && (Ext.isIE7 || Ext.isIE8 || Ext.isIE9) ? 'auto' : ct.minWidth);
var el = ct.getEl(), t = el.dom.offsetWidth; // force recalc
ct.setWidth(ct.getLayoutTarget().getWidth() + el.getFrameWidth('lr'));
}
}
}
});
Ext.Container.LAYOUTS['menu'] = Ext.layout.MenuLayout;
</pre>
</body>
</html>
|
