docs/default.css
[roojs1] / docs / symbols / src / Roo_XComponent.js.html
1 <html><head><title>../roojs1/Roo/XComponent.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">/*
2  * Original code for Roojs - LGPL
3  * &lt;script type=&quot;text/javascript&quot;&gt;
4  */
5  
6 /**
7  * @class Roo.XComponent
8  * A delayed Element creator...
9  * Or a way to group chunks of interface together.
10  * technically this is a wrapper around a tree of Roo elements (which defines a 'module'),
11  *  used in conjunction with XComponent.build() it will create an instance of each element,
12  *  then call addxtype() to build the User interface.
13  * 
14  * Mypart.xyx = new Roo.XComponent({
15
16     parent : 'Mypart.xyz', // empty == document.element.!!
17     order : '001',
18     name : 'xxxx'
19     region : 'xxxx'
20     disabled : function() {} 
21      
22     tree : function() { // return an tree of xtype declared components
23         var MODULE = this;
24         return 
25         {
26             xtype : 'NestedLayoutPanel',
27             // technicall
28         }
29      ]
30  *})
31  *
32  *
33  * It can be used to build a big heiracy, with parent etc.
34  * or you can just use this to render a single compoent to a dom element
35  * MYPART.render(Roo.Element | String(id) | dom_element )
36  *
37  *
38  * Usage patterns.
39  *
40  * Classic Roo
41  *
42  * Roo is designed primarily as a single page application, so the UI build for a standard interface will
43  * expect a single 'TOP' level module normally indicated by the 'parent' of the XComponent definition being defined as false.
44  *
45  * Each sub module is expected to have a parent pointing to the class name of it's parent module.
46  *
47  * When the top level is false, a 'Roo.BorderLayout' is created and the element is flagged as 'topModule'
48  * - if mulitple topModules exist, the last one is defined as the top module.
49  *
50  * Embeded Roo
51  * 
52  * When the top level or multiple modules are to embedded into a existing HTML page,
53  * the parent element can container '#id' of the element where the module will be drawn.
54  *
55  * Bootstrap Roo
56  *
57  * Unlike classic Roo, the bootstrap tends not to be used as a single page.
58  * it relies more on a include mechanism, where sub modules are included into an outer page.
59  * This is normally managed by the builder tools using Roo.apply( options, Included.Sub.Module )
60  * 
61  * Bootstrap Roo Included elements
62  *
63  * Our builder application needs the ability to preview these sub compoennts. They will normally have parent=false set,
64  * hence confusing the component builder as it thinks there are multiple top level elements. 
65  *
66  * 
67  * 
68  * @extends Roo.util.Observable
69  * @constructor
70  * @param cfg {Object} configuration of component
71  * 
72  */
73 </span><span class="jsdoc-var">Roo.XComponent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">) {
74     </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">);
75     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({ 
76         </span><span class="jsdoc-comment">/**
77              * @event built
78              * Fires when this the componnt is built
79              * @param {Roo.XComponent} c the component
80              */
81         </span><span class="jsdoc-string">'built' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
82         
83     </span><span class="jsdoc-syntax">});
84     </span><span class="jsdoc-var">this.region </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.region </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'center'</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// default..
85     </span><span class="jsdoc-var">Roo.XComponent.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
86     </span><span class="jsdoc-var">this.modules </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
87     </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// where the layout goes..
88     
89     
90 </span><span class="jsdoc-syntax">}
91 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.XComponent</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">, {
92     </span><span class="jsdoc-comment">/**
93      * @property el
94      * The created element (with Roo.factory())
95      * @type {Roo.Layout}
96      */
97     </span><span class="jsdoc-var">el  </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
98     
99     </span><span class="jsdoc-comment">/**
100      * @property el
101      * for BC  - use el in new code
102      * @type {Roo.Layout}
103      */
104     </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
105     
106     </span><span class="jsdoc-comment">/**
107      * @property layout
108      * for BC  - use el in new code
109      * @type {Roo.Layout}
110      */
111     </span><span class="jsdoc-var">layout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
112     
113      </span><span class="jsdoc-comment">/**
114      * @cfg {Function|boolean} disabled
115      * If this module is disabled by some rule, return true from the funtion
116      */
117     </span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
118     
119     </span><span class="jsdoc-comment">/**
120      * @cfg {String} parent 
121      * Name of parent element which it get xtype added to..
122      */
123     </span><span class="jsdoc-var">parent</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
124     
125     </span><span class="jsdoc-comment">/**
126      * @cfg {String} order
127      * Used to set the order in which elements are created (usefull for multiple tabs)
128      */
129     
130     </span><span class="jsdoc-var">order </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
131     </span><span class="jsdoc-comment">/**
132      * @cfg {String} name
133      * String to display while loading.
134      */
135     </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
136     </span><span class="jsdoc-comment">/**
137      * @cfg {String} region
138      * Region to render component to (defaults to center)
139      */
140     </span><span class="jsdoc-var">region </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'center'</span><span class="jsdoc-syntax">,
141     
142     </span><span class="jsdoc-comment">/**
143      * @cfg {Array} items
144      * A single item array - the first element is the root of the tree..
145      * It's done this way to stay compatible with the Xtype system...
146      */
147     </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
148     
149     </span><span class="jsdoc-comment">/**
150      * @property _tree
151      * The method that retuns the tree of parts that make up this compoennt 
152      * @type {function}
153      */
154     </span><span class="jsdoc-var">_tree  </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
155     
156      </span><span class="jsdoc-comment">/**
157      * render
158      * render element to dom or tree
159      * @param {Roo.Element|String|DomElement} optional render to if parent is not set.
160      */
161     
162     </span><span class="jsdoc-var">render </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">)
163     {
164         
165         </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
166         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">? 1 : 0;
167         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp;  </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
168         
169         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tree </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._tree </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this._tree</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-var">this.tree</span><span class="jsdoc-syntax">();
170
171         
172         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.parent.substring</span><span class="jsdoc-syntax">(0,1) == </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">) {
173             </span><span class="jsdoc-comment">// if parent is a '#.....' string, then let's use that..
174             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ename </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.parent.substr</span><span class="jsdoc-syntax">(1);
175             </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
176             </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ename</span><span class="jsdoc-syntax">);
177             </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ename</span><span class="jsdoc-syntax">) {
178                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'bootstrap-body'</span><span class="jsdoc-syntax">:
179                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tree.el</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tree.el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)  {
180                         </span><span class="jsdoc-comment">// this is the BorderLayout standard?
181                        </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">= { </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">};
182                        </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
183                     }
184                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">&quot;Nest&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;Content&quot;</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tree.xtype</span><span class="jsdoc-syntax">)  &gt; -1)  {
185                         </span><span class="jsdoc-comment">// need to insert stuff...
186                         </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">=  {
187                              </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.layout.Border</span><span class="jsdoc-syntax">({
188                                  </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">, 
189                      
190                                  </span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">: {
191                                     </span><span class="jsdoc-var">titlebar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
192                                     </span><span class="jsdoc-var">autoScroll</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
193                                     </span><span class="jsdoc-var">closeOnTab</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
194                                     </span><span class="jsdoc-var">tabPosition</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">,
195                                       </span><span class="jsdoc-comment">//resizeTabs: true,
196                                     </span><span class="jsdoc-var">alwaysShowTabs</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
197                                     </span><span class="jsdoc-var">hideTabs</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false
198                                      </span><span class="jsdoc-comment">//minTabWidth: 140
199                                  </span><span class="jsdoc-syntax">}
200                              })
201                         
202                          };
203                          </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
204                     }
205                          
206                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Body</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
207                         </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">= { </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">new  </span><span class="jsdoc-var">Roo.bootstrap.Body</span><span class="jsdoc-syntax">() };
208                         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;setting el to doc body&quot;</span><span class="jsdoc-syntax">);
209                          
210                     } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
211                         </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Container is bootstrap body, but Roo.bootstrap.Body is not defined&quot;</span><span class="jsdoc-syntax">;
212                     }
213                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
214                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'bootstrap'</span><span class="jsdoc-syntax">:
215                     </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">= { </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">};
216                     </span><span class="jsdoc-comment">// fall through
217                 </span><span class="jsdoc-keyword">default</span><span class="jsdoc-syntax">:
218                     </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ename</span><span class="jsdoc-syntax">);
219                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
220             }
221                 
222             
223             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">) {
224                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;Warning - element can not be found :#&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">ename </span><span class="jsdoc-syntax">);
225                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
226             }
227         }
228         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;EL:&quot;</span><span class="jsdoc-syntax">);
229         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
230         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;this.parent.el:&quot;</span><span class="jsdoc-syntax">);
231         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.parent.el</span><span class="jsdoc-syntax">);
232         
233
234         </span><span class="jsdoc-comment">// altertive root elements ??? - we need a better way to indicate these.
235         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">is_alt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.XComponent.is_alt </span><span class="jsdoc-syntax">||
236                     (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tree.el</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tree.el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">) ||
237                     (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tree.xns </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">) ||
238                     (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.mailer</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tree.xns </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">Roo.mailer</span><span class="jsdoc-syntax">) ;
239         
240         
241         
242         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">is_alt</span><span class="jsdoc-syntax">) {
243             </span><span class="jsdoc-comment">//el = Roo.get(document.body);
244             </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">= { </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">};
245         }
246             
247             
248         
249         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">) {
250             
251             </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;no parent - creating one&quot;</span><span class="jsdoc-syntax">);
252             
253             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;     
254              
255             
256             </span><span class="jsdoc-comment">// it's a top level one..
257             </span><span class="jsdoc-var">this.parent </span><span class="jsdoc-syntax">=  {
258                 </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.BorderLayout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">, {
259                 
260                      </span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">: {
261                          </span><span class="jsdoc-var">titlebar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
262                          </span><span class="jsdoc-var">autoScroll</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
263                          </span><span class="jsdoc-var">closeOnTab</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
264                          </span><span class="jsdoc-var">tabPosition</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">,
265                           </span><span class="jsdoc-comment">//resizeTabs: true,
266                          </span><span class="jsdoc-var">alwaysShowTabs</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">hp</span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
267                          </span><span class="jsdoc-var">hideTabs</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">hp </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
268                          </span><span class="jsdoc-var">minTabWidth</span><span class="jsdoc-syntax">: 140
269                      }
270                  })
271             };
272         }
273         
274         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.parent.el</span><span class="jsdoc-syntax">) {
275                 </span><span class="jsdoc-comment">// probably an old style ctor, which has been disabled.
276                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
277
278         }
279                 </span><span class="jsdoc-comment">// The 'tree' method is  '_tree now' 
280             
281         </span><span class="jsdoc-var">tree.region </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tree.region </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.region</span><span class="jsdoc-syntax">;
282         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">is_body </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
283         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.parent.el </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) {
284             </span><span class="jsdoc-comment">// bootstrap... - body..
285             </span><span class="jsdoc-var">this.parent.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tree</span><span class="jsdoc-syntax">);
286             </span><span class="jsdoc-var">is_body </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
287         }
288         
289         </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.parent.el.addxtype</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tree</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">is_body</span><span class="jsdoc-syntax">);
290         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'built'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
291         
292         </span><span class="jsdoc-var">this.panel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
293         </span><span class="jsdoc-var">this.layout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.panel.layout</span><span class="jsdoc-syntax">;
294         </span><span class="jsdoc-var">this.parentLayout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.parent.layout  </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;  
295          
296     }
297     
298 });
299
300 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.XComponent</span><span class="jsdoc-syntax">, {
301     </span><span class="jsdoc-comment">/**
302      * @property  hideProgress
303      * true to disable the building progress bar.. usefull on single page renders.
304      * @type Boolean
305      */
306     </span><span class="jsdoc-var">hideProgress </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
307     </span><span class="jsdoc-comment">/**
308      * @property  buildCompleted
309      * True when the builder has completed building the interface.
310      * @type Boolean
311      */
312     </span><span class="jsdoc-var">buildCompleted </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
313      
314     </span><span class="jsdoc-comment">/**
315      * @property  topModule
316      * the upper most module - uses document.element as it's constructor.
317      * @type Object
318      */
319      
320     </span><span class="jsdoc-var">topModule  </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
321       
322     </span><span class="jsdoc-comment">/**
323      * @property  modules
324      * array of modules to be created by registration system.
325      * @type {Array} of Roo.XComponent
326      */
327     
328     </span><span class="jsdoc-var">modules </span><span class="jsdoc-syntax">: [],
329     </span><span class="jsdoc-comment">/**
330      * @property  elmodules
331      * array of modules to be created by which use #ID 
332      * @type {Array} of Roo.XComponent
333      */
334      
335     </span><span class="jsdoc-var">elmodules </span><span class="jsdoc-syntax">: [],
336
337      </span><span class="jsdoc-comment">/**
338      * @property  is_alt
339      * Is an alternative Root - normally used by bootstrap or other systems,
340      *    where the top element in the tree can wrap 'body' 
341      * @type {boolean}  (default false)
342      */
343      
344     </span><span class="jsdoc-var">is_alt </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
345     </span><span class="jsdoc-comment">/**
346      * @property  build_from_html
347      * Build elements from html - used by bootstrap HTML stuff 
348      *    - this is cleared after build is completed
349      * @type {boolean}    (default false)
350      */
351      
352     </span><span class="jsdoc-var">build_from_html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
353     </span><span class="jsdoc-comment">/**
354      * Register components to be built later.
355      *
356      * This solves the following issues
357      * - Building is not done on page load, but after an authentication process has occured.
358      * - Interface elements are registered on page load
359      * - Parent Interface elements may not be loaded before child, so this handles that..
360      * 
361      *
362      * example:
363      * 
364      * MyApp.register({
365           order : '000001',
366           module : 'Pman.Tab.projectMgr',
367           region : 'center',
368           parent : 'Pman.layout',
369           disabled : false,  // or use a function..
370         })
371      
372      * * @param {Object} details about module
373      */
374     </span><span class="jsdoc-var">register </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">) {
375                 
376         </span><span class="jsdoc-var">Roo.XComponent.event.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'register'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">);
377         </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj.disabled</span><span class="jsdoc-syntax">) ) {
378                 
379             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">:
380                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
381             
382             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'function'</span><span class="jsdoc-syntax">:
383                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">obj.disabled</span><span class="jsdoc-syntax">() ) {
384                         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
385                 }
386                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
387             
388             </span><span class="jsdoc-keyword">default</span><span class="jsdoc-syntax">:
389                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj.disabled</span><span class="jsdoc-syntax">) {
390                         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
391                 }
392                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
393         }
394                 
395         </span><span class="jsdoc-var">this.modules.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">);
396          
397     },
398     </span><span class="jsdoc-comment">/**
399      * convert a string to an object..
400      * eg. 'AAA.BBB' -&gt; finds AAA.BBB
401
402      */
403     
404     </span><span class="jsdoc-var">toObject </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">)
405     {
406         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">str </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object'</span><span class="jsdoc-syntax">) {
407             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
408         }
409         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str.substring</span><span class="jsdoc-syntax">(0,1) == </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">) {
410             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
411         }
412
413         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.'</span><span class="jsdoc-syntax">);
414         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rt</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">;
415         </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ar.shift</span><span class="jsdoc-syntax">();
416             </span><span class="jsdoc-comment">/** eval:var:o */
417         </span><span class="jsdoc-keyword">try </span><span class="jsdoc-syntax">{
418             </span><span class="jsdoc-keyword">eval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'if (typeof ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' == &quot;undefined&quot;){ o = false;} o = ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">';'</span><span class="jsdoc-syntax">);
419         } </span><span class="jsdoc-keyword">catch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
420             </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Module not found : &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
421         }
422         
423         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
424             </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Module not found : &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
425         }
426         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
427             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
428                 </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Module not found : &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
429             }
430             </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">];
431         });
432         
433         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">;
434         
435     },
436     
437     
438     </span><span class="jsdoc-comment">/**
439      * move modules into their correct place in the tree..
440      * 
441      */
442     </span><span class="jsdoc-var">preBuild </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">()
443     {
444         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
445         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.modules </span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">)
446         {
447             </span><span class="jsdoc-var">Roo.XComponent.event.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforebuild'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">);
448             
449             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">opar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">obj.parent</span><span class="jsdoc-syntax">;
450             </span><span class="jsdoc-keyword">try </span><span class="jsdoc-syntax">{ 
451                 </span><span class="jsdoc-var">obj.parent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.toObject</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">opar</span><span class="jsdoc-syntax">);
452             } </span><span class="jsdoc-keyword">catch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
453                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;parent:toObject failed: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">e.toString</span><span class="jsdoc-syntax">());
454                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
455             }
456             
457             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">obj.parent</span><span class="jsdoc-syntax">) {
458                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;GOT top level module&quot;</span><span class="jsdoc-syntax">);
459                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">);
460                 </span><span class="jsdoc-var">obj.modules </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, 
461                     </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">o.order </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">}
462                 );
463                 </span><span class="jsdoc-var">this.topModule </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">;
464                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
465             }
466                         </span><span class="jsdoc-comment">// parent is a string (usually a dom element name..)
467             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj.parent</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">) {
468                 </span><span class="jsdoc-var">this.elmodules.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">);
469                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
470             }
471             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj.parent.constructor </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">Roo.XComponent</span><span class="jsdoc-syntax">) {
472                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;Warning : Object Parent is not instance of XComponent:&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">obj.name</span><span class="jsdoc-syntax">)
473             }
474             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">obj.parent.modules</span><span class="jsdoc-syntax">) {
475                 </span><span class="jsdoc-var">obj.parent.modules </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, 
476                     </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">o.order </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">}
477                 );
478             }
479             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj.parent.disabled</span><span class="jsdoc-syntax">) {
480                 </span><span class="jsdoc-var">obj.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
481             }
482             </span><span class="jsdoc-var">obj.parent.modules.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">obj</span><span class="jsdoc-syntax">);
483         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
484     },
485     
486      </span><span class="jsdoc-comment">/**
487      * make a list of modules to build.
488      * @return {Array} list of modules. 
489      */ 
490     
491     </span><span class="jsdoc-var">buildOrder </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
492     {
493         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
494         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cmp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">) {   
495             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.toUpperCase</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.toUpperCase</span><span class="jsdoc-syntax">() ? 1 : -1;
496         };
497         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((!</span><span class="jsdoc-var">this.topModule </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.topModule.modules</span><span class="jsdoc-syntax">) &amp;&amp; !</span><span class="jsdoc-var">this.elmodules.length</span><span class="jsdoc-syntax">) {
498             </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;No top level modules to build&quot;</span><span class="jsdoc-syntax">;
499         }
500         
501         </span><span class="jsdoc-comment">// make a flat list in order of modules to build.
502         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mods </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.topModule </span><span class="jsdoc-syntax">? [ </span><span class="jsdoc-var">this.topModule </span><span class="jsdoc-syntax">] : [];
503                 
504         
505         </span><span class="jsdoc-comment">// elmodules (is a list of DOM based modules )
506         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.elmodules</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
507             </span><span class="jsdoc-var">mods.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
508             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.topModule </span><span class="jsdoc-syntax">&amp;&amp;
509                 </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.parent</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">&amp;&amp;
510                 </span><span class="jsdoc-var">e.parent.substring</span><span class="jsdoc-syntax">(0,1) == </span><span class="jsdoc-string">'#' </span><span class="jsdoc-syntax">&amp;&amp;
511                 </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.parent.substr</span><span class="jsdoc-syntax">(1))
512                ) {
513                 
514                 </span><span class="jsdoc-var">_this.topModule </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">;
515             }
516             
517         });
518
519         
520         </span><span class="jsdoc-comment">// add modules to their parents..
521         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">addMod </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">) {
522             </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;build Order: add: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">m.name</span><span class="jsdoc-syntax">);
523                 
524             </span><span class="jsdoc-var">mods.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">);
525             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.modules </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">m.disabled</span><span class="jsdoc-syntax">) {
526                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;build Order: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">m.modules.length </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot; child modules&quot;</span><span class="jsdoc-syntax">);
527                 </span><span class="jsdoc-var">m.modules.keySort</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'ASC'</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">cmp </span><span class="jsdoc-syntax">);
528                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;build Order: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">m.modules.length </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot; child modules (after sort)&quot;</span><span class="jsdoc-syntax">);
529     
530                 </span><span class="jsdoc-var">m.modules.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">addMod</span><span class="jsdoc-syntax">);
531             } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
532                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;build Order: no child modules&quot;</span><span class="jsdoc-syntax">);
533             }
534             </span><span class="jsdoc-comment">// not sure if this is used any more..
535             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.finalize</span><span class="jsdoc-syntax">) {
536                 </span><span class="jsdoc-var">m.finalize.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">m.name </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot; (clean up) &quot;</span><span class="jsdoc-syntax">;
537                 </span><span class="jsdoc-var">mods.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.finalize</span><span class="jsdoc-syntax">);
538             }
539             
540         }
541         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.topModule </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.topModule.modules</span><span class="jsdoc-syntax">) { 
542             </span><span class="jsdoc-var">this.topModule.modules.keySort</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'ASC'</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">cmp </span><span class="jsdoc-syntax">);
543             </span><span class="jsdoc-var">this.topModule.modules.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">addMod</span><span class="jsdoc-syntax">);
544         } 
545         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">mods</span><span class="jsdoc-syntax">;
546     },
547     
548      </span><span class="jsdoc-comment">/**
549      * Build the registered modules.
550      * @param {Object} parent element.
551      * @param {Function} optional method to call after module has been added.
552      * 
553      */ 
554    
555     </span><span class="jsdoc-var">build </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">) 
556     {
557         
558         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
559             </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">);
560         }
561         
562         </span><span class="jsdoc-var">this.preBuild</span><span class="jsdoc-syntax">();
563         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mods </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.buildOrder</span><span class="jsdoc-syntax">();
564       
565         </span><span class="jsdoc-comment">//this.allmods = mods;
566         //Roo.debug &amp;&amp; Roo.log(mods);
567         //return;
568         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">mods.length</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// should not happen
569             </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;NO modules!!!&quot;</span><span class="jsdoc-syntax">;
570         }
571         
572         
573         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;Building Interface...&quot;</span><span class="jsdoc-syntax">;
574         </span><span class="jsdoc-comment">// flash it up as modal - so we store the mask!?
575         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hideProgress </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.MessageBox</span><span class="jsdoc-syntax">) {
576             </span><span class="jsdoc-var">Roo.MessageBox.show</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'loading' </span><span class="jsdoc-syntax">});
577             </span><span class="jsdoc-var">Roo.MessageBox.show</span><span class="jsdoc-syntax">({
578                </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Please wait...&quot;</span><span class="jsdoc-syntax">,
579                </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">,
580                </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">:450,
581                </span><span class="jsdoc-var">progress</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
582                </span><span class="jsdoc-var">closable</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
583                </span><span class="jsdoc-var">modal</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false
584               
585             </span><span class="jsdoc-syntax">});
586         }
587         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">total </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">mods.length</span><span class="jsdoc-syntax">;
588         
589         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
590         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">progressRun </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
591             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">mods.length</span><span class="jsdoc-syntax">) {
592                 </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide?'</span><span class="jsdoc-syntax">);
593                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hideProgress </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.MessageBox</span><span class="jsdoc-syntax">) {
594                     </span><span class="jsdoc-var">Roo.MessageBox.hide</span><span class="jsdoc-syntax">();
595                 }
596                 </span><span class="jsdoc-var">Roo.XComponent.build_from_html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// reset, so dialogs will be build from javascript
597                 
598                 </span><span class="jsdoc-var">Roo.XComponent.event.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'buildcomplete'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">_this.topModule</span><span class="jsdoc-syntax">);
599                 
600                 </span><span class="jsdoc-comment">// THE END...
601                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;   
602             }
603             
604             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">m </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">mods.shift</span><span class="jsdoc-syntax">();
605             
606             
607             </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">);
608             </span><span class="jsdoc-comment">// not sure if this is supported any more.. - modules that are are just function
609             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'function'</span><span class="jsdoc-syntax">) { 
610                 </span><span class="jsdoc-var">m.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
611                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">progressRun.defer</span><span class="jsdoc-syntax">(10, </span><span class="jsdoc-var">_this</span><span class="jsdoc-syntax">);
612             } 
613             
614             
615             </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;Building Interface &quot; </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">total  </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">mods.length</span><span class="jsdoc-syntax">) + 
616                     </span><span class="jsdoc-string">&quot; of &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">total </span><span class="jsdoc-syntax">+ 
617                     (</span><span class="jsdoc-var">m.name </span><span class="jsdoc-syntax">? (</span><span class="jsdoc-string">' - ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">m.name</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
618                         </span><span class="jsdoc-var">Roo.debug </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">);
619             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hideProgress </span><span class="jsdoc-syntax">&amp;&amp;  </span><span class="jsdoc-var">Roo.MessageBox</span><span class="jsdoc-syntax">) { 
620                 </span><span class="jsdoc-var">Roo.MessageBox.updateProgress</span><span class="jsdoc-syntax">(  (</span><span class="jsdoc-var">total  </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">mods.length</span><span class="jsdoc-syntax">)/</span><span class="jsdoc-var">total</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">msg  </span><span class="jsdoc-syntax">);
621             }
622             
623          
624             </span><span class="jsdoc-comment">// is the module disabled?
625             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.disabled</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'function'</span><span class="jsdoc-syntax">) ?
626                 </span><span class="jsdoc-var">m.disabled.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.module.disabled</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">m.disabled</span><span class="jsdoc-syntax">;    
627             
628             
629             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">disabled</span><span class="jsdoc-syntax">) {
630                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">progressRun</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-comment">// we do not update the display!
631             </span><span class="jsdoc-syntax">}
632             
633             </span><span class="jsdoc-comment">// now build 
634             
635                         
636                         
637             </span><span class="jsdoc-var">m.render</span><span class="jsdoc-syntax">();
638             </span><span class="jsdoc-comment">// it's 10 on top level, and 1 on others??? why...
639             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">progressRun.defer</span><span class="jsdoc-syntax">(10, </span><span class="jsdoc-var">_this</span><span class="jsdoc-syntax">);
640              
641         }
642         </span><span class="jsdoc-var">progressRun.defer</span><span class="jsdoc-syntax">(1, </span><span class="jsdoc-var">_this</span><span class="jsdoc-syntax">);
643      
644         
645         
646     },
647         
648         
649         </span><span class="jsdoc-comment">/**
650          * Event Object.
651          *
652          *
653          */
654         </span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, 
655     </span><span class="jsdoc-comment">/**
656          * wrapper for event.on - aliased later..  
657          * Typically use to register a event handler for register:
658          *
659          * eg. Roo.XComponent.on('register', function(comp) { comp.disable = true } );
660          *
661          */
662     </span><span class="jsdoc-var">on </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false
663    
664     
665     
666 </span><span class="jsdoc-syntax">});
667
668 </span><span class="jsdoc-var">Roo.XComponent.event </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">({
669                 </span><span class="jsdoc-var">events </span><span class="jsdoc-syntax">: { 
670                         </span><span class="jsdoc-comment">/**
671                          * @event register
672                          * Fires when an Component is registered,
673                          * set the disable property on the Component to stop registration.
674                          * @param {Roo.XComponent} c the component being registerd.
675                          * 
676                          */
677                         </span><span class="jsdoc-string">'register' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
678             </span><span class="jsdoc-comment">/**
679                          * @event beforebuild
680                          * Fires before each Component is built
681                          * can be used to apply permissions.
682                          * @param {Roo.XComponent} c the component being registerd.
683                          * 
684                          */
685                         </span><span class="jsdoc-string">'beforebuild' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
686                         </span><span class="jsdoc-comment">/**
687                          * @event buildcomplete
688                          * Fires on the top level element when all elements have been built
689                          * @param {Roo.XComponent} the top level component.
690                          */
691                         </span><span class="jsdoc-string">'buildcomplete' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
692                         
693                 </span><span class="jsdoc-syntax">}
694 });
695
696 </span><span class="jsdoc-var">Roo.XComponent.on </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.XComponent.event.on.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.XComponent.event</span><span class="jsdoc-syntax">); 
697  </span></code></body></html>