1 <html><head><title>/home/alan/gitlive/roojs1/Roo/bootstrap/Navbar.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
9 * @class Roo.bootstrap.Navbar
10 * @extends Roo.bootstrap.Component
11 * Bootstrap Navbar class
15 * @param {Object} config The config object
19 </span><span class="jsdoc-var">Roo.bootstrap.Navbar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
20 </span><span class="jsdoc-var">Roo.bootstrap.Navbar.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
21 </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
22 </span><span class="jsdoc-comment">// raw events
25 * Fire before toggle the menu
26 * @param {Roo.EventObject} e
28 </span><span class="jsdoc-string">"beforetoggle" </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
29 </span><span class="jsdoc-syntax">});
32 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Navbar</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">, {
36 </span><span class="jsdoc-comment">// private
37 </span><span class="jsdoc-var">navItems </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
38 </span><span class="jsdoc-var">loadMask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
41 </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
44 </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-syntax">{ </span><span class="jsdoc-var">message </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">"nav bar is now a abstract base class - use NavSimplebar / NavHeaderbar / NavSidebar etc..."</span><span class="jsdoc-syntax">};
48 </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">()
50 </span><span class="jsdoc-comment">//Roo.log(this.el.select('.navbar-toggle',true));
51 </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.navbar-toggle'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
52 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforetoggle'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
53 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ce </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.navbar-collapse'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
54 </span><span class="jsdoc-var">ce.toggleClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// old...
55 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ce.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapse'</span><span class="jsdoc-syntax">)) {
56 </span><span class="jsdoc-comment">// show it...
57 </span><span class="jsdoc-var">ce.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapse'</span><span class="jsdoc-syntax">);
58 </span><span class="jsdoc-var">ce.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
59 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ce.getHeight</span><span class="jsdoc-syntax">();
60 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
61 </span><span class="jsdoc-var">ce.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
62 </span><span class="jsdoc-comment">// at this point we should be able to see it..
63 </span><span class="jsdoc-var">ce.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapsing'</span><span class="jsdoc-syntax">);
65 </span><span class="jsdoc-var">ce.setHeight</span><span class="jsdoc-syntax">(0); </span><span class="jsdoc-comment">// resize it ...
66 </span><span class="jsdoc-var">ce.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'transitionend'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
67 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'done transition'</span><span class="jsdoc-syntax">);
68 </span><span class="jsdoc-var">ce.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapsing'</span><span class="jsdoc-syntax">);
69 </span><span class="jsdoc-var">ce.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
70 </span><span class="jsdoc-var">ce.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapse'</span><span class="jsdoc-syntax">);
72 </span><span class="jsdoc-var">ce.dom.style.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
73 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, { </span><span class="jsdoc-var">single</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">} );
74 </span><span class="jsdoc-var">ce.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
76 } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
77 </span><span class="jsdoc-var">ce.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ce.getHeight</span><span class="jsdoc-syntax">());
78 </span><span class="jsdoc-var">ce.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
79 </span><span class="jsdoc-var">ce.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapsing'</span><span class="jsdoc-syntax">);
81 </span><span class="jsdoc-var">ce.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'transitionend'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
82 </span><span class="jsdoc-var">ce.dom.style.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
83 </span><span class="jsdoc-var">ce.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapsing'</span><span class="jsdoc-syntax">);
84 </span><span class="jsdoc-var">ce.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapse'</span><span class="jsdoc-syntax">);
85 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, { </span><span class="jsdoc-var">single</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">} );
86 </span><span class="jsdoc-var">ce.setHeight</span><span class="jsdoc-syntax">(0);
90 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
92 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mark </span><span class="jsdoc-syntax">= {
93 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">"div"</span><span class="jsdoc-syntax">,
94 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">"x-dlg-mask"
95 </span><span class="jsdoc-syntax">};
97 </span><span class="jsdoc-var">this.maskEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">mark</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
99 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getSize</span><span class="jsdoc-syntax">();
100 </span><span class="jsdoc-var">this.maskEl.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">size.height</span><span class="jsdoc-syntax">);
101 </span><span class="jsdoc-var">this.maskEl.enableDisplayMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"block"</span><span class="jsdoc-syntax">);
102 </span><span class="jsdoc-var">this.maskEl.hide</span><span class="jsdoc-syntax">();
104 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.loadMask</span><span class="jsdoc-syntax">){
105 </span><span class="jsdoc-var">this.maskEl.show</span><span class="jsdoc-syntax">();
110 </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
112 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.collapse'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getCount</span><span class="jsdoc-syntax">()) {
113 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.collapse'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
116 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
119 </span><span class="jsdoc-var">mask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
121 </span><span class="jsdoc-var">this.maskEl.show</span><span class="jsdoc-syntax">();
124 </span><span class="jsdoc-var">unmask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
126 </span><span class="jsdoc-var">this.maskEl.hide</span><span class="jsdoc-syntax">();
138 </span></code></body></html>