X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6a7e4474cba9d8be4b2ec445e10f1691f7277c50..6b044c28b5f26fb99c86c237ffad19741c0f7f3d:/docs/source/Element.fx.html diff --git a/docs/source/Element.fx.html b/docs/source/Element.fx.html index 9a7e1240..27357b34 100644 --- a/docs/source/Element.fx.html +++ b/docs/source/Element.fx.html @@ -7,10 +7,10 @@
/*! - * Ext JS Library 3.2.0 - * Copyright(c) 2006-2010 Ext JS, Inc. - * licensing@extjs.com - * http://www.extjs.com/license + * Ext JS Library 3.3.1 + * Copyright(c) 2006-2010 Sencha Inc. + * licensing@sencha.com + * http://www.sencha.com/license */ /** * @class Ext.Element @@ -28,16 +28,38 @@ Ext.Element.VISIBILITY = 1; */ Ext.Element.DISPLAY = 2; +/** + * Visibility mode constant for use with {@link #setVisibilityMode}. Use offsets (x and y positioning offscreen) + * to hide element. + * @static + * @type Number + */ +Ext.Element.OFFSETS = 3; + + +Ext.Element.ASCLASS = 4; + +/** + * Defaults to 'x-hide-nosize' + * @static + * @type String + */ +Ext.Element.visibilityCls = 'x-hide-nosize'; + Ext.Element.addMethods(function(){ - var VISIBILITY = "visibility", + var El = Ext.Element, + OPACITY = "opacity", + VISIBILITY = "visibility", DISPLAY = "display", HIDDEN = "hidden", OFFSETS = "offsets", + ASCLASS = "asclass", NONE = "none", + NOSIZE = 'nosize', ORIGINALDISPLAY = 'originalDisplay', VISMODE = 'visibilityMode', - ELDISPLAY = Ext.Element.DISPLAY, - data = Ext.Element.data, + ISVISIBLE = 'isVisible', + data = El.data, getDisplay = function(dom){ var d = data(dom, ORIGINALDISPLAY); if(d === undefined){ @@ -223,7 +245,7 @@ el.animate( // private legacy anim prep preanim : function(a, i){ - return !a[i] ? false : (Ext.isObject(a[i]) ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]}); + return !a[i] ? false : (typeof a[i] == 'object' ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]}); }, /** @@ -231,7 +253,20 @@ el.animate( * @return {Boolean} True if the element is currently visible, else false */ isVisible : function() { - return !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE); + var me = this, + dom = me.dom, + visible = data(dom, ISVISIBLE); + + if(typeof visible == 'boolean'){ //return the cached value if registered + return visible; + } + //Determine the current state based on display states + visible = !me.isStyle(VISIBILITY, HIDDEN) && + !me.isStyle(DISPLAY, NONE) && + !((getVisMode(dom) == El.ASCLASS) && me.hasClass(me.visibilityCls || El.visibilityCls)); + + data(dom, ISVISIBLE, visible); + return visible; }, /** @@ -241,43 +276,63 @@ el.animate( * @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){ - var me = this, isDisplay, isVisible, isOffsets, - dom = me.dom; + setVisible : function(visible, animate){ + var me = this, isDisplay, isVisibility, isOffsets, isNosize, + dom = me.dom, + visMode = getVisMode(dom); + // hideMode string override - if (Ext.isString(animate)){ - isDisplay = animate == DISPLAY; - isVisible = animate == VISIBILITY; - isOffsets = animate == OFFSETS; + if (typeof animate == 'string'){ + switch (animate) { + case DISPLAY: + visMode = El.DISPLAY; + break; + case VISIBILITY: + visMode = El.VISIBILITY; + break; + case OFFSETS: + visMode = El.OFFSETS; + break; + case NOSIZE: + case ASCLASS: + visMode = El.ASCLASS; + break; + } + me.setVisibilityMode(visMode); animate = false; - } else { - isDisplay = getVisMode(this.dom) == ELDISPLAY; - isVisible = !isDisplay; } if (!animate || !me.anim) { - if (isDisplay){ - me.setDisplayed(visible); - } else if (isOffsets){ + if(visMode == El.ASCLASS ){ + + me[visible?'removeClass':'addClass'](me.visibilityCls || El.visibilityCls); + + } else if (visMode == El.DISPLAY){ + + return me.setDisplayed(visible); + + } else if (visMode == El.OFFSETS){ + if (!visible){ me.hideModeStyles = { position: me.getStyle('position'), top: me.getStyle('top'), left: me.getStyle('left') }; - me.applyStyles({position: 'absolute', top: '-10000px', left: '-10000px'}); } else { me.applyStyles(me.hideModeStyles || {position: '', top: '', left: ''}); + delete me.hideModeStyles; } + }else{ me.fixDisplay(); dom.style.visibility = visible ? "visible" : HIDDEN; } }else{ // closure for composites - if (visible){ + if(visible){ me.setOpacity(.01); me.setVisible(true); } @@ -287,15 +342,24 @@ el.animate( .35, 'easeIn', function(){ - if(!visible){ - dom.style[isDisplay ? DISPLAY : VISIBILITY] = (isDisplay) ? NONE : HIDDEN; - Ext.fly(dom).setOpacity(1); - } + visible || me.setVisible(false).setOpacity(1); }); } + data(dom, ISVISIBLE, visible); //set logical visibility state return me; }, + + /** + * @private + * Determine if the Element has a relevant height and width available based + * upon current logical visibility state + */ + hasMetrics : function(){ + var dom = this.dom; + return this.isVisible() || (getVisMode(dom) == El.VISIBILITY); + }, + /** * 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 @@ -339,7 +403,7 @@ el.animate( */ hide : function(animate){ // hideMode override - if (Ext.isString(animate)){ + if (typeof animate == 'string'){ this.setVisible(false, animate); return this; } @@ -354,7 +418,7 @@ el.animate( */ show : function(animate){ // hideMode override - if (Ext.isString(animate)){ + if (typeof animate == 'string'){ this.setVisible(true, animate); return this; }