remove debugging code
[roojs1] / Roo / bootstrap / Brick.js
index 76d7622..425b22b 100644 (file)
@@ -30,7 +30,7 @@ Roo.bootstrap.Brick = function(config){
     });
 };
 
-Roo.extend(Roo.bootstrap.MasonryBrick, Roo.bootstrap.Component,  {
+Roo.extend(Roo.bootstrap.Brick, Roo.bootstrap.Component,  {
     
     /**
      * @cfg {String} title
@@ -73,6 +73,14 @@ Roo.extend(Roo.bootstrap.MasonryBrick, Roo.bootstrap.Component,  {
             cls += ' roo-brick-image';
         }
         
+        if(!this.html.length && !this.bgimage.length){
+            cls += ' roo-brick-center-title';
+        }
+        
+        if(!this.html.length && this.bgimage.length){
+            cls += ' roo-brick-bottom-title';
+        }
+        
         if(this.cls){
             cls += ' ' + this.cls;
         }
@@ -109,12 +117,14 @@ Roo.extend(Roo.bootstrap.MasonryBrick, Roo.bootstrap.Component,  {
                 cls: 'roo-brick-text',
                 html: this.html
             });
+        } else {
+            cn.cls += ' hide';
         }
         
         if(this.bgimage.length){
             cfg.cn.push({
                 tag: 'img',
-                cls: 'masonry-brick-image-view',
+                cls: 'roo-brick-image-view',
                 src: this.bgimage
             });
         }
@@ -124,33 +134,47 @@ Roo.extend(Roo.bootstrap.MasonryBrick, Roo.bootstrap.Component,  {
     
     initEvents: function() 
     {
-        this.intSize = 1;
-        
-        switch (this.size) {
-            case 'xs' :
-                this.intSize = 1;
-                break;
-            case 'sm' :
-                this.intSize = 2;
-                break;
-            case 'md' :
-                this.intSize = 3;
-                break;
-            default :
-                break;
+        if(this.title.length || this.html.length){
+            this.el.on('mouseenter'  ,this.enter, this);
+            this.el.on('mouseleave', this.leave, this);
         }
         
-        this.el.on('mouseenter'  ,this.enter, this);
-        this.el.on('mouseleave', this.leave, this);
+        Roo.EventManager.onWindowResize(this.resize, this); 
         
-        this.parent().bricks.push(this);
+        if(this.bgimage.length){
+            this.imageEl = this.el.select('.roo-brick-image-view', true).first();
+            this.imageEl.on('load', this.onImageLoad, this);
+            return;
+        }
         
+        this.resize();
+    },
+    
+    onImageLoad : function()
+    {
+        this.resize();
     },
     
     resize : function()
     {
-        var paragraph = this.el.select('.masonry-brick-paragraph', true).first();
+        var paragraph = this.el.select('.roo-brick-paragraph', true).first();
+        
         paragraph.setHeight(paragraph.getWidth() + paragraph.getPadding('tb'));
+        
+        if(this.bgimage.length){
+            var image = this.el.select('.roo-brick-image-view', true).first();
+            
+            image.setWidth(paragraph.getWidth());
+            
+            if(this.square){
+                image.setHeight(paragraph.getWidth());
+            }
+            
+            this.el.setHeight(image.getHeight());
+            paragraph.setHeight(image.getHeight());
+            
+        }
+        
     },
     
     enter: function(e, el)
@@ -158,7 +182,8 @@ Roo.extend(Roo.bootstrap.MasonryBrick, Roo.bootstrap.Component,  {
         e.preventDefault();
         
         if(this.bgimage.length){
-            this.el.select('.masonry-brick-paragraph', true).first().setOpacity(0.9, true);
+            this.el.select('.roo-brick-paragraph', true).first().setOpacity(0.9, true);
+            this.el.select('.roo-brick-image-view', true).first().setOpacity(0.1, true);
         }
     },
     
@@ -167,7 +192,8 @@ Roo.extend(Roo.bootstrap.MasonryBrick, Roo.bootstrap.Component,  {
         e.preventDefault();
         
         if(this.bgimage.length){
-            this.el.select('.masonry-brick-paragraph', true).first().setOpacity(0, true);
+            this.el.select('.roo-brick-paragraph', true).first().setOpacity(0, true);
+            this.el.select('.roo-brick-image-view', true).first().setOpacity(1, true);
         }
     }