PDA

View Full Version : align tools to left in panel



robertoroberto
26 Jul 2009, 1:42 AM
also refered to an old post http://extjs.com/forum/showthread.php?p=363910

in the addTool function of the Panel there is a undocumented feature : align : left


var overCls = 'x-tool-'+tc.id+'-over';
var t = this.toolTemplate.insertFirst((tc.align !== 'left') ? this[this.toolTarget] : this[this.toolTarget].child('span'), tc, true);
this.tools[tc.id] = t;

In the JSDoc it seems that align attribute is not allowed (it is not documented...)
Anyway I try to use it because I want align on the left some (not always) standard tool (e.g. left and right ids).
But if I set align left, tools is not displayed ( I try to see if the final page have it... but seems doesn't exist...).
My question is : what is the purpose of it ?
If align on left is not the purpose of it.. I would suggest a new feature.
a very simple solution (that I use as workaround) is to use a custom template and adding a new css class using a "cls" attribute


...
<style>
.x-tool-float-left{float : left}
</style>
...
var vTools = [{
id:'left',
qtip: 'left',
cls : 'x-tool-float-left',
handler: function(event, aToolEl, aPanel)
{
.....
var vObjPanel = new Ext.Panel({
....
tools : vTools,
toolTemplate: new Ext.Template(
'<div class="x-tool x-tool-{id} {cls}"> </div>'
),
...

Porting this solution as standard will be great (it is a general feature.. not closely related to align left requirements)
So porting it as a standard it is enough to change in the Panel.js the following lines:


var tt = new Ext.Template(
'<div class="x-tool x-tool-{id}"> </div>'
);

to


var tt = new Ext.Template(
'<div class="x-tool x-tool-{id} {cls}"> </div>'
);

Maybe a more closely related to align left can be will be appreciated