X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=roojs-bootstrap-debug.js;h=9e39fb86ca80ef3682e6b2aaa6f9e8c2b526ddf2;hb=5a09638750d76b5c2f42753ab924401909761f61;hp=b994e6076f696d70d58424209d0c7f304a7bd974;hpb=85b613c78dd87999aa218716296c53ba08bcbb9b;p=roojs1 diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index b994e6076f..9e39fb86ca 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -330,11 +330,11 @@ Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent, { } if (this.cls) { - cfg.cls = (typeof(cfg.cls) == 'undefined') ? this.cls : cfg.cls + ' ' + this.cls; + cfg.cls = (typeof(cfg.cls) == 'undefined' ? this.cls : cfg.cls) + ' ' + this.cls; } if (this.style) { // fixme needs to support more complex style data. - cfg.style = this.style; + cfg.style = (typeof(cfg.style) == 'undefined' ? this.style : cfg.style) + '; ' + this.style; } if(this.name){ @@ -3043,6 +3043,7 @@ Roo.extend(Roo.bootstrap.ButtonUploader, Roo.bootstrap.Button, { * @cfg {String} smUrl sm image source * @cfg {String} mdUrl md image source * @cfg {String} lgUrl lg image source + * @cfg {Boolean} backgroundContain (use style background and contain image in content) * * @constructor * Create a new Input @@ -3059,7 +3060,13 @@ Roo.bootstrap.Img = function(config){ * The img click event for the img. * @param {Roo.EventObject} e */ - "click" : true + "click" : true, + /** + * @event load + * The when any image loads + * @param {Roo.EventObject} e + */ + "load" : true }); }; @@ -3074,6 +3081,7 @@ Roo.extend(Roo.bootstrap.Img, Roo.bootstrap.Component, { smUrl: '', mdUrl: '', lgUrl: '', + backgroundContain : false, getAutoCreate : function() { @@ -3146,12 +3154,20 @@ Roo.extend(Roo.bootstrap.Img, Roo.bootstrap.Component, { tag: 'img', cls: (this.imgResponsive) ? 'img-responsive' : '', html : null, - src : 'about:blank' // just incase src get's set to undefined?!? + src : Roo.BLANK_IMAGE_URL // just incase src get's set to undefined?!? }; + if (this.backgroundContain) { + cfg.cls += ' background-contain'; + } + cfg.html = this.html || cfg.html; - cfg.src = this.src || cfg.src; + if (this.backgroundContain) { + cfg.style="background-image: url(" + this.src + ')'; + } else { + cfg.src = this.src || cfg.src; + } if (['rounded','circle','thumbnail'].indexOf(this.border)>-1) { cfg.cls += ' img-' + this.border; @@ -3184,6 +3200,12 @@ Roo.extend(Roo.bootstrap.Img, Roo.bootstrap.Component, { if(!this.href){ this.el.on('click', this.onClick, this); } + if(this.src || (!this.xsUrl && !this.smUrl && !this.mdUrl && !this.lgUrl)){ + this.el.on('load', this.onImageLoad, this); + } else { + // not sure if this works.. not tested + this.el.select('img', true).on('load', this.onImageLoad, this); + } }, @@ -3192,6 +3214,12 @@ Roo.extend(Roo.bootstrap.Img, Roo.bootstrap.Component, { Roo.log('img onclick'); this.fireEvent('click', this, e); }, + onImageLoad: function(e) + { + Roo.log('img load'); + this.fireEvent('load', this, e); + }, + /** * Sets the url of the image - used to update it * @param {String} url the url of the image @@ -3202,7 +3230,11 @@ Roo.extend(Roo.bootstrap.Img, Roo.bootstrap.Component, { this.src = url; if(this.src || (!this.xsUrl && !this.smUrl && !this.mdUrl && !this.lgUrl)){ - this.el.dom.src = url; + if (this.backgroundContain) { + this.el.dom.style.backgroundImage = 'url(' + url + ')'; + } else { + this.el.dom.src = url; + } return; } @@ -8444,15 +8476,14 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component, { var rowIndex = this.getRowIndex(row); // why??? - should these not be based on SelectionModel? - if(this.cellSelection){ + //if(this.cellSelection){ this.fireEvent('cellclick', this, cell, rowIndex, cellIndex, e); - } + //} - if(this.rowSelection){ + //if(this.rowSelection){ this.fireEvent('rowclick', this, row, rowIndex, e); - } - - + //} + }, onDblClick : function(e,el) @@ -21954,7 +21985,10 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input, { break; case 'span': if (className.indexOf('disabled') < 0) { - this.viewDate.setUTCDate(1); + if (!this.viewDate) { + this.viewDate = new Date(); + } + this.viewDate.setUTCDate(1); if (className.indexOf('month') > -1) { this.viewDate.setUTCMonth(Roo.bootstrap.DateField.dates[this.language].monthsShort.indexOf(html)); } else { @@ -29889,7 +29923,7 @@ Roo.apply(Roo.bootstrap.LocationPicker, { * @licence LGPL * @cfg {String} title The title of alert * @cfg {String} html The content of alert - * @cfg {String} weight ( success | info | warning | danger ) + * @cfg {String} weight (success|info|warning|danger) Weight of the message * @cfg {String} fa font-awesomeicon * @cfg {Number} seconds default:-1 Number of seconds until it disapears (-1 means never.) * @cfg {Boolean} close true to show a x closer @@ -29967,20 +30001,32 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { this.el.setVisibilityMode(Roo.Element.DISPLAY); this.titleEl = this.el.select('.roo-alert-title',true).first(); this.iconEl = this.el.select('.roo-alert-icon',true).first(); + this.htmlEl = this.el.select('.roo-alert-text',true).first(); if (this.seconds > 0) { this.hide.defer(this.seconds, this); } }, - + /** + * Set the Title Message HTML + * @param {String} html + */ setTitle : function(str) { this.titleEl.dom.innerHTML = str; }, - - setText : function(str) + + /** + * Set the Body Message HTML + * @param {String} html + */ + setHtml : function(str) { - this.titleEl.dom.innerHTML = str; + this.htmlEl.dom.innerHTML = str; }, + /** + * Set the Weight of the alert + * @param {String} (success|info|warning|danger) weight + */ setWeight : function(weight) { @@ -29992,7 +30038,10 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { this.el.addClass('alert-' + this.weight); }, - + /** + * Set the Icon of the alert + * @param {String} see fontawsome names (name without the 'fa-' bit) + */ setIcon : function(icon) { if(this.faicon){ @@ -30003,12 +30052,16 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { this.alertEl.addClass(['fa', 'fa-' + this.faicon]); }, - + /** + * Hide the Alert + */ hide: function() { this.el.hide(); }, - + /** + * Show the Alert + */ show: function() { this.el.show(); @@ -40160,7 +40213,15 @@ Roo.bootstrap.panel.Content = function( config){ * Fires when this tab is created * @param {Roo.ContentPanel} this */ - "render" : true + "render" : true, + + /** + * @event scroll + * Fires when this content is scrolled + * @param {Roo.ContentPanel} this + * @param {Event} scrollEvent + */ + "scroll" : true @@ -40171,6 +40232,7 @@ Roo.bootstrap.panel.Content = function( config){ if(this.autoScroll && !this.iframe){ this.resizeEl.setStyle("overflow", "auto"); + this.resizeEl.on('scroll', this.onScroll, this); } else { // fix randome scrolling //this.el.on('scroll', function() { @@ -40210,6 +40272,9 @@ Roo.extend(Roo.bootstrap.panel.Content, Roo.bootstrap.Component, { iframe : false, iframeEl : false, + /* Resize Element - use this to work out scroll etc. */ + resizeEl : false, + setRegion : function(region){ this.region = region; this.setActiveClass(region && !this.background); @@ -40519,6 +40584,12 @@ layout.addxtype({ getChildContainer: function () { return this.getEl(); + }, + + + onScroll : function(e) + { + this.fireEvent('scroll', this, e); }