projects
/
roojs1
/ blobdiff
commit
grep
author
committer
pickaxe
?
search:
re
summary
|
shortlog
|
log
|
commit
|
commitdiff
|
tree
raw
|
inline
| side by side
Fix #6883 - image loading tidy up
[roojs1]
/
roojs-bootstrap-debug.js
diff --git
a/roojs-bootstrap-debug.js
b/roojs-bootstrap-debug.js
index
0d7efc8
..
9e39fb8
100644
(file)
--- a/
roojs-bootstrap-debug.js
+++ b/
roojs-bootstrap-debug.js
@@
-330,11
+330,11
@@
Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent, {
}
if (this.cls) {
}
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.
}
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){
}
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 {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
*
* @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
*/
* 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: '',
smUrl: '',
mdUrl: '',
lgUrl: '',
+ backgroundContain : false,
getAutoCreate : function()
{
getAutoCreate : function()
{
@@
-3146,12
+3154,20
@@
Roo.extend(Roo.bootstrap.Img, Roo.bootstrap.Component, {
tag: 'img',
cls: (this.imgResponsive) ? 'img-responsive' : '',
html : null,
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.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;
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.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);
},
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
/**
* 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.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;
}
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?
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);
this.fireEvent('cellclick', this, cell, rowIndex, cellIndex, e);
- }
+
//
}
- if(this.rowSelection){
+
//
if(this.rowSelection){
this.fireEvent('rowclick', this, row, rowIndex, e);
this.fireEvent('rowclick', this, row, rowIndex, e);
- }
-
-
+ //}
+
},
onDblClick : function(e,el)
},
onDblClick : function(e,el)
@@
-40182,7
+40213,15
@@
Roo.bootstrap.panel.Content = function( config){
* Fires when this tab is created
* @param {Roo.ContentPanel} this
*/
* 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
@@
-40193,6
+40232,7
@@
Roo.bootstrap.panel.Content = function( config){
if(this.autoScroll && !this.iframe){
this.resizeEl.setStyle("overflow", "auto");
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() {
} else {
// fix randome scrolling
//this.el.on('scroll', function() {
@@
-40232,6
+40272,9
@@
Roo.extend(Roo.bootstrap.panel.Content, Roo.bootstrap.Component, {
iframe : false,
iframeEl : false,
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);
setRegion : function(region){
this.region = region;
this.setActiveClass(region && !this.background);
@@
-40541,6
+40584,12
@@
layout.addxtype({
getChildContainer: function () {
return this.getEl();
getChildContainer: function () {
return this.getEl();
+ },
+
+
+ onScroll : function(e)
+ {
+ this.fireEvent('scroll', this, e);
}
}