add extjs 6.0.1 sources

[extjs.git] / extjs / packages / core / src / dom / Underlay.js

/**\r
 * A class that provides an underlay element which displays behind an absolutely positioned\r
 * target element and tracks its size and position. Abstract base class for\r
 * {@link Ext.dom.Shadow} and {@link Ext.dom.Shim}\r
 *  \r
 * \r
 * @private\r
 * @abstract\r
 */\r
Ext.define('Ext.dom.Underlay', {\r
    requires: [ 'Ext.dom.UnderlayPool' ],\r
\r
    /**\r
     * @cfg {Ext.dom.Element} target\r
     * The target element\r
     */\r
\r
    /**\r
     * @cfg {Number} zIndex\r
     * The CSS z-index to use for this underlay.  Defaults to the z-index of {@link #target}.\r
     */\r
\r
    constructor: function(config) {\r
        Ext.apply(this, config);\r
    },\r
\r
    /**\r
     * @protected\r
     * Called before the underlay is shown, immediately after its element is retrieved\r
     * from the pool\r
     */\r
    beforeShow: Ext.emptyFn,\r
\r
    /**\r
     * @protected\r
     * Returns the dom element that this underlay should be inserted before.\r
     * Defaults to the target element\r
     * @return {Ext.dom.Element}\r
     */\r
    getInsertionTarget: function() {\r
        return this.target;\r
    },\r
\r
    /**\r
     * @protected\r
     * @return {Ext.dom.UnderlayPool}\r
     */\r
    getPool: function() {\r
        return this.pool ||\r
            (this.self.prototype.pool = new Ext.dom.UnderlayPool(this.elementConfig));\r
    },\r
\r
    /**\r
     * Hides the underlay\r
     */\r
    hide: function() {\r
        var me = this,\r
            el = me.el;\r
        \r
        if (el) {\r
            el.hide();\r
            me.getPool().checkIn(el);\r
            me.el = null;\r
            me.hidden = true;\r
        }\r
    },\r
\r
    /**\r
     * Aligns the underlay to its target element\r
     * @param {Number} [x] The x position of the target element.  If not provided, the \r
     * x position will be read from the DOM.\r
     * @param {Number} [y] The y position of the target element.  If not provided, the\r
     * y position will be read from the DOM.\r
     * @param {Number} [width] The width of the target element.  If not provided, the\r
     * width will be read from the DOM.\r
     * @param {Number} [height] The height of the target element.  If not provided, the\r
     * height will be read from the DOM.\r
     */\r
    realign: function(x, y, width, height) {\r
        var me = this,\r
            el = me.el,\r
            target = me.target,\r
            offsets = me.offsets,\r
            max = Math.max;\r
\r
        if (el) {\r
            if (x == null) {\r
                x = target.getX();\r
            }\r
\r
            if (y == null) {\r
                y = target.getY();\r
            }\r
\r
            if (width == null) {\r
                width = target.getWidth();\r
            }\r
\r
            if (height == null) {\r
                height = target.getHeight();\r
            }\r
\r
            if (offsets) {\r
                x = x + offsets.x;\r
                y = y + offsets.y;\r
                width = max(width + offsets.w, 0);\r
                height = max(height + offsets.h, 0);\r
            }\r
\r
            el.setXY([x, y]);\r
            el.setSize(width, height);\r
        }\r
    },\r
\r
    /**\r
     * Adjust the z-index of this underlay\r
     * @param {Number} zIndex The new z-index\r
     */\r
    setZIndex: function(zIndex) {\r
        this.zIndex = zIndex;\r
\r
        if (this.el) {\r
            this.el.setStyle("z-index", zIndex);\r
        }\r
    },\r
\r
    /**\r
     * Shows the underlay\r
     */\r
    show: function() {\r
        var me = this,\r
            target = me.target,\r
            zIndex = me.zIndex,\r
            el = me.el,\r
            insertionTarget = me.getInsertionTarget().dom,\r
            dom;\r
\r
        if (!el) {\r
            el = me.el = me.getPool().checkOut();\r
        }\r
\r
        me.beforeShow();\r
\r
        if (zIndex == null) {\r
            // For best results, we need the underlay to be as close as possible to its\r
            // target element in the z-index stacking order without overlaying the target\r
            // element.  Since the UnderlayPool inserted the underlay as high as possible\r
            // in the dom tree when we checked the underlay out of the pool, we can assume\r
            // that it comes before the target element in the dom tree, and therefore can\r
            // give it the exact same index as the target element.\r
            zIndex = (parseInt(target.getStyle("z-index"), 10));\r
        }\r
\r
        if (zIndex) {\r
            el.setStyle("z-index", zIndex);\r
        }\r
\r
        // Overlay elements are shared, so fix position to match current owner\r
        el.setStyle('position', me.fixed ? 'fixed' : '');\r
\r
        dom = el.dom;\r
        if (dom.nextSibling !== insertionTarget) {\r
            // inserting the underlay as the previous sibling of the target ensures that\r
            // it will show behind the target, as long as its z-index is less than or equal\r
            // to the z-index of the target element.\r
            target.dom.parentNode.insertBefore(dom, insertionTarget);\r
        }\r
\r
        el.show();\r
        me.realign();\r
        me.hidden = false;\r
    }\r
    \r
});\r