/**     * Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)     * @param {String} selector The simple selector to test     * @param {Number/Mixed} maxDepth (optional) The max depth to            search as a number or element (defaults to 10 || document.body)     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node     * @return {HTMLElement} The matching DOM node (or null if no match was found)     */    findParentNode : function(simpleSelector, maxDepth, returnEl){        var p = Ext.fly(this.dom.parentNode, '_internal');        return p ? p.findParent(simpleSelector, maxDepth, returnEl) : null;    },    /**     * Walks up the dom looking for a parent node that matches the passed simple selector (e.g. div.some-class or span:first-child).     * This is a shortcut for findParentNode() that always returns an Ext.Element.     * @param {String} selector The simple selector to test     * @param {Number/Mixed} maxDepth (optional) The max depth to            search as a number or element (defaults to 10 || document.body)     * @return {Ext.Element} The matching DOM node (or null if no match was found)     */    up : function(simpleSelector, maxDepth){        return this.findParentNode(simpleSelector, maxDepth, true);    },    /**     * Returns true if this element matches the passed simple selector (e.g. div.some-class or span:first-child)     * @param {String} selector The simple selector to test     * @return {Boolean} True if this element matches the selector, else false     */    is : function(simpleSelector){        return Ext.DomQuery.is(this.dom, simpleSelector);    },    /**     * Perform animation on this element.     * @param {Object} args The animation control args     * @param {Float} duration (optional) How long the animation lasts in seconds (defaults to .35)     * @param {Function} onComplete (optional) Function to call when animation completes     * @param {String} easing (optional) Easing method to use (defaults to 'easeOut')     * @param {String} animType (optional) 'run' is the default. Can also be 'color', 'motion', or 'scroll'     * @return {Ext.Element} this     */    animate : function(args, duration, onComplete, easing, animType){        this.anim(args, {duration: duration, callback: onComplete, easing: easing}, animType);        return this;    },    /*     * @private Internal animation call     */    anim : function(args, opt, animType, defaultDur, defaultEase, cb){        animType = animType || 'run';        opt = opt || {};        var anim = Ext.lib.Anim[animType](            this.dom, args,            (opt.duration || defaultDur) || .35,            (opt.easing || defaultEase) || 'easeOut',            function(){                Ext.callback(cb, this);                Ext.callback(opt.callback, opt.scope || this, [this, opt]);            },            this        );        opt.anim = anim;        return anim;    },    // private legacy anim prep    preanim : function(a, i){        return !a[i] ? false : (typeof a[i] == "object" ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]});    },    /**     * Removes worthless text nodes     * @param {Boolean} forceReclean (optional) By default the element     * keeps track if it has been cleaned already so     * you can call this over and over. However, if you update the element and     * need to force a reclean, you can pass true.     */    clean : function(forceReclean){        if(this.isCleaned && forceReclean !== true){            return this;        }        var ns = /\S/;        var d = this.dom, n = d.firstChild, ni = -1; 	    while(n){ 	        var nx = n.nextSibling; 	        if(n.nodeType == 3 && !ns.test(n.nodeValue)){ 	            d.removeChild(n); 	        }else{ 	            n.nodeIndex = ++ni; 	        } 	        n = nx; 	    } 	    this.isCleaned = true; 	    return this; 	},    /**     * Scrolls this element into view within the passed container.     * @param {Mixed} container (optional) The container element to scroll (defaults to document.body).  Should be a     * string (id), dom node, or Ext.Element.     * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)     * @return {Ext.Element} this     */    scrollIntoView : function(container, hscroll){        var c = Ext.getDom(container) || Ext.getBody().dom;        var el = this.dom;        var o = this.getOffsetsTo(c),            l = o[0] + c.scrollLeft,            t = o[1] + c.scrollTop,            b = t+el.offsetHeight,            r = l+el.offsetWidth;        var ch = c.clientHeight;        var ct = parseInt(c.scrollTop, 10);        var cl = parseInt(c.scrollLeft, 10);        var cb = ct + ch;        var cr = cl + c.clientWidth;        if(el.offsetHeight > ch || t < ct){        	c.scrollTop = t;        }else if(b > cb){            c.scrollTop = b-ch;        }        c.scrollTop = c.scrollTop; // corrects IE, other browsers will ignore        if(hscroll !== false){			if(el.offsetWidth > c.clientWidth || l < cl){                c.scrollLeft = l;            }else if(r > cr){                c.scrollLeft = r-c.clientWidth;            }            c.scrollLeft = c.scrollLeft;        }        return this;    },    // private    scrollChildIntoView : function(child, hscroll){        Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);    },    /**     * Measures the element's content height and updates height to match. Note: this function uses setTimeout so     * the new height may not be available immediately.     * @param {Boolean} animate (optional) Animate the transition (defaults to false)     * @param {Float} duration (optional) Length of the animation in seconds (defaults to .35)     * @param {Function} onComplete (optional) Function to call when animation completes     * @param {String} easing (optional) Easing method to use (defaults to easeOut)     * @return {Ext.Element} this     */    autoHeight : function(animate, duration, onComplete, easing){        var oldHeight = this.getHeight();        this.clip();        this.setHeight(1); // force clipping        setTimeout(function(){            var height = parseInt(this.dom.scrollHeight, 10); // parseInt for Safari            if(!animate){                this.setHeight(height);                this.unclip();                if(typeof onComplete == "function"){                    onComplete();                }            }else{                this.setHeight(oldHeight); // restore original height                this.setHeight(height, animate, duration, function(){                    this.unclip();                    if(typeof onComplete == "function") onComplete();                }.createDelegate(this), easing);            }        }.createDelegate(this), 0);        return this;    },    /**     * Returns true if this element is an ancestor of the passed element     * @param {HTMLElement/String} el The element to check     * @return {Boolean} True if this element is an ancestor of el, else false     */    contains : function(el){        if(!el){return false;}        return D.isAncestor(this.dom, el.dom ? el.dom : el);    },    /**     * Checks whether the element is currently visible using both visibility and display properties.     * @param {Boolean} deep (optional) True to walk the dom and see if parent elements are hidden (defaults to false)     * @return {Boolean} True if the element is currently visible, else false     */    isVisible : function(deep) {        var vis = !(this.getStyle("visibility") == "hidden" || this.getStyle("display") == "none");        if(deep !== true || !vis){            return vis;        }        var p = this.dom.parentNode;        while(p && p.tagName.toLowerCase() != "body"){            if(!Ext.fly(p, '_isVisible').isVisible()){                return false;            }            p = p.parentNode;        }        return true;    },    /**     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).     * @param {String} selector The CSS selector     * @param {Boolean} unique (optional) True to create a unique Ext.Element for each child (defaults to false, which creates a single shared flyweight object)     * @return {CompositeElement/CompositeElementLite} The composite element     */    select : function(selector, unique){        return El.select(selector, unique, this.dom);    },    /**     * Selects child nodes based on the passed CSS selector (the selector should not contain an id).     * @param {String} selector The CSS selector     * @return {Array} An array of the matched nodes     */    query : function(selector){        return Ext.DomQuery.select(selector, this.dom);    },    /**     * Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).     * @param {String} selector The CSS selector     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)     */    child : function(selector, returnDom){        var n = Ext.DomQuery.selectNode(selector, this.dom);        return returnDom ? n : Ext.get(n);    },    /**     * Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).     * @param {String} selector The CSS selector     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)     */    down : function(selector, returnDom){        var n = Ext.DomQuery.selectNode(" > " + selector, this.dom);        return returnDom ? n : Ext.get(n);    },    /**     * Initializes a {@link Ext.dd.DD} drag drop object for this element.     * @param {String} group The group the DD object is member of     * @param {Object} config The DD config object     * @param {Object} overrides An object containing methods to override/implement on the DD object     * @return {Ext.dd.DD} The DD object     */    initDD : function(group, config, overrides){        var dd = new Ext.dd.DD(Ext.id(this.dom), group, config);        return Ext.apply(dd, overrides);    },    /**     * Initializes a {@link Ext.dd.DDProxy} object for this element.     * @param {String} group The group the DDProxy object is member of     * @param {Object} config The DDProxy config object     * @param {Object} overrides An object containing methods to override/implement on the DDProxy object     * @return {Ext.dd.DDProxy} The DDProxy object     */    initDDProxy : function(group, config, overrides){        var dd = new Ext.dd.DDProxy(Ext.id(this.dom), group, config);        return Ext.apply(dd, overrides);    },    /**     * Initializes a {@link Ext.dd.DDTarget} object for this element.     * @param {String} group The group the DDTarget object is member of     * @param {Object} config The DDTarget config object     * @param {Object} overrides An object containing methods to override/implement on the DDTarget object     * @return {Ext.dd.DDTarget} The DDTarget object     */    initDDTarget : function(group, config, overrides){        var dd = new Ext.dd.DDTarget(Ext.id(this.dom), group, config);        return Ext.apply(dd, overrides);    },    /**     * Sets the visibility of the element (see details). If the visibilityMode is set to Element.DISPLAY, it will use     * the display property to hide the element, otherwise it uses visibility. The default is to hide and show using the visibility property.     * @param {Boolean} visible Whether the element is visible     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object     * @return {Ext.Element} this     */     setVisible : function(visible, animate){        if(!animate || !A){            if(this.visibilityMode == El.DISPLAY){                this.setDisplayed(visible);            }else{                this.fixDisplay();                this.dom.style.visibility = visible ? "visible" : "hidden";            }        }else{            // closure for composites            var dom = this.dom;            var visMode = this.visibilityMode;            if(visible){                this.setOpacity(.01);                this.setVisible(true);            }            this.anim({opacity: { to: (visible?1:0) }},                  this.preanim(arguments, 1),                  null, .35, 'easeIn', function(){                     if(!visible){                         if(visMode == El.DISPLAY){                             dom.style.display = "none";                         }else{                             dom.style.visibility = "hidden";                         }                         Ext.get(dom).setOpacity(1);                     }                 });        }        return this;    },    /**     * Returns true if display is not "none"     * @return {Boolean}     */    isDisplayed : function() {        return this.getStyle("display") != "none";    },    /**     * Toggles the element's visibility or display, depending on visibility mode.     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object