@qooxdoo/framework
Version:
The JS Framework for Coders
172 lines (146 loc) • 4.64 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:
* Fabian Jakobs (fjakobs)
************************************************************************ */
/**
* This mixin defines the <code>contentPadding</code> property, which is used
* by widgets like the window or group box, which must have a property, which
* defines the padding of an inner pane.
*
* The including class must implement the method
* <code>_getContentPaddingTarget</code>, which must return the widget on which
* the padding should be applied.
*/
qx.Mixin.define("qx.ui.core.MContentPadding",
{
/*
*****************************************************************************
PROPERTIES
*****************************************************************************
*/
properties :
{
/** Top padding of the content pane */
contentPaddingTop :
{
check : "Integer",
init : 0,
apply : "_applyContentPadding",
themeable : true
},
/** Right padding of the content pane */
contentPaddingRight :
{
check : "Integer",
init : 0,
apply : "_applyContentPadding",
themeable : true
},
/** Bottom padding of the content pane */
contentPaddingBottom :
{
check : "Integer",
init : 0,
apply : "_applyContentPadding",
themeable : true
},
/** Left padding of the content pane */
contentPaddingLeft :
{
check : "Integer",
init : 0,
apply : "_applyContentPadding",
themeable : true
},
/**
* The 'contentPadding' property is a shorthand property for setting 'contentPaddingTop',
* 'contentPaddingRight', 'contentPaddingBottom' and 'contentPaddingLeft'
* at the same time.
*
* If four values are specified they apply to top, right, bottom and left respectively.
* If there is only one value, it applies to all sides, if there are two or three,
* the missing values are taken from the opposite side.
*/
contentPadding :
{
group : [
"contentPaddingTop", "contentPaddingRight",
"contentPaddingBottom", "contentPaddingLeft"
],
mode : "shorthand",
themeable : true
}
},
/*
*****************************************************************************
MEMBERS
*****************************************************************************
*/
members :
{
/**
* @type {Map} Maps property names of content padding to the setter of the padding
*
* @lint ignoreReferenceField(__contentPaddingSetter)
*/
__contentPaddingSetter :
{
contentPaddingTop : "setPaddingTop",
contentPaddingRight : "setPaddingRight",
contentPaddingBottom : "setPaddingBottom",
contentPaddingLeft : "setPaddingLeft"
},
/**
* @type {Map} Maps property names of content padding to the themed setter of the padding
*
* @lint ignoreReferenceField(__contentPaddingThemedSetter)
*/
__contentPaddingThemedSetter :
{
contentPaddingTop : "setThemedPaddingTop",
contentPaddingRight : "setThemedPaddingRight",
contentPaddingBottom : "setThemedPaddingBottom",
contentPaddingLeft : "setThemedPaddingLeft"
},
/**
* @type {Map} Maps property names of content padding to the resetter of the padding
*
* @lint ignoreReferenceField(__contentPaddingResetter)
*/
__contentPaddingResetter :
{
contentPaddingTop : "resetPaddingTop",
contentPaddingRight : "resetPaddingRight",
contentPaddingBottom : "resetPaddingBottom",
contentPaddingLeft : "resetPaddingLeft"
},
// property apply
_applyContentPadding : function(value, old, name, variant)
{
var target = this._getContentPaddingTarget();
if (value == null)
{
var resetter = this.__contentPaddingResetter[name];
target[resetter]();
}
else
{
// forward the themed sates if case the apply was invoked by a theme
if (variant == "setThemed" || variant == "resetThemed") {
var setter = this.__contentPaddingThemedSetter[name];
target[setter](value);
} else {
var setter = this.__contentPaddingSetter[name];
target[setter](value);
}
}
}
}
});