X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6e39d509471fe9b4e2660e0d1631b350d0c66f40..b37ceabb82336ee82757cd32efe353cfab8ec267:/docs/source/Element.fx.html diff --git a/docs/source/Element.fx.html b/docs/source/Element.fx.html index 8a70c72a..253f7d9e 100644 --- a/docs/source/Element.fx.html +++ b/docs/source/Element.fx.html @@ -1,328 +1,368 @@ - - - - The source code - - - - -
/** - * @class Ext.Element - */ -
/** - * Visibility mode constant for use with {@link #setVisibilityMode}. Use visibility to hide element - * @static - * @type Number - */ -Ext.Element.VISIBILITY = 1; -
/** - * Visibility mode constant for use with {@link #setVisibilityMode}. Use display to hide element - * @static - * @type Number - */ -Ext.Element.DISPLAY = 2; - -Ext.Element.addMethods(function(){ - var VISIBILITY = "visibility", - DISPLAY = "display", - HIDDEN = "hidden", - NONE = "none", - ORIGINALDISPLAY = 'originalDisplay', - VISMODE = 'visibilityMode', - ELDISPLAY = Ext.Element.DISPLAY, - data = Ext.Element.data, - getDisplay = function(dom){ - var d = data(dom, ORIGINALDISPLAY); - if(d === undefined){ - data(dom, ORIGINALDISPLAY, d = ''); - } - return d; - }, - getVisMode = function(dom){ - var m = data(dom, VISMODE); - if(m === undefined){ - data(dom, VISMODE, m = 1) - } - return m; - }; - - return { -
/** - * The element's default display mode (defaults to "") - * @type String - */ - originalDisplay : "", - visibilityMode : 1, - -
/** - * Sets the element's visibility mode. When setVisible() is called it - * will use this to determine whether to set the visibility or the display property. - * @param {Number} visMode Ext.Element.VISIBILITY or Ext.Element.DISPLAY - * @return {Ext.Element} this - */ - setVisibilityMode : function(visMode){ - data(this.dom, VISMODE, visMode); - return this; - }, - -
/** - * Perform custom 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) {@link Ext.Fx#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 me = this, - anim = Ext.lib.Anim[animType]( - me.dom, - args, - (opt.duration || defaultDur) || .35, - (opt.easing || defaultEase) || 'easeOut', - function(){ - if(cb) cb.call(me); - if(opt.callback) opt.callback.call(opt.scope || me, me, opt); - }, - me - ); - opt.anim = anim; - return anim; - }, - - // 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]}); - }, - -
/** - * Checks whether the element is currently visible using both visibility and display properties. - * @return {Boolean} True if the element is currently visible, else false - */ - isVisible : function() { - return !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE); - }, - -
/** - * 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){ - var me = this, - dom = me.dom, - isDisplay = getVisMode(this.dom) == ELDISPLAY; - - if (!animate || !me.anim) { - if(isDisplay){ - me.setDisplayed(visible); - }else{ - me.fixDisplay(); - dom.style.visibility = visible ? "visible" : HIDDEN; - } - }else{ - // closure for composites - if(visible){ - me.setOpacity(.01); - me.setVisible(true); - } - me.anim({opacity: { to: (visible?1:0) }}, - me.preanim(arguments, 1), - null, - .35, - 'easeIn', - function(){ - if(!visible){ - dom.style[isDisplay ? DISPLAY : VISIBILITY] = (isDisplay) ? NONE : HIDDEN; - Ext.fly(dom).setOpacity(1); - } - }); - } - return me; - }, - -
/** - * 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 - * @return {Ext.Element} this - */ - toggle : function(animate){ - var me = this; - me.setVisible(!me.isVisible(), me.preanim(arguments, 0)); - return me; - }, - -
/** - * Sets the CSS display property. Uses originalDisplay if the specified value is a boolean true. - * @param {Mixed} value Boolean value to display the element using its default display, or a string to set the display directly. - * @return {Ext.Element} this - */ - setDisplayed : function(value) { - if(typeof value == "boolean"){ - value = value ? getDisplay(this.dom) : NONE; - } - this.setStyle(DISPLAY, value); - return this; - }, - - // private - fixDisplay : function(){ - var me = this; - if(me.isStyle(DISPLAY, NONE)){ - me.setStyle(VISIBILITY, HIDDEN); - me.setStyle(DISPLAY, getDisplay(this.dom)); // first try reverting to default - if(me.isStyle(DISPLAY, NONE)){ // if that fails, default to block - me.setStyle(DISPLAY, "block"); - } - } - }, - -
/** - * Hide this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}. - * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object - * @return {Ext.Element} this - */ - hide : function(animate){ - this.setVisible(false, this.preanim(arguments, 0)); - return this; - }, - -
/** - * Show this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}. - * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object - * @return {Ext.Element} this - */ - show : function(animate){ - this.setVisible(true, this.preanim(arguments, 0)); - return this; - } - } -}());
- + + + + The source code + + + + +
/*!
+ * Ext JS Library 3.2.2
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+
/** + * Visibility mode constant for use with {@link #setVisibilityMode}. Use visibility to hide element + * @static + * @type Number + */ +Ext.Element.VISIBILITY = 1; +
/** + * Visibility mode constant for use with {@link #setVisibilityMode}. Use display to hide element + * @static + * @type Number + */ +Ext.Element.DISPLAY = 2; + +Ext.Element.addMethods(function(){ + var VISIBILITY = "visibility", + DISPLAY = "display", + HIDDEN = "hidden", + OFFSETS = "offsets", + NONE = "none", + ORIGINALDISPLAY = 'originalDisplay', + VISMODE = 'visibilityMode', + ELDISPLAY = Ext.Element.DISPLAY, + data = Ext.Element.data, + getDisplay = function(dom){ + var d = data(dom, ORIGINALDISPLAY); + if(d === undefined){ + data(dom, ORIGINALDISPLAY, d = ''); + } + return d; + }, + getVisMode = function(dom){ + var m = data(dom, VISMODE); + if(m === undefined){ + data(dom, VISMODE, m = 1); + } + return m; + }; + + return { +
/** + * The element's default display mode (defaults to "") + * @type String + */ + originalDisplay : "", + visibilityMode : 1, + +
/** + * Sets the element's visibility mode. When setVisible() is called it + * will use this to determine whether to set the visibility or the display property. + * @param {Number} visMode Ext.Element.VISIBILITY or Ext.Element.DISPLAY + * @return {Ext.Element} this + */ + setVisibilityMode : function(visMode){ + data(this.dom, VISMODE, visMode); + return this; + }, + +
/** + * Perform custom 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) {@link Ext.Fx#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 me = this, + anim = Ext.lib.Anim[animType]( + me.dom, + args, + (opt.duration || defaultDur) || .35, + (opt.easing || defaultEase) || 'easeOut', + function(){ + if(cb) cb.call(me); + if(opt.callback) opt.callback.call(opt.scope || me, me, opt); + }, + me + ); + 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]}); + }, + +
/** + * Checks whether the element is currently visible using both visibility and display properties. + * @return {Boolean} True if the element is currently visible, else false + */ + isVisible : function() { + return !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE); + }, + +
/** + * 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){ + var me = this, isDisplay, isVisible, isOffsets, + dom = me.dom; + + // hideMode string override + if (typeof animate == 'string'){ + isDisplay = animate == DISPLAY; + isVisible = animate == VISIBILITY; + isOffsets = animate == OFFSETS; + animate = false; + } else { + isDisplay = getVisMode(this.dom) == ELDISPLAY; + isVisible = !isDisplay; + } + + if (!animate || !me.anim) { + if (isDisplay){ + me.setDisplayed(visible); + } else if (isOffsets){ + 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: ''}); + } + }else{ + me.fixDisplay(); + dom.style.visibility = visible ? "visible" : HIDDEN; + } + }else{ + // closure for composites + if (visible){ + me.setOpacity(.01); + me.setVisible(true); + } + me.anim({opacity: { to: (visible?1:0) }}, + me.preanim(arguments, 1), + null, + .35, + 'easeIn', + function(){ + if(!visible){ + dom.style[isDisplay ? DISPLAY : VISIBILITY] = (isDisplay) ? NONE : HIDDEN; + Ext.fly(dom).setOpacity(1); + } + }); + } + return me; + }, + +
/** + * 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 + * @return {Ext.Element} this + */ + toggle : function(animate){ + var me = this; + me.setVisible(!me.isVisible(), me.preanim(arguments, 0)); + return me; + }, + +
/** + * Sets the CSS display property. Uses originalDisplay if the specified value is a boolean true. + * @param {Mixed} value Boolean value to display the element using its default display, or a string to set the display directly. + * @return {Ext.Element} this + */ + setDisplayed : function(value) { + if(typeof value == "boolean"){ + value = value ? getDisplay(this.dom) : NONE; + } + this.setStyle(DISPLAY, value); + return this; + }, + + // private + fixDisplay : function(){ + var me = this; + if(me.isStyle(DISPLAY, NONE)){ + me.setStyle(VISIBILITY, HIDDEN); + me.setStyle(DISPLAY, getDisplay(this.dom)); // first try reverting to default + if(me.isStyle(DISPLAY, NONE)){ // if that fails, default to block + me.setStyle(DISPLAY, "block"); + } + } + }, + +
/** + * Hide this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}. + * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object + * @return {Ext.Element} this + */ + hide : function(animate){ + // hideMode override + if (typeof animate == 'string'){ + this.setVisible(false, animate); + return this; + } + this.setVisible(false, this.preanim(arguments, 0)); + return this; + }, + +
/** + * Show this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}. + * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object + * @return {Ext.Element} this + */ + show : function(animate){ + // hideMode override + if (typeof animate == 'string'){ + this.setVisible(true, animate); + return this; + } + this.setVisible(true, this.preanim(arguments, 0)); + return this; + } + }; +}()); +
+ \ No newline at end of file