Class type Ext_util_Positionable.t

class type t = object .. end

Inherits

Ext_Base.t

method alignTo : 'a 'b.
         'a Js.t ->
         Js.js_string Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef ->
         'b Js.t Js.optdef ->
         (< alignTo : 'a 'b. 'c;
            anchorTo : 'e 'f 'g 'h.
                         'e Js.t ->
                         Js.js_string Js.t Js.optdef ->
                         Js.number Js.t Js.js_array Js.t Js.optdef ->
                         'f Js.t Js.optdef ->
                         'g Js.t Js.optdef ->
                         'h Js.callback Js.optdef -> 'd Js.t Js.meth;
            calculateConstrainedPosition : 'i.
                                             'i Js.t Js.optdef ->
                                             Js.number Js.t Js.js_array Js.t
                                             Js.optdef ->
                                             bool Js.t Js.optdef ->
                                             Js.number Js.t Js.js_array Js.t
                                             Js.optdef ->
                                             Js.number Js.t Js.js_array Js.t Js.meth;
            callParent : 'j 'k. 'j Js.t -> 'k Js.t Js.meth;
            callSuper : 'l 'm. 'l Js.t -> 'm Js.t Js.meth;
            getAlignToXY : 'n.
                             'n Js.t ->
                             Js.js_string Js.t Js.optdef ->
                             Js.number Js.t Js.js_array Js.t Js.optdef ->
                             Js.number Js.t Js.js_array Js.t Js.meth;
            getAnchorXY : 'o.
                            Js.js_string Js.t Js.optdef ->
                            bool Js.t Js.optdef ->
                            'o Js.t Js.optdef ->
                            Js.number Js.t Js.js_array Js.t Js.meth;
            getBox : 'p.
                       bool Js.t Js.optdef -> bool Js.t Js.optdef -> 'p Js.t Js.meth;
            getConstrainVector : 'q 'r.
                                   'q Js.t Js.optdef ->
                                   Js.number Js.t Js.js_array Js.t Js.optdef ->
                                   Js.number Js.t Js.js_array Js.t Js.optdef ->
                                   'r Js.t Js.meth;
            getInitialConfig : 's. Js.js_string Js.t Js.optdef -> 's Js.t Js.meth;
            getLocalX : Js.number Js.t Js.meth;
            getLocalXY : Js.number Js.t Js.js_array Js.t Js.meth;
            getLocalY : Js.number Js.t Js.meth;
            getOffsetsTo : 't. 't Js.t -> Js.number Js.t Js.js_array Js.t Js.meth;
            getRegion : Ext_util_Region.t Js.t Js.meth;
            getViewRegion : Ext_util_Region.t Js.t Js.meth;
            getX : Js.number Js.t Js.meth;
            getXY : Js.number Js.t Js.js_array Js.t Js.meth;
            getY : Js.number Js.t Js.meth;
            initConfig : 'u. 'u Js.t -> 'd Js.t Js.meth;
            move : 'v.
                     Js.js_string Js.t ->
                     Js.number Js.t -> 'v Js.t Js.optdef -> unit Js.meth;
            removeAnchor : 'd Js.t Js.meth; self : Ext_Class.t Js.t Js.prop;
            setBox : 'w 'x. 'w Js.t -> 'x Js.t Js.optdef -> 'd Js.t Js.meth;
            setLocalX : Js.number Js.t -> 'd Js.t Js.meth;
            setLocalXY : 'y. 'y Js.t -> Js.number Js.t Js.optdef -> 'd Js.t Js.meth;
            setLocalY : Js.number Js.t -> 'd Js.t Js.meth;
            setRegion : 'z.
                          Ext_util_Region.t Js.t ->
                          'z Js.t Js.optdef -> 'd Js.t Js.meth;
            setX : 'a1. Js.number Js.t -> 'a1 Js.t Js.optdef -> 'd Js.t Js.meth;
            setXY : 'b1.
                      Js.number Js.t Js.js_array Js.t ->
                      'b1 Js.t Js.optdef -> 'd Js.t Js.meth;
            setY : 'c1. Js.number Js.t -> 'c1 Js.t Js.optdef -> 'd Js.t Js.meth;
            statics : Ext_Class.t Js.t Js.meth;
            translatePoints : 'd1 'e1.
                                'd1 Js.t ->
                                Js.number Js.t Js.optdef -> 'e1 Js.t Js.meth;
            .. >
          as 'd)
         Js.t Js.meth as 'c

Aligns the element with another element relative to the specified anchor points. If the other element is the document it aligns it to the viewport. The position parameter is optional, and can be specified in any one of the following formats:

Blank: Defaults to aligning the element's top-left corner to the target's bottom-left corner ("tl-bl").
One anchor (deprecated): The passed anchor position is used as the target element's anchor point. The element being aligned will position its top-left corner (tl) to that point. This method has been deprecated in favor of the newer two anchor syntax below.
Two anchors: If two values from the table below are passed separated by a dash, the first value is used as the element's anchor point, and the second value is used as the target's anchor point.

In addition to the anchor points, the position parameter also supports the "?" character. If "?" is passed at the end of the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to the viewport if necessary. Note that the element being aligned might be swapped to align to a different position than that specified in order to enforce the viewport constraints. Following are all of the supported anchor positions:

Value  Description
-----  -----------------------------
tl     The top left corner (default)
t      The center of the top edge
tr     The top right corner
l      The center of the left edge
c      In the center of the element
r      The center of the right edge
bl     The bottom left corner
b      The center of the bottom edge
br     The bottom right corner

Example Usage:

// align el to other-el using the default positioning
// ("tl-bl", non-constrained)
el.alignTo("other-el");

// align the top left corner of el with the top right corner of other-el
// (constrained to viewport)
el.alignTo("other-el", "tr?");

// align the bottom right corner of el with the center left edge of other-el
el.alignTo("other-el", "br-l?");

// align the center of el with the bottom left corner of other-el and
// adjust the x position by -6 pixels (and the y position by 0)
el.alignTo("other-el", "c-bl", [-6, 0]);

Parameters:

element: _ Js.t
The Positionable, HTMLElement, or id of the element to align to.
position: Js.js_string Js.t (optional)
The position to align to

Defaults to: "tl-bl?"
offsets: Js.number Js.t Js.js_array Js.t (optional)
Offset the positioning by [x, y]
animate: _ Js.t (optional)
true for the default animation or a standard Element animation config object

Returns:

Ext_util_Positionable.t Js.t
this

method anchorTo : 'e 'f 'g 'h.
         'e Js.t ->
         Js.js_string Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef ->
         'f Js.t Js.optdef ->
         'g Js.t Js.optdef -> 'h Js.callback Js.optdef -> 'd Js.t Js.meth

Anchors an element to another element and realigns it when the window is resized.

Parameters:

element: _ Js.t
The Positionable, HTMLElement, or id of the element to align to.
position: Js.js_string Js.t (optional)
The position to align to

Defaults to: "tl-bl?"
offsets: Js.number Js.t Js.js_array Js.t (optional)
Offset the positioning by [x, y]
animate: _ Js.t (optional)
true for the default animation or a standard Element animation config object
monitorScroll: _ Js.t (optional)
True to monitor body scroll and reposition. If this parameter is a number, it is used as the buffer delay in milliseconds.
Defaults to: 50
callback: _ Js.callback (optional)
The function to call after the animation finishes

Returns:

Ext_util_Positionable.t Js.t
this

method calculateConstrainedPosition : 'i.
         'i Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef ->
         bool Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.meth

Calculates the new [x,y] position to move this Positionable into a constrain region.

By default, this Positionable is constrained to be within the container it was added to, or the element it was rendered to.

Priority is given to constraining the top and left within the constraint.

An alternative constraint may be passed.

Parameters:

constrainTo: _ Js.t (optional)
The Element or Region into which this Component is to be constrained. Defaults to the element into which this Positionable was rendered, or this Component's {@link Ext.Component.constrainTo.
proposedPosition: Js.number Js.t Js.js_array Js.t (optional)
A proposed [X, Y] position to test for validity and to coerce into constraints instead of using this Positionable's current position.
local: bool Js.t (optional)
The proposedPosition is local (relative to floatParent if a floating Component)
proposedSize: Js.number Js.t Js.js_array Js.t (optional)
A proposed [width, height] size to use when calculating constraints instead of using this Positionable's current size.

Returns:

Js.number Js.t Js.js_array Js.t
If the element needs to be translated, the new [X, Y] position within constraints if possible, giving priority to keeping the top and left edge in the constrain region. Otherwise, false.

method getAlignToXY : 'n.
         'n Js.t ->
         Js.js_string Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.meth

Gets the x,y coordinates to align this element with another element. See alignTo for more info on the supported position values.

Parameters:

element: _ Js.t
The Positionable, HTMLElement, or id of the element to align to.
position: Js.js_string Js.t (optional)
The position to align to

Defaults to: "tl-bl?"
offsets: Js.number Js.t Js.js_array Js.t (optional)
Offset the positioning by [x, y]

Returns:

Js.number Js.t Js.js_array Js.t
[x, y]

method getAnchorXY : 'o.
         Js.js_string Js.t Js.optdef ->
         bool Js.t Js.optdef ->
         'o Js.t Js.optdef -> Js.number Js.t Js.js_array Js.t Js.meth

Gets the x,y coordinates specified by the anchor position on the element.

Parameters:

anchor: Js.js_string Js.t (optional)
The specified anchor position. See alignTo for details on supported anchor positions.
Defaults to: 'tl'
local: bool Js.t (optional)
True to get the local (element top/left-relative) anchor position instead of page coordinates
size: _ Js.t (optional)
An object containing the size to use for calculating anchor position {width: (target width), height: (target height)} (defaults to the element's current size)

Returns:

Js.number Js.t Js.js_array Js.t
[x, y] An array containing the element's x and y coordinates

method getBox : 'p. bool Js.t Js.optdef -> bool Js.t Js.optdef -> 'p Js.t Js.meth

Return an object defining the area of this Element which can be passed to setBox to set another Element's size/location to match this element.

Parameters:

contentBox: bool Js.t (optional)
If true a box for the content of the element is returned.
local: bool Js.t (optional)
If true the element's left and top relative to its offsetParent are returned instead of page x/y.

Returns:

_ Js.t

box An object in the format:

{
    x: <Element's X position>,
    y: <Element's Y position>,
    left: <Element's X position (an alias for x)>,
    top: <Element's Y position (an alias for y)>,
    width: <Element's width>,
    height: <Element's height>,
    bottom: <Element's lower bound>,
    right: <Element's rightmost bound>
}

The returned object may also be addressed as an Array where index 0 contains the X position and index 1 contains the Y position. The result may also be used for setXY

method getConstrainVector : 'q 'r.
         'q Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef ->
         Js.number Js.t Js.js_array Js.t Js.optdef -> 'r Js.t Js.meth

Returns the [X, Y] vector by which this Positionable's element must be translated to make a best attempt to constrain within the passed constraint. Returns false if the element does not need to be moved.

Priority is given to constraining the top and left within the constraint.

The constraint may either be an existing element into which the element is to be constrained, or a Region into which this element is to be constrained.

By default, any extra shadow around the element is not included in the constrain calculations - the edges of the element are used as the element bounds. To constrain the shadow within the constrain region, set the constrainShadow property on this element to true.

Parameters:

constrainTo: _ Js.t (optional)
The Positionable, HTMLElement, element id, or Region into which the element is to be constrained.
proposedPosition: Js.number Js.t Js.js_array Js.t (optional)
A proposed [X, Y] position to test for validity and to produce a vector for instead of using the element's current position
proposedSize: Js.number Js.t Js.js_array Js.t (optional)
A proposed [width, height] size to constrain instead of using the element's current size

Returns:

_ Js.t
If the element needs to be translated, an [X, Y] vector by which this element must be translated. Otherwise, false.

method getLocalX : Js.number Js.t Js.meth

Returns the x coordinate of this element reletive to its offsetParent.

Returns:

Js.number Js.t
The local x coordinate

method getLocalXY : Js.number Js.t Js.js_array Js.t Js.meth

Returns the x and y coordinates of this element relative to its offsetParent.

Returns:

Js.number Js.t Js.js_array Js.t
The local XY position of the element

method getLocalY : Js.number Js.t Js.meth

Returns the y coordinate of this element reletive to its offsetParent.

Returns:

Js.number Js.t
The local y coordinate

method getOffsetsTo : 't. 't Js.t -> Js.number Js.t Js.js_array Js.t Js.meth

Returns the offsets of this element from the passed element. The element must both be part of the DOM tree and not have display:none to have page coordinates.

Parameters:

offsetsTo: _ Js.t
The Positionable, HTMLElement, or element id to get get the offsets from.

Returns:

Js.number Js.t Js.js_array Js.t
The XY page offsets (e.g. [100, -200])

method getRegion : Ext_util_Region.t Js.t Js.meth

Returns a region object that defines the area of this element.

Returns:

Ext_util_Region.t Js.t
A Region containing "top, left, bottom, right" properties.

method getViewRegion : Ext_util_Region.t Js.t Js.meth

Returns the content region of this element. That is the region within the borders and padding.

Returns:

Ext_util_Region.t Js.t
A Region containing "top, left, bottom, right" member data.

method getX : Js.number Js.t Js.meth

Gets the current X position of the DOM element based on page coordinates.

Returns:

Js.number Js.t
The X position of the element

method getXY : Js.number Js.t Js.js_array Js.t Js.meth

Gets the current position of the DOM element based on page coordinates.

Returns:

Js.number Js.t Js.js_array Js.t
The XY position of the element

method getY : Js.number Js.t Js.meth

Gets the current Y position of the DOM element based on page coordinates.

Returns:

Js.number Js.t
The Y position of the element

method move : 'v. Js.js_string Js.t -> Js.number Js.t -> 'v Js.t Js.optdef -> unit Js.meth

Move the element relative to its current position.

Parameters:

direction: Js.js_string Js.t
Possible values are:
- "l" (or "left")
- "r" (or "right")
- "t" (or "top", or "up")
- "b" (or "bottom", or "down")
distance: Js.number Js.t
How far to move the element in pixels
animate: _ Js.t (optional)
true for the default animation or a standard Element animation config object

method removeAnchor : 'd Js.t Js.meth

Remove any anchor to this element. See anchorTo.

Returns:

Ext_util_Positionable.t Js.t
this

method setBox : 'w 'x. 'w Js.t -> 'x Js.t Js.optdef -> 'd Js.t Js.meth

Sets the element's box. If animate is true then x, y, width, and height will be animated concurrently.

Parameters:

box: _ Js.t
The box to fill {x, y, width, height}
animate: _ Js.t (optional)
true for the default animation or a standard Element animation config object

Returns:

Ext_util_Positionable.t Js.t
this

method setLocalX : Js.number Js.t -> 'd Js.t Js.meth

Sets the local x coordinate of this element using CSS style. When used on an absolute positioned element this method is symmetrical with getLocalX, but may not be symmetrical when used on a relatively positioned element.

Parameters:

x: Js.number Js.t
The x coordinate. A value of null sets the left style to 'auto'.

Returns:

Ext_util_Positionable.t Js.t
this

method setLocalXY : 'y. 'y Js.t -> Js.number Js.t Js.optdef -> 'd Js.t Js.meth

Sets the local x and y coordinates of this element using CSS style. When used on an absolute positioned element this method is symmetrical with getLocalXY, but may not be symmetrical when used on a relatively positioned element.

Parameters:

x: _ Js.t
The x coordinate or an array containing [x, y]. A value of null sets the left style to 'auto'
y: Js.number Js.t (optional)
The y coordinate, required if x is not an array. A value of null sets the top style to 'auto'

Returns:

Ext_util_Positionable.t Js.t
this

method setLocalY : Js.number Js.t -> 'd Js.t Js.meth

Sets the local y coordinate of this element using CSS style. When used on an absolute positioned element this method is symmetrical with getLocalY, but may not be symmetrical when used on a relatively positioned element.

Parameters:

y: Js.number Js.t
The y coordinate. A value of null sets the top style to 'auto'.

Returns:

Ext_util_Positionable.t Js.t
this

method setRegion : 'z. Ext_util_Region.t Js.t -> 'z Js.t Js.optdef -> 'd Js.t Js.meth

Sets the element's position and size to the specified region. If animation is true then width, height, x and y will be animated concurrently.

Parameters:

region: Ext_util_Region.t Js.t
The region to fill
animate: _ Js.t (optional)
true for the default animation or a standard Element animation config object

Returns:

Ext_util_Positionable.t Js.t
this

method setX : 'a1. Js.number Js.t -> 'a1 Js.t Js.optdef -> 'd Js.t Js.meth

Sets the X position of the DOM element based on page coordinates.

Parameters:

the: Js.number Js.t
X position
animate: _ Js.t (optional)
True for the default animation, or a standard Element animation config object

Returns:

Ext_util_Positionable.t Js.t
this

method setXY : 'b1. Js.number Js.t Js.js_array Js.t -> 'b1 Js.t Js.optdef -> 'd Js.t Js.meth

Sets the position of the DOM element in page coordinates.

Parameters:

pos: Js.number Js.t Js.js_array Js.t
Contains X & Y [x, y] values for new position (coordinates are page-based)
animate: _ Js.t (optional)
True for the default animation, or a standard Element animation config object

Returns:

Ext_util_Positionable.t Js.t
this

method setY : 'c1. Js.number Js.t -> 'c1 Js.t Js.optdef -> 'd Js.t Js.meth

Sets the Y position of the DOM element based on page coordinates.

Parameters:

the: Js.number Js.t
Y position
animate: _ Js.t (optional)
True for the default animation, or a standard Element animation config object

Returns:

Ext_util_Positionable.t Js.t
this

method translatePoints : 'd1 'e1. 'd1 Js.t -> Js.number Js.t Js.optdef -> 'e1 Js.t Js.meth

Translates the passed page coordinates into left/top css values for the element

Parameters:

x: _ Js.t
The page x or an array containing [x, y]
y: Js.number Js.t (optional)
The page y, required if x is not an array

Returns:

_ Js.t
An object with left and top properties. e.g. {left: (value), top: (value)}