Roo/Template.js
[roojs1] / Roo / Document.js
index ddc1f34..0197331 100644 (file)
@@ -7,8 +7,6 @@
  * 
  * This needs some more thought..
  * 
- *
- * 
  * 
  * 
  * @class Roo.XComponent
@@ -41,19 +39,75 @@ Roo.XComponent = function(cfg) {
         /**
             * @event built
             * Fires when this the componnt is built
-            * @param {Button} this
-            * @param {EventObject} e The click event
+            * @param {Roo.XComponent} c the component
             */
-        'built' : true
+        'built' : true,
+        /**
+            * @event buildcomplete
+            * Fires on the top level element when all elements have been built
+            * @param {Roo.XComponent} c the top level component.
+         */
+        'buildcomplete' : true,
+        
     });
 
     Roo.XComponent.register(this);
-    this.modules = [],
+    this.modules = [];
+    this.el = false; // where the layout goes..
+    
+    
 }
 Roo.extend(Roo.XComponent, Roo.util.Observable {
+    /**
+     * @property el
+     * The created element (with Roo.factory())
+     * @type {Roo.Layout}
+     */
+    el  : false,
+    
+    /**
+     * @property el
+     * for BC  - use el in new code
+     * @type {Roo.Layout}
+     */
     panel : false,
+    
+    /**
+     * @property layout
+     * for BC  - use el in new code
+     * @type {Roo.Layout}
+     */
     layout : false,
     
+     /**
+     * @cfg {Function|boolean} disabled
+     * If this module is disabled by some rule, return true from the funtion
+     */
+    disabled : false,
+    
+    /**
+     * @cfg {String} parent 
+     * Name of parent element which it get xtype added to..
+     */
+    parent: false,
+    
+    /**
+     * @cfg {String} order
+     * Used to set the order in which elements are created (usefull for multiple tabs)
+     */
+    
+    order : false,
+    /**
+     * @cfg {String} name
+     * String to display while loading.
+     */
+    name : false,
+    /**
+     * @cfg {Array} items
+     * A single item array - the first element is the root of the tree..
+     * It's done this way to stay compatible with the Xtype system...
+     */
+    items : false,
 });
 
 Roo.apply(Roo.XComponent, 
@@ -154,45 +208,33 @@ Roo.apply(Roo.XComponent,
             }
             obj.parent = toObject(obj.parent);
             if (!obj.parent.modules) {
-                obj.parent.modules = new Roo.util.MixedCollection(false, function(o) { return o.order + '' });
+                obj.parent.modules = new Roo.util.MixedCollection(false, 
+                    function(o) { return o.order + '' }
+                );
             }
             
             obj.parent.modules.add(obj);
         }, this);
     }
     
-    
      /**
-     * Build the registered modules.
-     * @param {Object} parent element.
-     * @param {Function} optional method to call after module has been added.
-     * 
+     * make a list of modules to build.
+     * @return {Array} list of modules. 
      */ 
-   
-    build : function(onCompleteFn) 
+    
+    buildOrder : function()
     {
-        
-        
-        var onComplete = function () {
-            if (onCompleteFn) {
-                onCompleteFn.call(this);
-            }
-            Roo.MessageBox.hide();
-            
-        
-            
-        }
         var _this = this;
         var cmp = function(a,b) {   
             return String(a).toUpperCase() > String(b).toUpperCase() ? 1 : -1;
         };
         
-        if (!parent.modules) {
-            return;
+        if (!this.topModule || !this.topModule.modules) {
+            throw "No top level modules to build";
         }
        
         // make a flat list in order of modules to build.
-        var mods = [];
+        var mods = [ this.topModule ];
         
         
         // add modules to their parents..
@@ -210,14 +252,32 @@ Roo.apply(Roo.XComponent,
             }
             
         }
-        parent.modules.keySort('ASC',  cmp );
-        parent.modules.each(addMod);
+        this.topModule.modules.keySort('ASC',  cmp );
+        this.topModule.modules.each(addMod);
+    }
+    
+     /**
+     * Build the registered modules.
+     * @param {Object} parent element.
+     * @param {Function} optional method to call after module has been added.
+     * 
+     */ 
+   
+    build : function() 
+    {
+        
+        this.preBuild();
+        var mods = this.buildOrder();
+        
         //this.allmods = mods;
         //console.log(mods);
         //return;
         if (!mods.length) { // should not happen
             throw "NO modules!!!";
         }
+        
+        
+        
         // flash it up as modal - so we store the mask!?
         Roo.MessageBox.show({ title: 'loading' });
         Roo.MessageBox.show({
@@ -229,40 +289,43 @@ Roo.apply(Roo.XComponent,
            modal: false
           
         });
-        var n = -1;
+        var total = mods.length();
+        
         var _this = this;
         var progressRun = function() {
-            n++;
-            if (n >= mods.length) {
-                _this.topModule.fireEvent('built', _this.topModule);
-                return;
+            if (mods.length) {
+                Roo.MessageBox.hide();
+                _this.topModule.fireEvent('buildcomplete', _this.topModule);
+                return;    
             }
             
-            var m = mods[n];
+            var m = mods.unshift();
             
+            if (typeof(m) == 'function') { // not sure if this is supported any more..
+                m.call(this);
+                return progressRun.defer(10, _this);
+            } 
             
             Roo.MessageBox.updateProgress(
-                (n+1)/mods.length,  "Building Interface " + (n+1) + 
-                    " of " + mods.length + 
+                (total  - mods.length)/total,  "Building Interface " + (total  - mods.length) + 
+                    " of " + total + 
                     (m.name ? (' - ' + m.name) : '')
                     );
             
-            if (typeof(m) == 'function') {
-                m.call(this);
-                progressRun.defer(10, _this);    
-                return;
-            } 
+         
+            
             var disabled = (typeof(m.module.disabled) == 'function') ?
-                m.module.disabled.call(m.module.disabled) : m.module.disabled;
-                
+                m.module.disabled.call(m.module.disabled) : m.module.disabled;    
             }
             
-            if (m.parent.layout && !disabled) {
-                // modules have to support a  'add method'
-                // should we just move that code into here..
-                m.module.add(m.parent.layout, m.region);    
+            if (disabled) {
+                return progressRun(); // we do not update the display!
             }
-                 
+            
+            m.el = m.parent.el.addxtype(m.items[0]);
+            m.fireEvent('built', m);
+            m.panel = this.el;
+            m.layout = m.panel.layout;    
              
             
         }