* Bootstrap MessageBar class
* @cfg {String} html contents of the MessageBar
* @cfg {String} weight (info | success | warning | danger) default info
- * @cfg {Boolean} closable (true | false) default true
+ * @cfg {String} beforeClass insert the bar before the given class
+ * @cfg {Boolean} closable (true | false) default false
+ * @cfg {Boolean} fixed (true | false) default false, fix the bar at the top
*
* @constructor
* Create a new Element
html: '',
weight: 'info',
- closable: true,
+ closable: false,
+ fixed: false,
+ beforeClass: 'bootstrap-sticky-wrap',
getAutoCreate : function(){
var cfg = {
tag: 'div',
- cls: 'alert alert-dismissable alert-messages alert-' + this.weight,
- html: this.html || ''
+ cls: 'alert alert-dismissable alert-' + this.weight,
+ cn: [
+ {
+ tag: 'span',
+ cls: 'message',
+ html: this.html || ''
+ }
+ ]
+ };
+
+ if(this.fixed){
+ cfg.cls += ' alert-messages-fixed';
}
if(this.closable){
- cfg.cn = {
+ cfg.cn.push({
tag: 'button',
cls: 'close',
html: 'x'
- }
+ });
}
return cfg;
if(!this.el){
var cfg = Roo.apply({}, this.getAutoCreate());
cfg.id = Roo.id();
- //if(!cfg.name){
- // cfg.name = typeof(this.name) == 'undefined' ? this.id : this.name;
- //}
- //if (!cfg.name.length) {
- // delete cfg.name;
- // }
+
if (this.cls) {
cfg.cls += ' ' + this.cls;
}
if (this.style) {
cfg.style = this.style;
}
- this.el = Roo.get(document.body).createChild(cfg, position);
+ this.el = Roo.get(document.body).createChild(cfg, Roo.select('.'+this.beforeClass, true).first());
+
+ this.el.setVisibilityMode(Roo.Element.DISPLAY);
}
+
+ this.el.select('>button.close').on('click', this.hide, this);
+
},
show : function()
if (!this.rendered) {
this.render();
}
+
+ this.el.show();
+
+ this.fireEvent('show', this);
+
+ },
+
+ hide : function()
+ {
+ if (!this.rendered) {
+ this.render();
+ }
+
+ this.el.hide();
+
+ this.fireEvent('hide', this);
+ },
+
+ update : function()
+ {
+// var e = this.el.dom.firstChild;
+//
+// if(this.closable){
+// e = e.nextSibling;
+// }
+//
+// e.data = this.html || '';
+
+ this.el.select('>.message', true).first().dom.innerHTML = this.html || '';
}
});