Roo/Template.js
[roojs1] / Roo / XComponent.js
index 294e36f..c4a1ec4 100644 (file)
@@ -44,16 +44,10 @@ Roo.XComponent = function(cfg) {
             * Fires when this the componnt is built
             * @param {Roo.XComponent} c the component
             */
-        '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
+        'built' : true
         
     });
-    
+    this.region = this.region || 'center'; // default..
     Roo.XComponent.register(this);
     this.modules = false;
     this.el = false; // where the layout goes..
@@ -118,6 +112,12 @@ Roo.extend(Roo.XComponent, Roo.util.Observable, {
      */
     items : false,
     
+    /**
+     * @property _tree
+     * The method that retuns the tree of parts that make up this compoennt 
+     * @type {function}
+     */
+    _tree  : false,
     
      /**
      * render
@@ -129,19 +129,27 @@ Roo.extend(Roo.XComponent, Roo.util.Observable, {
     {
         
         el = el || false;
+        var hp = this.parent ? 1 : 0;
         
-        if (!el && typeof(m.parent) == 'string' && m.parent[0] == '#') {
+        if (!el && typeof(this.parent) == 'string' && this.parent.substring(0,1) == '#') {
             // if parent is a '#.....' string, then let's use that..
+            var ename = this.parent.substr(1)
             this.parent = false;
-            el = Roo.get(m.substr(1));
+            el = Roo.get(ename);
+            if (!el) {
+                Roo.log("Warning - element can not be found :#" + ename );
+                return;
+            }
         }
+        
+        
         if (!this.parent) {
             
-            el = el ? Roo.get(el) : false;
+            el = el ? Roo.get(el) : false;     
             
             // it's a top level one..
             this.parent =  {
-                el : new Ext.BorderLayout(el || document.body, {
+                el : new Roo.BorderLayout(el || document.body, {
                 
                      center: {
                          titlebar: false,
@@ -149,21 +157,25 @@ Roo.extend(Roo.XComponent, Roo.util.Observable, {
                          closeOnTab: true,
                          tabPosition: 'top',
                           //resizeTabs: true,
-                         alwaysShowTabs: el ? false :  true,
-                         hideTabs: el ? true :  false,
+                         alwaysShowTabs: el && hp? false :  true,
+                         hideTabs: el || !hp ? true :  false,
                          minTabWidth: 140
                      }
                  })
             }
         }
+        
+               
+               // The 'tree' method is  '_tree now' 
             
-        var tree = this.tree();
+        var tree = this._tree ? this._tree() : this.tree();
         tree.region = tree.region || this.region;
         this.el = this.parent.el.addxtype(tree);
         this.fireEvent('built', this);
         
         this.panel = this.el;
-        this.layout = this.panel.layout;    
+        this.layout = this.panel.layout;
+               this.parentLayout = this.parent.layout  || false;  
          
     }
     
@@ -224,6 +236,25 @@ Roo.apply(Roo.XComponent, {
      * * @param {Object} details about module
      */
     register : function(obj) {
+               
+               Roo.XComponent.event.fireEvent('register', obj);
+               switch(typeof(obj.disabled) ) {
+                       
+                       case 'undefined':
+                               break;
+                       
+                       case 'function':
+                               if ( obj.disabled() ) {
+                                       return;
+                               }
+                               break;
+                       default:
+                               if (obj.disabled) {
+                                       return;
+                               }
+                               break;
+               }
+               
         this.modules.push(obj);
          
     },
@@ -238,7 +269,7 @@ Roo.apply(Roo.XComponent, {
         if (!str || typeof(str) == 'object') {
             return str;
         }
-        if (str[0]=='#') {
+        if (str.substring(0,1) == '#') {
             return str;
         }
 
@@ -246,7 +277,12 @@ Roo.apply(Roo.XComponent, {
         var rt, o;
         rt = ar.shift();
             /** eval:var:o */
-        eval('if (typeof ' + rt + ' == "undefined"){ o = false;} o = ' + rt + ';');
+        try {
+            eval('if (typeof ' + rt + ' == "undefined"){ o = false;} o = ' + rt + ';');
+        } catch (e) {
+            throw "Module not found : " + str;
+        }
+        
         if (o === false) {
             throw "Module not found : " + str;
         }
@@ -256,6 +292,7 @@ Roo.apply(Roo.XComponent, {
             }
             o = o[e];
         });
+        
         return o;
         
     },
@@ -267,20 +304,34 @@ Roo.apply(Roo.XComponent, {
      */
     preBuild : function ()
     {
-        
+        var _t = this;
         Roo.each(this.modules , function (obj)
         {
-            obj.parent = this.toObject(obj.parent);
+            var opar = obj.parent;
+            try { 
+                obj.parent = this.toObject(opar);
+            } catch(e) {
+                Roo.log("parent:toObject failed: " + e.toString());
+                return;
+            }
             
             if (!obj.parent) {
+                               Roo.debug && Roo.log("GOT top level module");
+                               Roo.debug && Roo.log(obj);
+                               obj.modules = new Roo.util.MixedCollection(false, 
+                    function(o) { return o.order + '' }
+                );
                 this.topModule = obj;
                 return;
             }
+                       // parent is a string (usually a dom element name..)
             if (typeof(obj.parent) == 'string') {
                 this.elmodules.push(obj);
                 return;
             }
-            
+            if (obj.parent.constructor != Roo.XComponent) {
+                Roo.log("Warning : Object Parent is not instance of XComponent:" + obj.name)
+            }
             if (!obj.parent.modules) {
                 obj.parent.modules = new Roo.util.MixedCollection(false, 
                     function(o) { return o.order + '' }
@@ -308,18 +359,25 @@ Roo.apply(Roo.XComponent, {
         
         // make a flat list in order of modules to build.
         var mods = this.topModule ? [ this.topModule ] : [];
+               
+               // elmodules (is a list of DOM based modules )
         Roo.each(this.elmodules,function(e) { mods.push(e) });
 
         
         // add modules to their parents..
         var addMod = function(m) {
-           // Roo.debug && Roo.log(m.modKey);
+                       Roo.debug && Roo.log("build Order: add: " + m.name);
             
             mods.push(m);
             if (m.modules) {
+                               Roo.debug && Roo.log("build Order: " + m.modules.length + " child modules");
                 m.modules.keySort('ASC',  cmp );
+                               Roo.debug && Roo.log("build Order: " + m.modules.length + " child modules (after sort)");
+
                 m.modules.each(addMod);
-            }
+            } else {
+                               Roo.debug && Roo.log("build Order: no child modules");
+                       }
             // not sure if this is used any more..
             if (m.finalize) {
                 m.finalize.name = m.name + " (clean up) ";
@@ -355,12 +413,12 @@ Roo.apply(Roo.XComponent, {
         }
         
         
-        
+        var msg = "Building Interface...";
         // flash it up as modal - so we store the mask!?
         Roo.MessageBox.show({ title: 'loading' });
         Roo.MessageBox.show({
            title: "Please wait...",
-           msg: "Building Interface...",
+           msg: msg,
            width:450,
            progress:true,
            closable:false,
@@ -374,9 +432,8 @@ Roo.apply(Roo.XComponent, {
             if (!mods.length) {
                 Roo.debug && Roo.log('hide?');
                 Roo.MessageBox.hide();
-                if (_this.topModule) { 
-                    _this.topModule.fireEvent('buildcomplete', _this.topModule);
-                }
+                Roo.XComponent.event.fireEvent('buildcomplete', _this.topModule);
+                
                 // THE END...
                 return false;   
             }
@@ -392,12 +449,11 @@ Roo.apply(Roo.XComponent, {
             } 
             
             
-            
-            Roo.MessageBox.updateProgress(
-                (total  - mods.length)/total,  "Building Interface " + (total  - mods.length) + 
+            msg = "Building Interface " + (total  - mods.length) + 
                     " of " + total + 
-                    (m.name ? (' - ' + m.name) : '')
-                    );
+                    (m.name ? (' - ' + m.name) : '');
+                       Roo.debug && Roo.log(msg);
+            Roo.MessageBox.updateProgress(  (total  - mods.length)/total, msg  );
             
          
             // is the module disabled?
@@ -411,6 +467,8 @@ Roo.apply(Roo.XComponent, {
             
             // now build 
             
+                       
+                       
             m.render();
             // it's 10 on top level, and 1 on others??? why...
             return progressRun.defer(10, _this);
@@ -420,11 +478,47 @@ Roo.apply(Roo.XComponent, {
      
         
         
-    }
-    
-     
+    },
+       
+       
+       /**
+        * Event Object.
+        *
+        *
+        */
+       event: false, 
+    /**
+        * wrapper for event.on - aliased later..  
+        * Typically use to register a event handler for register:
+        *
+        * eg. Roo.XComponent.on('register', function(comp) { comp.disable = true } );
+        *
+        */
+    on : false
    
     
     
 });
+
+Roo.XComponent.event = new Roo.util.Observable({
+               events : { 
+                       /**
+                        * @event register
+                        * Fires when an Component is registered,
+                        * set the disable property on the Component to stop registration.
+                        * @param {Roo.XComponent} c the component being registerd.
+                        * 
+                        */
+                       'register' : true,
+                       /**
+                        * @event buildcomplete
+                        * Fires on the top level element when all elements have been built
+                        * @param {Roo.XComponent} the top level component.
+                        */
+                       'buildcomplete' : true
+                       
+               }
+});
+
+Roo.XComponent.on = Roo.XComponent.event.on.createDelegate(Roo.XComponent.event); 
  
\ No newline at end of file