| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243 | <!DOCTYPE html><html><head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>The source code</title>  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>  <style type="text/css">    .highlight { display: block; background-color: #ddd; }  </style>  <script type="text/javascript">    function highlight() {      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";    }  </script></head><body onload="prettyPrint(); highlight();">  <pre class="prettyprint lang-js"><span id='Ext-dom-Element'>/**</span> * @class Ext.dom.Element */Ext.dom.Element.override({<span id='Ext-dom-Element-method-isScrollable'>    /**</span>     * Returns true if this element is scrollable.     * @return {Boolean}     */    isScrollable: function() {        var dom = this.dom;        return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;    },<span id='Ext-dom-Element-method-getScroll'>    /**</span>     * Returns the current scroll position of the element.     * @return {Object} An object containing the scroll position in the format     * `{left: (scrollLeft), top: (scrollTop)}`     */    getScroll: function() {        var d = this.dom,            doc = document,            body = doc.body,            docElement = doc.documentElement,            l,            t,            ret;        if (d == doc || d == body) {            if (Ext.isIE && Ext.isStrict) {                l = docElement.scrollLeft;                t = docElement.scrollTop;            } else {                l = window.pageXOffset;                t = window.pageYOffset;            }            ret = {                left: l || (body ? body.scrollLeft : 0),                top : t || (body ? body.scrollTop : 0)            };        } else {            ret = {                left: d.scrollLeft,                top : d.scrollTop            };        }        return ret;    },<span id='Ext-dom-Element-method-scrollBy'>    /**</span>     * Scrolls this element by the passed delta values, optionally animating.     *      * All of the following are equivalent:     *     *      el.scrollBy(10, 10, true);     *      el.scrollBy([10, 10], true);     *      el.scrollBy({ x: 10, y: 10 }, true);     *      * @param {Number/Number[]/Object} deltaX Either the x delta, an Array specifying x and y deltas or     * an object with "x" and "y" properties.     * @param {Number/Boolean/Object} deltaY Either the y delta, or an animate flag or config object.     * @param {Boolean/Object} animate Animate flag/config object if the delta values were passed separately.     * @return {Ext.Element} this     */    scrollBy: function(deltaX, deltaY, animate) {        var me = this,            dom = me.dom;        // Extract args if deltas were passed as an Array.        if (deltaX.length) {            animate = deltaY;            deltaY = deltaX[1];            deltaX = deltaX[0];        } else if (typeof deltaX != 'number') { // or an object            animate = deltaY;            deltaY = deltaX.y;            deltaX = deltaX.x;        }        if (deltaX) {            me.scrollTo('left', Math.max(Math.min(dom.scrollLeft + deltaX, dom.scrollWidth - dom.clientWidth), 0), animate);        }        if (deltaY) {            me.scrollTo('top', Math.max(Math.min(dom.scrollTop + deltaY, dom.scrollHeight - dom.clientHeight), 0), animate);        }        return me;    },<span id='Ext-dom-Element-method-scrollTo'>    /**</span>     * Scrolls this element the specified scroll point. It does NOT do bounds checking so     * if you scroll to a weird value it will try to do it. For auto bounds checking, use #scroll.     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.     * @param {Number} value The new scroll value     * @param {Boolean/Object} [animate] true for the default animation or a standard Element     * animation config object     * @return {Ext.Element} this     */    scrollTo: function(side, value, animate) {        //check if we're scrolling top or left        var top = /top/i.test(side),            me = this,            dom = me.dom,            animCfg,            prop;        if (!animate || !me.anim) {            // just setting the value, so grab the direction            prop = 'scroll' + (top ? 'Top' : 'Left');            dom[prop] = value;            // corrects IE, other browsers will ignore            dom[prop] = value;        }        else {            animCfg = {                to: {}            };            animCfg.to['scroll' + (top ? 'Top' : 'Left')] = value;            if (Ext.isObject(animate)) {                Ext.applyIf(animCfg, animate);            }            me.animate(animCfg);        }        return me;    },<span id='Ext-dom-Element-method-scrollIntoView'>    /**</span>     * Scrolls this element into view within the passed container.     * @param {String/HTMLElement/Ext.Element} [container=document.body] The container element     * to scroll.  Should be a string (id), dom node, or Ext.Element.     * @param {Boolean} [hscroll=true] False to disable horizontal scroll.     * @param {Boolean/Object} [animate] true for the default animation or a standard Element     * animation config object     * @return {Ext.dom.Element} this     */    scrollIntoView: function(container, hscroll, animate) {        container = Ext.getDom(container) || Ext.getBody().dom;        var el = this.dom,            offsets = this.getOffsetsTo(container),        // el's box            left = offsets[0] + container.scrollLeft,            top = offsets[1] + container.scrollTop,            bottom = top + el.offsetHeight,            right = left + el.offsetWidth,        // ct's box            ctClientHeight = container.clientHeight,            ctScrollTop = parseInt(container.scrollTop, 10),            ctScrollLeft = parseInt(container.scrollLeft, 10),            ctBottom = ctScrollTop + ctClientHeight,            ctRight = ctScrollLeft + container.clientWidth,            newPos;        if (el.offsetHeight > ctClientHeight || top < ctScrollTop) {            newPos = top;        } else if (bottom > ctBottom) {            newPos = bottom - ctClientHeight;        }        if (newPos != null) {            Ext.get(container).scrollTo('top', newPos, animate);        }        if (hscroll !== false) {            newPos = null;            if (el.offsetWidth > container.clientWidth || left < ctScrollLeft) {                newPos = left;            } else if (right > ctRight) {                newPos = right - container.clientWidth;            }            if (newPos != null) {                Ext.get(container).scrollTo('left', newPos, animate);            }        }        return this;    },    // @private    scrollChildIntoView: function(child, hscroll) {        Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);    },<span id='Ext-dom-Element-method-scroll'>    /**</span>     * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is     * within this element's scrollable range.     * @param {String} direction Possible values are:     *     * - `"l"` (or `"left"`)     * - `"r"` (or `"right"`)     * - `"t"` (or `"top"`, or `"up"`)     * - `"b"` (or `"bottom"`, or `"down"`)     *     * @param {Number} distance How far to scroll the element in pixels     * @param {Boolean/Object} [animate] true for the default animation or a standard Element     * animation config object     * @return {Boolean} Returns true if a scroll was triggered or false if the element     * was scrolled as far as it could go.     */    scroll: function(direction, distance, animate) {        if (!this.isScrollable()) {            return false;        }        var el = this.dom,            l = el.scrollLeft, t = el.scrollTop,            w = el.scrollWidth, h = el.scrollHeight,            cw = el.clientWidth, ch = el.clientHeight,            scrolled = false, v,            hash = {                l: Math.min(l + distance, w - cw),                r: v = Math.max(l - distance, 0),                t: Math.max(t - distance, 0),                b: Math.min(t + distance, h - ch)            };        hash.d = hash.b;        hash.u = hash.t;        direction = direction.substr(0, 1);        if ((v = hash[direction]) > -1) {            scrolled = true;            this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.anim(animate));        }        return scrolled;    }});</pre></body></html>
 |