Resizer
Import :
const Resizer = brackets.getModule("utils/Resizer")
DIRECTION_VERTICAL : string
Represents the vertical direction.
Kind: global variable
DIRECTION_HORIZONTAL : string
Represents the horizontal direction.
Kind: global variable
POSITION_TOP : string
Indicates the top position.
Kind: global variable
POSITION_BOTTOM : string
Indicates the bottom position.
Kind: global variable
POSITION_LEFT : string
Indicates the left position.
Kind: global variable
POSITION_RIGHT : string
Indicates the right position.
Kind: global variable
PREFS_PURE_CODE : string
Preference for a distraction-free mode.
Kind: global variable
EVENT_PANEL_COLLAPSED : string
Event triggered when a panel is collapsed.
Kind: global constant
EVENT_PANEL_EXPANDED : string
Event triggered when a panel is expanded.
Kind: global constant
EVENT_PANEL_RESIZE_START : string
Event triggered at the start of panel resizing.
Kind: global constant
EVENT_PANEL_RESIZE_UPDATE : string
Event triggered during panel resizing updates.
Kind: global constant
EVENT_PANEL_RESIZE_END : string
Event triggered at the end of panel resizing.
Kind: global constant
show(element)
Shows a resizable element.
Kind: global function
| Param | Type | Description |
|---|---|---|
| element | DOMNode | Html element to show if possible |
hide(element)
Hides a resizable element.
Kind: global function
| Param | Type | Description |
|---|---|---|
| element | DOMNode | Html element to hide if possible |
toggle(element)
Changes the visibility state of a resizable element. The toggle functionality is added when an element is made resizable.
Kind: global function
| Param | Type | Description |
|---|---|---|
| element | DOMNode | Html element to toggle |
removeSizable(element)
Removes the resizability of an element if it's resizable
Kind: global function
| Param | Type | Description |
|---|---|---|
| element | DOMNode | Html element in which to remove sizing |
resyncSizer(element)
Updates the sizing div by resyncing to the sizing edge of the element Call this method after manually changing the size of the element
Kind: global function
| Param | Type | Description |
|---|---|---|
| element | DOMNode | Html element whose sizer should be resynchronized |
isVisible(element) ⇒ boolean
Returns the visibility state of a resizable element.
Kind: global function
Returns: boolean - true if element is visible, false if it is not visible
| Param | Type | Description |
|---|---|---|
| element | DOMNode | Html element to toggle |
makeResizable(element, direction, position, minSize, collapsible, forceLeft, createdByWorkspaceManager, usePercentages, forceRight, _attachToParent, [initialSize])
Adds resizing and (optionally) expand/collapse capabilities to a given html element. The element's size & visibility are automatically saved & restored as a view-state preference.
Resizing can be configured in two directions:
- Vertical ("vert"): Resizes the height of the element
- Horizontal ("horz"): Resizes the width of the element
Resizer handlers can be positioned on the element at:
- Top ("top") or bottom ("bottom") for vertical resizing
- Left ("left") or right ("right") for horizontal resizing
A resizable element triggers the following events while resizing:
- panelResizeStart: When the resize starts. Passed the new size.
- panelResizeUpdate: When the resize gets updated. Passed the new size.
- panelResizeEnd: When the resize ends. Passed the final size.
- panelCollapsed: When the panel gets collapsed (or hidden). Passed the last size before collapse. May occur without any resize events.
- panelExpanded: When the panel gets expanded (or shown). Passed the initial size. May occur without any resize events.
Kind: global function
| Param | Type | Description |
|---|---|---|
| element | DOMNode | DOM element which should be made resizable. Must have an id attribute, for use as a preferences key. |
| direction | string | Direction of the resize action: one of the DIRECTION_* constants. |
| position | string | Which side of the element can be dragged: one of the POSITION_* constants (TOP/BOTTOM for vertical resizing or LEFT/RIGHT for horizontal). |
| minSize | number | Minimum size (width or height) of the element's outer dimensions, including border & padding. Defaults to DEFAULT_MIN_SIZE. |
| collapsible | boolean | Indicates the panel is collapsible on double click on the resizer. Defaults to false. |
| forceLeft | string | CSS selector indicating element whose 'left' should be locked to the the resizable element's size (useful for siblings laid out to the right of the element). Must lie in element's parent's subtree. |
| createdByWorkspaceManager | boolean | For internal use only |
| usePercentages | boolean | Maintain the size of the element as a percentage of its parent the default is to maintain the size of the element in pixels |
| forceRight | string | CSS selector indicating element whose 'right' should be locked to the the resizable element's size (useful for siblings laid out to the left of the element). Must lie in element's parent's subtree. |
| _attachToParent | boolean | Attaches the resizer element to parent of the element rather than to element itself. Attach the resizer to the parent ONLY if element has the same offset as parent otherwise the resizer will be incorrectly positioned. FOR INTERNAL USE ONLY |
| [initialSize] | number | Optional Initial size of panel in px. If not given, panel will use minsize or current size. |