Fix #5665 - pre-commit hooks for roojs
[roojs1] / Roo / bootstrap / Alert.js
index c90d8f8..cf85568 100644 (file)
@@ -1,14 +1,12 @@
-/*
- * - LGPL
- *
- * Alert
- * 
- */
-
 /**
  * @class Roo.bootstrap.Alert
  * @extends Roo.bootstrap.Component
- * Bootstrap Alert class
+ * Bootstrap Alert class - shows an alert area box
+ * eg
+ * <div class="alert alert-danger" role="alert"><span class="fa fa-exclamation-triangle"></span><span class="sr-only">Error:</span>
+  Enter a valid email address
+</div>
+ * @licence LGPL
  * @cfg {String} title The title of alert
  * @cfg {String} html The content of alert
  * @cfg {String} weight (  success | info | warning | danger )
@@ -29,8 +27,8 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component,  {
     
     title: '',
     html: '',
-    weight: '',
-    faicon: '',
+    weight: false,
+    faicon: false,
     
     getAutoCreate : function()
     {
@@ -38,20 +36,71 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component,  {
         var cfg = {
             tag : 'div',
             cls : 'alert',
-            cn : []
+            cn : [
+                {
+                    tag : 'i',
+                    cls : 'roo-alert-icon'
+                    
+                },
+                {
+                    tag : 'b',
+                    cls : 'roo-alert-title',
+                    html : this.title
+                },
+                {
+                    tag : 'span',
+                    cls : 'roo-alert-text',
+                    html : this.html
+                }
+            ]
         };
         
+        if(this.faicon){
+            cfg.cn[0].cls += ' fa ' + this.faicon;
+        }
+        
+        if(this.weight){
+            cfg.cls += ' alert-' + this.weight;
+        }
+        
         return cfg;
     },
     
     initEvents: function() 
     {
-        
+        this.el.setVisibilityMode(Roo.Element.DISPLAY);
+    },
+    
+    setTitle : function(str)
+    {
+        this.el.select('.roo-alert-title',true).first().dom.innerHTML = str;
     },
     
     setText : function(str)
     {
-        this.el.select('.roo-button-text',true).first().dom.innerHTML = str;
+        this.el.select('.roo-alert-text',true).first().dom.innerHTML = str;
+    },
+    
+    setWeight : function(weight)
+    {
+        if(this.weight){
+            this.el.select('.alert',true).first().removeClass('alert-' + this.weight);
+        }
+        
+        this.weight = weight;
+        
+        this.el.select('.alert',true).first().addClass('alert-' + this.weight);
+    },
+    
+    setIcon : function(icon)
+    {
+        if(this.faicon){
+            this.el.select('.roo-alert-icon',true).first().removeClass(['fa', 'fa-' + this.faicon]);
+        }
+        
+        this.faicon = icon;
+        
+        this.el.select('.roo-alert-icon',true).first().addClass(['fa', 'fa-' + this.faicon]);
     },
     
     hide: function()