elementSizeFunction = function (newSize) {
                if (!newSize) {
                    // calling the function as a getter
                    if (direction === DIRECTION_HORIZONTAL) {
                        return this.width();
                    } else {
                        return this.height();
                    }
                } else if (!usePercentages) {
                    if (direction === DIRECTION_HORIZONTAL) {
                        return this.width(newSize);
                    } else {
                        return this.height(newSize);
                    }
                } else {
                    // calling the function as a setter
                    var parentSize = parentSizeFunction.apply($parent),
                        percentage,
                        prop;

                    if (direction === DIRECTION_HORIZONTAL) {
                        prop = "width";
                    } else {
                        prop = "height";
                    }
                    percentage = newSize / parentSize;
                    this.css(prop, (percentage * 100) + "%");

                    return this; // chainable
                }
            }
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.

@param {!DOMNode} element DOM element which should be made resizable. Must have an id attribute, for
                         use as a preferences key.
@param {!string} direction Direction of the resize action: one of the DIRECTION_* constants.
@param {!string} position Which side of the element can be dragged: one of the POSITION_* constants
                         (TOP/BOTTOM for vertical resizing or LEFT/RIGHT for horizontal).
@param {?number} minSize Minimum size (width or height) of the element's outer dimensions, including
                         border & padding. Defaults to DEFAULT_MIN_SIZE.
@param {?boolean} collapsible Indicates the panel is collapsible on double click on the
                         resizer. Defaults to false.
@param {?string} forceLeft 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.
@param {?boolean} createdByWorkspaceManager For internal use only
@param {?boolean} usePercentages Maintain the size of the element as a percentage of its parent
                         the default is to maintain the size of the element in pixels
@param {?boolean} _attachToParent 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