PDA

View Full Version : [FIXED] [4.1.3] Panel.Tool setType render issue



Ghurdyl
19 Dec 2012, 5:53 AM
Hello,

I found a small bug when setting the type of a panel's tool when it hasn't been rendered yet.
If you call the setType method the actual type is changed but it will be rendered with the initila type it had.

here's an easy demo of the bug :

Ext.define('App.test.CustomPanel', {
extend: 'Ext.panel.Panel',
initComponent: function() {
this.collapseTool = Ext.create('Ext.panel.Tool', {
type: 'minimize' // <------------------------------- Tool initialized with a 'minimise' icon
});
this.tools = [
this.collapseTool
];
this.callParent(arguments);
this.collapseTool.setType('maximize'); // <------------- change the type to 'maximize'
}
});


Ext.create('App.test.CustomPanel', {
title: 'Hello',
width: 200,
html: '<p>World!</p>',
renderTo: Ext.getBody()
});


// expect to see a maximize icon but the initial minimize is shown
// Note the the type has the right value, it was only badly rendered.

As you can see, I set the type to 'minimize' and then change it to 'maximize'. The minimize icon is shown but the type is actually maximize.

Now here is the reason an the way to solve it.
The reson is that the type is copied to the "renderData" variable in the iniComponent() method and the setType() method does not change it when it should.

To fit it, you just have to override the class and set it.


Ext.override(Ext.panel.Tool, {
setType: function(type) {
this.callParent(arguments);
this.renderData.type = type;
}
});

Or even better, set it only when necessary :


Ext.override(Ext.panel.Tool, {
setType: function(type) {
var me = this;


me.type = type;
if (me.rendered) {
me.toolEl.dom.className = me.baseCls + '-' + type;
+ } else {
+ me.renderData.type = type;
+ }
return me;
}
});

:)

mitchellsimoens
19 Dec 2012, 7:45 AM
Looks like the renderData isn't updated. Override is below that may fix it

Thanks for the report! I have opened a bug in our bug tracker.


Ext.define('Override.panel.Tool', {
override : 'Ext.panel.Tool',

setType: function(type) {
var parent = this.callParent([type]);

if (!this.rendered) {
this.renderData.type = type;
}
}
});