Widget extension, which can be used to add extended XY positioning support to
the base Widget class, through the Base.create method.
Note: This extension requires that the WidgetPosition extension be added
to the Widget (before WidgetPositionAlign, if part of the same extension list
passed to Base.build).
_afterAlignChangee
Handles alignChange events by updating the UI in response to align
Attribute changes.
_afterAlignOnChangee
Handles alignOnChange events by updating the alignment-syncing event
handlers.
_attachPosAlignUIHandlesAttaches the alignment-syncing event handlers.
_bindUIPosAlignBind event listeners responsible for updating the UI state in response to the widget's position-align related state changes.
This method is invoked after bindUI has been invoked for the Widget
class using the AOP infrastructure.
_detachPosAlignUIHandlesDetaches the alignment-syncing event handlers.
_doAlignwidgetPoint
x
y
Helper method, used to align the given point on the widget, with the XY page coordinates provided.
_getRegion[node]
Returns the region of the passed-in Node, or the viewport region if
calling with passing in a Node.
[node]
Node
optional
The node to get the region of.
The node's region.
_setAlignCenterval
Default setter for center Attribute changes. Sets up the appropriate
value, and passes it through the to the align attribute.
_syncUIPosAlignSynchronizes the current align Attribute value to the DOM.
This method is invoked after syncUI has been invoked for the Widget
class using the AOP infrastructure.
_uiSetAlign[node]
points
Updates the UI to reflect the align value passed in.
Note: See the align Attribute documentation, for the Object structure
expected.
_uiSetVisiblePosAlignvisible
Attaches or detaches alignment-syncing event handlers based on the widget's
visible Attribute state.
visible
Boolean
The current value of the widget's visible
Attribute.
align[node]
[points]
Aligns this widget to the provided Node (or viewport) using the provided
points. This method can be invoked with no arguments which will cause the
widget's current align Attribute value to be synced to the DOM.
[node]
Node | String | Null
optional
A reference (or selector String) for the
Node which with the widget is to be aligned. If null is passed in, the
widget will be aligned with the viewport.
[points]
Array2
optional
A two item array specifying the points on the
widget and Node/viewport which will to be aligned. The first entry is
the point on the widget, and the second entry is the point on the
Node/viewport. Valid point references are defined as static constants on
the WidgetPositionAlign extension.
Aligning to the top-left corner of the <body>:
myWidget.align('body',
[Y.WidgetPositionAlign.TL, Y.WidgetPositionAlign.TR]);centered[node]
Centers the widget in the viewport, or if a Node is passed in, it will
be centered to that Node.
alignThe alignment configuration for this widget.
The align attribute is used to align a reference point on the widget, with
the reference point on another Node, or the viewport. The object which
align expects has the following properties:
node: The Node to which the widget is to be aligned. If set to
null, or not provided, the widget is aligned to the viewport.
points: A two element Array, defining the two points on the widget
and Node/viewport which are to be aligned. The first element is the
point on the widget, and the second element is the point on the
Node/viewport. Supported alignment points are defined as static
properties on WidgetPositionAlign.
Default: null
alignChange
Fires when the value for the configuration attribute align is
changed. You can listen for the event using the on method if you
wish to be notified before the attribute's value has changed, or
using the after method if you wish to be notified after the
attribute's value has changed.
e
EventFacade
Aligns the top-right corner of the widget with the top-left corner of the viewport:
myWidget.set('align', {
points: [Y.WidgetPositionAlign.TR, Y.WidgetPositionAlign.TL]
});alignOnAn Array of Objects corresponding to the Nodes and events that will cause
the alignment of this widget to be synced to the DOM.
The alignOn Attribute is expected to be an Array of Objects with the
following properties:
eventName: The String event name to listen for.
node: The optional Node that will fire the event, it can be a
Node reference or a selector String. This will default to the widget's
boundingBox.
Default: []
alignOnChange
Fires when the value for the configuration attribute alignOn is
changed. You can listen for the event using the on method if you
wish to be notified before the attribute's value has changed, or
using the after method if you wish to be notified after the
attribute's value has changed.
e
EventFacade
Sync this widget's alignment on window resize:
myWidget.set('alignOn', [
{
node : Y.one('win'),
eventName: 'resize'
}
]);centeredA convenience Attribute, which can be used as a shortcut for the align
Attribute.
If set to true, the widget is centered in the viewport. If set to a Node
reference or valid selector String, the widget will be centered within the
Node. If set to false, no center positioning is applied.
Default: false
centeredChange
Fires when the value for the configuration attribute centered is
changed. You can listen for the event using the on method if you
wish to be notified before the attribute's value has changed, or
using the after method if you wish to be notified after the
attribute's value has changed.
e
EventFacade