@qooxdoo/framework
Version:
The JS Framework for Coders
194 lines (156 loc) • 5.03 kB
JavaScript
/* ************************************************************************
qooxdoo - the new era of web development
http://qooxdoo.org
Copyright:
2004-2008 1&1 Internet AG, Germany, http://www.1und1.de
License:
MIT: https://opensource.org/licenses/MIT
See the LICENSE file in the project's top-level directory for details.
Authors:
* Sebastian Werner (wpbasti)
* Fabian Jakobs (fjakobs)
************************************************************************ */
/**
* Layouter used by the qooxdoo menu's to render their buttons
*
* @internal
*/
qx.Class.define("qx.ui.menu.Layout",
{
extend : qx.ui.layout.VBox,
/*
*****************************************************************************
PROPERTIES
*****************************************************************************
*/
properties :
{
/** Spacing between each cell on the menu buttons */
columnSpacing :
{
check : "Integer",
init : 0,
apply : "_applyLayoutChange"
},
/**
* Whether a column and which column should automatically span
* when the following cell is empty. Spanning may be disabled
* through setting this property to <code>null</code>.
*/
spanColumn :
{
check : "Integer",
init : 1,
nullable : true,
apply : "_applyLayoutChange"
},
/** Default icon column width if no icons are rendered */
iconColumnWidth :
{
check : "Integer",
init : 0,
themeable : true,
apply : "_applyLayoutChange"
},
/** Default arrow column width if no sub menus are rendered */
arrowColumnWidth :
{
check : "Integer",
init : 0,
themeable : true,
apply : "_applyLayoutChange"
}
},
/*
*****************************************************************************
MEMBERS
*****************************************************************************
*/
members :
{
__columnSizes : null,
/*
---------------------------------------------------------------------------
LAYOUT INTERFACE
---------------------------------------------------------------------------
*/
// overridden
_computeSizeHint : function()
{
var children = this._getLayoutChildren();
var child, sizes, spacing;
var spanColumn = this.getSpanColumn();
var columnSizes = this.__columnSizes = [0, 0, 0, 0];
var columnSpacing = this.getColumnSpacing();
var spanColumnWidth = 0;
var maxInset = 0;
// Compute column sizes and insets
for (var i=0, l=children.length; i<l; i++)
{
child = children[i];
if (child.isAnonymous()) {
continue;
}
sizes = child.getChildrenSizes();
for (var column=0; column<sizes.length; column++)
{
if (spanColumn != null && column == spanColumn && sizes[spanColumn+1] == 0) {
spanColumnWidth = Math.max(spanColumnWidth, sizes[column]);
} else {
columnSizes[column] = Math.max(columnSizes[column], sizes[column]);
}
}
var insets = children[i].getInsets();
maxInset = Math.max(maxInset, insets.left + insets.right);
}
// Fix label column width is cases where the maximum button with no shortcut
// is larger than the maximum button with a shortcut
if (spanColumn != null && columnSizes[spanColumn] + columnSpacing + columnSizes[spanColumn+1] < spanColumnWidth) {
columnSizes[spanColumn] = spanColumnWidth - columnSizes[spanColumn+1] - columnSpacing;
}
// When merging the cells for label and shortcut
// ignore the spacing between them
if (spanColumnWidth == 0) {
spacing = columnSpacing * 2;
} else {
spacing = columnSpacing * 3;
}
// Fix zero size icon column
if (columnSizes[0] == 0) {
columnSizes[0] = this.getIconColumnWidth();
}
// Fix zero size arrow column
if (columnSizes[3] == 0) {
columnSizes[3] = this.getArrowColumnWidth();
}
var height = this.base(arguments).height;
// Build hint
return {
minHeight: height,
height : height,
width : qx.lang.Array.sum(columnSizes) + maxInset + spacing
};
},
/*
---------------------------------------------------------------------------
CUSTOM ADDONS
---------------------------------------------------------------------------
*/
/**
* Returns the column sizes detected during the pre-layout phase
*
* @return {Array} List of all column widths
*/
getColumnSizes : function() {
return this.__columnSizes || null;
}
},
/*
*****************************************************************************
DESTRUCT
*****************************************************************************
*/
destruct : function() {
this.__columnSizes = null;
}
});