git.roojs.org Git - roojs1/blob - Roo/bootstrap/Alert.js

   1 /**
   2  * @class Roo.bootstrap.Alert
   3  * @extends Roo.bootstrap.Component
   4  * Bootstrap Alert class - shows an alert area box
   5  * eg
   6  * <div class="alert alert-danger" role="alert"><span class="fa fa-exclamation-triangle"></span><span class="sr-only">Error:</span>
   7   Enter a valid email address
   8 </div>
   9  * @licence LGPL
  10  * @cfg {String} title The title of alert
  11  * @cfg {String} html The content of alert
  12  * @cfg {String} weight (  success | info | warning | danger )
  13  * @cfg {String} faicon font-awesomeicon
  14  *
  15  * @constructor
  16  * Create a new alert
  17  * @param {Object} config The config object
  18  */
  19
  20
  21 Roo.bootstrap.Alert = function(config){
  22     Roo.bootstrap.Alert.superclass.constructor.call(this, config);
  23
  24 };
  25
  26 Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component,  {
  27
  28     title: '',
  29     html: '',
  30     weight: false,
  31     faicon: false,
  32
  33     getAutoCreate : function()
  34     {
  35
  36         var cfg = {
  37             tag : 'div',
  38             cls : 'alert',
  39             cn : [
  40                 {
  41                     tag : 'i',
  42                     cls : 'roo-alert-icon'
  43
  44                 },
  45                 {
  46                     tag : 'b',
  47                     cls : 'roo-alert-title',
  48                     html : this.title
  49                 },
  50                 {
  51                     tag : 'span',
  52                     cls : 'roo-alert-text',
  53                     html : this.html
  54                 }
  55             ]
  56         };
  57
  58         if(this.faicon){
  59             cfg.cn[0].cls += ' fa ' + this.faicon;
  60         }
  61
  62         if(this.weight){
  63             cfg.cls += ' alert-' + this.weight;
  64         }
  65
  66         return cfg;
  67     },
  68
  69     initEvents: function()
  70     {
  71         this.el.setVisibilityMode(Roo.Element.DISPLAY);
  72     },
  73
  74     setTitle : function(str)
  75     {
  76         this.el.select('.roo-alert-title',true).first().dom.innerHTML = str;
  77     },
  78
  79     setText : function(str)
  80     {
  81         this.el.select('.roo-alert-text',true).first().dom.innerHTML = str;
  82     },
  83
  84     setWeight : function(weight)
  85     {
  86         if(this.weight){
  87             this.el.select('.alert',true).first().removeClass('alert-' + this.weight);
  88         }
  89
  90         this.weight = weight;
  91
  92         this.el.select('.alert',true).first().addClass('alert-' + this.weight);
  93     },
  94
  95     setIcon : function(icon)
  96     {
  97         if(this.faicon){
  98             this.el.select('.roo-alert-icon',true).first().removeClass(['fa', 'fa-' + this.faicon]);
  99         }
 100
 101         this.faicon = icon;
 102
 103         this.el.select('.roo-alert-icon',true).first().addClass(['fa', 'fa-' + this.faicon]);
 104     },
 105
 106     hide: function()
 107     {
 108         this.el.hide();
 109     },
 110
 111     show: function()
 112     {
 113         this.el.show();
 114     }
 115
 116 });
 117
 118