sync
[roojs1] / Roo / bootstrap / panel / Content.js
index e2bb0c4..e6c589b 100644 (file)
@@ -28,6 +28,8 @@
  * @cfg {Boolean} loadOnce      When used with {@link #url}, calls {@link #setUrl} with this value
  * @cfg {String}    content        Raw content to fill content panel with (uses setContent on construction.)
  * @cfg {Boolean} badges render the badges
+ * @cfg {String} cls  extra classes to use  
+ * @cfg {String} background (primary|secondary|success|info|warning|danger|light|dark)
 
  * @constructor
  * Create a new ContentPanel.
@@ -55,10 +57,13 @@ Roo.bootstrap.panel.Content = function( config){
             this.el = Roo.DomHelper.append(document.body,
                         config.autoCreate, true);
         }else{
-            var elcfg =  {   tag: "div",
-                            cls: "roo-layout-inactive-content",
-                            id: config.id||el
-                            };
+            var elcfg =  {
+                tag: "div",
+                cls: (config.cls || '') +
+                    (config.background ? ' bg-' + config.background : '') +
+                    " roo-layout-inactive-content",
+                id: config.id||el
+            };
             if (config.html) {
                 elcfg.html = config.html;
                 
@@ -194,6 +199,9 @@ Roo.bootstrap.panel.Content = function( config){
 
 Roo.extend(Roo.bootstrap.panel.Content, Roo.bootstrap.Component, {
     
+    cls : '',
+    background : '',
+    
     tabTip : '',
     
     setRegion : function(region){
@@ -226,10 +234,13 @@ Roo.extend(Roo.bootstrap.panel.Content, Roo.bootstrap.Component, {
         this.active = active;
         this.setActiveClass(active);
         if(!active){
-            this.fireEvent("deactivate", this);
-        }else{
-            this.fireEvent("activate", this);
+            if(this.fireEvent("deactivate", this) === false){
+                return false;
+            }
+            return true;
         }
+        this.fireEvent("activate", this);
+        return true;
     },
     /**
      * Updates this panel's element
@@ -339,15 +350,13 @@ panel.load({
         }
         if(this.toolbar){
             var te = this.toolbar.getEl();
-            height -= te.getHeight();
             te.setWidth(width);
+            height -= te.getHeight();
         }
         if(this.footer){
             var te = this.footer.getEl();
-            Roo.log("footer:" + te.getHeight());
-            
-            height -= te.getHeight();
             te.setWidth(width);
+            height -= te.getHeight();
         }
         
         
@@ -380,31 +389,21 @@ panel.load({
         }
         
         var t = '';
-    
         for (var k in this.title) {
             if (!this.title.hasOwnProperty(k)) {
                 continue;
             }
-            switch (true) {
-                case (k.indexOf('xs') >= 0):
-                    t += '<span class="visible-xs">' + this.title[k] + '</span>';
-                case (k.indexOf('sm') >= 0):
-                    t += '<span class="visible-sm">' + this.title[k] + '</span>';
-                case (k.indexOf('md') >= 0):
-                    t += '<span class="visible-md">' + this.title[k] + '</span>';
-                case (k.indexOf('lg') >= 0):
-                    Roo.log(k+' in lg');
-                    t += '<span class="visible-lg">' + this.title[k] + '</span>';
-                    break;
-                default:
-                    break;
-            }
             
+            if (k.indexOf('-') >= 0) {
+                var s = k.split('-');
+                for (var i = 0; i<s.length; i++) {
+                    t += "<span class='visible-"+s[i]+"'>"+this.title[k]+"</span>";
+                }
+            } else {
+                t += "<span class='visible-"+k+"'>"+this.title[k]+"</span>";
+            }
         }
-        Roo.log(t);
-        
         return t;
-
     },
     
     /**