-<html>\r
-<head>\r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js">/**\r
- * @class Ext.Element\r
- */\r
-Ext.Element.addMethods(function(){ \r
- // local style camelizing for speed\r
- var propCache = {},\r
- camelRe = /(-[a-z])/gi,\r
- classReCache = {},\r
- view = document.defaultView,\r
- propFloat = Ext.isIE ? 'styleFloat' : 'cssFloat',\r
- opacityRe = /alpha\(opacity=(.*)\)/i,\r
- trimRe = /^\s+|\s+$/g,\r
- EL = Ext.Element, \r
- PADDING = "padding",\r
- MARGIN = "margin",\r
- BORDER = "border",\r
- LEFT = "-left",\r
- RIGHT = "-right",\r
- TOP = "-top",\r
- BOTTOM = "-bottom",\r
- WIDTH = "-width", \r
- MATH = Math,\r
- HIDDEN = 'hidden',\r
- ISCLIPPED = 'isClipped',\r
- OVERFLOW = 'overflow',\r
- OVERFLOWX = 'overflow-x',\r
- OVERFLOWY = 'overflow-y',\r
- ORIGINALCLIP = 'originalClip',\r
- // special markup used throughout Ext when box wrapping elements \r
- borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},\r
- paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},\r
- margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},\r
- data = Ext.Element.data;\r
- \r
- \r
- // private \r
- function camelFn(m, a) {\r
- return a.charAt(1).toUpperCase();\r
- }\r
- \r
- // private (needs to be called => addStyles.call(this, sides, styles))\r
- function addStyles(sides, styles){\r
- var val = 0; \r
- \r
- Ext.each(sides.match(/\w/g), function(s) {\r
- if (s = parseInt(this.getStyle(styles[s]), 10)) {\r
- val += MATH.abs(s); \r
- }\r
- },\r
- this);\r
- return val;\r
- }\r
-\r
- function chkCache(prop) {\r
- return propCache[prop] || (propCache[prop] = prop == 'float' ? propFloat : prop.replace(camelRe, camelFn));\r
-\r
- }\r
- \r
- return { \r
- // private ==> used by Fx \r
- adjustWidth : function(width) {\r
- var me = this;\r
- var isNum = (typeof width == "number");\r
- if(isNum && me.autoBoxAdjust && !me.isBorderBox()){\r
- width -= (me.getBorderWidth("lr") + me.getPadding("lr"));\r
- }\r
- return (isNum && width < 0) ? 0 : width;\r
- },\r
- \r
- // private ==> used by Fx \r
- adjustHeight : function(height) {\r
- var me = this;\r
- var isNum = (typeof height == "number");\r
- if(isNum && me.autoBoxAdjust && !me.isBorderBox()){\r
- height -= (me.getBorderWidth("tb") + me.getPadding("tb")); \r
- }\r
- return (isNum && height < 0) ? 0 : height;\r
- },\r
- \r
- \r
- <div id="method-Ext.Element-addClass"></div>/**\r
- * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.\r
- * @param {String/Array} className The CSS class to add, or an array of classes\r
- * @return {Ext.Element} this\r
- */\r
- addClass : function(className){\r
- var me = this;\r
- Ext.each(className, function(v) {\r
- me.dom.className += (!me.hasClass(v) && v ? " " + v : ""); \r
- });\r
- return me;\r
- },\r
- \r
- <div id="method-Ext.Element-radioClass"></div>/**\r
- * Adds one or more CSS classes to this element and removes the same class(es) from all siblings.\r
- * @param {String/Array} className The CSS class to add, or an array of classes\r
- * @return {Ext.Element} this\r
- */\r
- radioClass : function(className){\r
- Ext.each(this.dom.parentNode.childNodes, function(v) {\r
- if(v.nodeType == 1) {\r
- Ext.fly(v, '_internal').removeClass(className); \r
- }\r
- });\r
- return this.addClass(className);\r
- },\r
- \r
- <div id="method-Ext.Element-removeClass"></div>/**\r
- * Removes one or more CSS classes from the element.\r
- * @param {String/Array} className The CSS class to remove, or an array of classes\r
- * @return {Ext.Element} this\r
- */\r
- removeClass : function(className){\r
- var me = this;\r
- if (me.dom.className) {\r
- Ext.each(className, function(v) { \r
- me.dom.className = me.dom.className.replace(\r
- classReCache[v] = classReCache[v] || new RegExp('(?:^|\\s+)' + v + '(?:\\s+|$)', "g"), \r
- " "); \r
- }); \r
- }\r
- return me;\r
- },\r
- \r
- <div id="method-Ext.Element-toggleClass"></div>/**\r
- * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it).\r
- * @param {String} className The CSS class to toggle\r
- * @return {Ext.Element} this\r
- */\r
- toggleClass : function(className){\r
- return this.hasClass(className) ? this.removeClass(className) : this.addClass(className);\r
- },\r
- \r
- <div id="method-Ext.Element-hasClass"></div>/**\r
- * Checks if the specified CSS class exists on this element's DOM node.\r
- * @param {String} className The CSS class to check for\r
- * @return {Boolean} True if the class exists, else false\r
- */\r
- hasClass : function(className){\r
- return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1;\r
- },\r
- \r
- <div id="method-Ext.Element-replaceClass"></div>/**\r
- * Replaces a CSS class on the element with another. If the old name does not exist, the new name will simply be added.\r
- * @param {String} oldClassName The CSS class to replace\r
- * @param {String} newClassName The replacement CSS class\r
- * @return {Ext.Element} this\r
- */\r
- replaceClass : function(oldClassName, newClassName){\r
- return this.removeClass(oldClassName).addClass(newClassName);\r
- },\r
- \r
- isStyle : function(style, val) {\r
- return this.getStyle(style) == val; \r
- },\r
- \r
- <div id="method-Ext.Element-getStyle"></div>/**\r
- * Normalizes currentStyle and computedStyle.\r
- * @param {String} property The style property whose value is returned.\r
- * @return {String} The current value of the style property for this element.\r
- */\r
- getStyle : function(){ \r
- return view && view.getComputedStyle ?\r
- function(prop){\r
- var el = this.dom,\r
- v, \r
- cs;\r
- if(el == document) return null;\r
- prop = chkCache(prop);\r
- return (v = el.style[prop]) ? v : \r
- (cs = view.getComputedStyle(el, "")) ? cs[prop] : null;\r
- } :\r
- function(prop){ \r
- var el = this.dom, \r
- m, \r
- cs; \r
- \r
- if(el == document) return null; \r
- if (prop == 'opacity') {\r
- if (el.style.filter.match) { \r
- if(m = el.style.filter.match(opacityRe)){\r
- var fv = parseFloat(m[1]);\r
- if(!isNaN(fv)){\r
- return fv ? fv / 100 : 0;\r
- }\r
- }\r
- }\r
- return 1;\r
- }\r
- prop = chkCache(prop); \r
- return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null);\r
- };\r
- }(),\r
- \r
- <div id="method-Ext.Element-getColor"></div>/**\r
- * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values\r
- * are convert to standard 6 digit hex color.\r
- * @param {String} attr The css attribute\r
- * @param {String} defaultValue The default value to use when a valid color isn't found\r
- * @param {String} prefix (optional) defaults to #. Use an empty string when working with\r
- * color anims.\r
- */\r
- getColor : function(attr, defaultValue, prefix){\r
- var v = this.getStyle(attr),\r
- color = prefix || '#',\r
- h;\r
- \r
- if(!v || /transparent|inherit/.test(v)){\r
- return defaultValue;\r
- }\r
- if(/^r/.test(v)){\r
- Ext.each(v.slice(4, v.length -1).split(','), function(s){\r
- h = parseInt(s, 10);\r
- color += (h < 16 ? '0' : '') + h.toString(16); \r
- });\r
- }else{\r
- v = v.replace('#', '');\r
- color += v.length == 3 ? v.replace(/^(\w)(\w)(\w)$/, '$1$1$2$2$3$3') : v;\r
- }\r
- return(color.length > 5 ? color.toLowerCase() : defaultValue);\r
- },\r
- \r
- <div id="method-Ext.Element-setStyle"></div>/**\r
- * Wrapper for setting style properties, also takes single object parameter of multiple styles.\r
- * @param {String/Object} property The style property to be set, or an object of multiple styles.\r
- * @param {String} value (optional) The value to apply to the given property, or null if an object was passed.\r
- * @return {Ext.Element} this\r
- */\r
- setStyle : function(prop, value){\r
- var tmp, \r
- style,\r
- camel;\r
- if (!Ext.isObject(prop)) {\r
- tmp = {};\r
- tmp[prop] = value; \r
- prop = tmp;\r
- }\r
- for (style in prop) {\r
- value = prop[style]; \r
- style == 'opacity' ? \r
- this.setOpacity(value) : \r
- this.dom.style[chkCache(style)] = value;\r
- }\r
- return this;\r
- },\r
- \r
- <div id="method-Ext.Element-setOpacity"></div>/**\r
- * Set the opacity of the element\r
- * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc\r
- * @param {Boolean/Object} animate (optional) a standard Element animation config object or <tt>true</tt> for\r
- * the default animation (<tt>{duration: .35, easing: 'easeIn'}</tt>)\r
- * @return {Ext.Element} this\r
- */\r
- setOpacity : function(opacity, animate){\r
- var me = this,\r
- s = me.dom.style;\r
- \r
- if(!animate || !me.anim){ \r
- if(Ext.isIE){\r
- var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '', \r
- val = s.filter.replace(opacityRe, '').replace(trimRe, '');\r
-\r
- s.zoom = 1;\r
- s.filter = val + (val.length > 0 ? ' ' : '') + opac;\r
- }else{\r
- s.opacity = opacity;\r
- }\r
- }else{\r
- me.anim({opacity: {to: opacity}}, me.preanim(arguments, 1), null, .35, 'easeIn');\r
- }\r
- return me;\r
- },\r
- \r
- <div id="method-Ext.Element-clearOpacity"></div>/**\r
- * Clears any opacity settings from this element. Required in some cases for IE.\r
- * @return {Ext.Element} this\r
- */\r
- clearOpacity : function(){\r
- var style = this.dom.style;\r
- if(Ext.isIE){\r
- if(!Ext.isEmpty(style.filter)){\r
- style.filter = style.filter.replace(opacityRe, '').replace(trimRe, '');\r
- }\r
- }else{\r
- style.opacity = style['-moz-opacity'] = style['-khtml-opacity'] = '';\r
- }\r
- return this;\r
- },\r
- \r
- <div id="method-Ext.Element-getHeight"></div>/**\r
- * Returns the offset height of the element\r
- * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding\r
- * @return {Number} The element's height\r
- */\r
- getHeight : function(contentHeight){\r
- var me = this,\r
- dom = me.dom,\r
- h = MATH.max(dom.offsetHeight, dom.clientHeight) || 0;\r
- h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb");\r
- return h < 0 ? 0 : h;\r
- },\r
- \r
- <div id="method-Ext.Element-getWidth"></div>/**\r
- * Returns the offset width of the element\r
- * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding\r
- * @return {Number} The element's width\r
- */\r
- getWidth : function(contentWidth){\r
- var me = this,\r
- dom = me.dom,\r
- w = MATH.max(dom.offsetWidth, dom.clientWidth) || 0;\r
- w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr");\r
- return w < 0 ? 0 : w;\r
- },\r
- \r
- <div id="method-Ext.Element-setWidth"></div>/**\r
- * Set the width of this Element.\r
- * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>\r
- * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>\r
- * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.\r
- * </ul></div>\r
- * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object\r
- * @return {Ext.Element} this\r
- */\r
- setWidth : function(width, animate){\r
- var me = this;\r
- width = me.adjustWidth(width);\r
- !animate || !me.anim ? \r
- me.dom.style.width = me.addUnits(width) :\r
- me.anim({width : {to : width}}, me.preanim(arguments, 1));\r
- return me;\r
- },\r
- \r
- <div id="method-Ext.Element-setHeight"></div>/**\r
- * Set the height of this Element.\r
- * <pre><code>\r
-// change the height to 200px and animate with default configuration\r
-Ext.fly('elementId').setHeight(200, true);\r
-\r
-// change the height to 150px and animate with a custom configuration\r
-Ext.fly('elId').setHeight(150, {\r
- duration : .5, // animation will have a duration of .5 seconds\r
- // will change the content to "finished"\r
- callback: function(){ this.{@link #update}("finished"); } \r
-});\r
- * </code></pre>\r
- * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>\r
- * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels.)</li>\r
- * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>\r
- * </ul></div>\r
- * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object\r
- * @return {Ext.Element} this\r
- */\r
- setHeight : function(height, animate){\r
- var me = this;\r
- height = me.adjustHeight(height);\r
- !animate || !me.anim ? \r
- me.dom.style.height = me.addUnits(height) :\r
- me.anim({height : {to : height}}, me.preanim(arguments, 1));\r
- return me;\r
- },\r
- \r
- <div id="method-Ext.Element-getBorderWidth"></div>/**\r
- * Gets the width of the border(s) for the specified side(s)\r
- * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,\r
- * passing <tt>'lr'</tt> would get the border <b><u>l</u></b>eft width + the border <b><u>r</u></b>ight width.\r
- * @return {Number} The width of the sides passed added together\r
- */\r
- getBorderWidth : function(side){\r
- return addStyles.call(this, side, borders);\r
- },\r
- \r
- <div id="method-Ext.Element-getPadding"></div>/**\r
- * Gets the width of the padding(s) for the specified side(s)\r
- * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,\r
- * passing <tt>'lr'</tt> would get the padding <b><u>l</u></b>eft + the padding <b><u>r</u></b>ight.\r
- * @return {Number} The padding of the sides passed added together\r
- */\r
- getPadding : function(side){\r
- return addStyles.call(this, side, paddings);\r
- },\r
- \r
- <div id="method-Ext.Element-clip"></div>/**\r
- * Store the current overflow setting and clip overflow on the element - use <tt>{@link #unclip}</tt> to remove\r
- * @return {Ext.Element} this\r
- */\r
- clip : function(){\r
- var me = this,\r
- dom = me.dom;\r
- \r
- if(!data(dom, ISCLIPPED)){\r
- data(dom, ISCLIPPED, true);\r
- data(dom, ORIGINALCLIP, {\r
- o: me.getStyle(OVERFLOW),\r
- x: me.getStyle(OVERFLOWX),\r
- y: me.getStyle(OVERFLOWY)\r
- });\r
- me.setStyle(OVERFLOW, HIDDEN);\r
- me.setStyle(OVERFLOWX, HIDDEN);\r
- me.setStyle(OVERFLOWY, HIDDEN);\r
- }\r
- return me;\r
- },\r
- \r
- <div id="method-Ext.Element-unclip"></div>/**\r
- * Return clipping (overflow) to original clipping before <tt>{@link #clip}</tt> was called\r
- * @return {Ext.Element} this\r
- */\r
- unclip : function(){\r
- var me = this,\r
- dom = me.dom;\r
- \r
- if(data(dom, ISCLIPPED)){\r
- data(dom, ISCLIPPED, false);\r
- var o = data(dom, ORIGINALCLIP);\r
- if(o.o){\r
- me.setStyle(OVERFLOW, o.o);\r
- }\r
- if(o.x){\r
- me.setStyle(OVERFLOWX, o.x);\r
- }\r
- if(o.y){\r
- me.setStyle(OVERFLOWY, o.y);\r
- }\r
- }\r
- return me;\r
- },\r
- \r
- addStyles : addStyles,\r
- margins : margins\r
- }\r
-}() \r
-);</pre> \r
-</body>\r
+<html>
+<head>
+ <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>
+</head>
+<body onload="prettyPrint();">
+ <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.0.3
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+ // local style camelizing for speed
+ var propCache = {},
+ camelRe = /(-[a-z])/gi,
+ classReCache = {},
+ view = document.defaultView,
+ propFloat = Ext.isIE ? 'styleFloat' : 'cssFloat',
+ opacityRe = /alpha\(opacity=(.*)\)/i,
+ trimRe = /^\s+|\s+$/g,
+ EL = Ext.Element,
+ PADDING = "padding",
+ MARGIN = "margin",
+ BORDER = "border",
+ LEFT = "-left",
+ RIGHT = "-right",
+ TOP = "-top",
+ BOTTOM = "-bottom",
+ WIDTH = "-width",
+ MATH = Math,
+ HIDDEN = 'hidden',
+ ISCLIPPED = 'isClipped',
+ OVERFLOW = 'overflow',
+ OVERFLOWX = 'overflow-x',
+ OVERFLOWY = 'overflow-y',
+ ORIGINALCLIP = 'originalClip',
+ // special markup used throughout Ext when box wrapping elements
+ borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},
+ paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},
+ margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},
+ data = Ext.Element.data;
+
+
+ // private
+ function camelFn(m, a) {
+ return a.charAt(1).toUpperCase();
+ }
+
+ function chkCache(prop) {
+ return propCache[prop] || (propCache[prop] = prop == 'float' ? propFloat : prop.replace(camelRe, camelFn));
+ }
+
+ return {
+ // private ==> used by Fx
+ adjustWidth : function(width) {
+ var me = this;
+ var isNum = Ext.isNumber(width);
+ if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+ width -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+ }
+ return (isNum && width < 0) ? 0 : width;
+ },
+
+ // private ==> used by Fx
+ adjustHeight : function(height) {
+ var me = this;
+ var isNum = Ext.isNumber(height);
+ if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+ height -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+ }
+ return (isNum && height < 0) ? 0 : height;
+ },
+
+
+ <div id="method-Ext.Element-addClass"></div>/**
+ * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.
+ * @param {String/Array} className The CSS class to add, or an array of classes
+ * @return {Ext.Element} this
+ */
+ addClass : function(className){
+ var me = this;
+ Ext.each(className, function(v) {
+ me.dom.className += (!me.hasClass(v) && v ? " " + v : "");
+ });
+ return me;
+ },
+
+ <div id="method-Ext.Element-radioClass"></div>/**
+ * Adds one or more CSS classes to this element and removes the same class(es) from all siblings.
+ * @param {String/Array} className The CSS class to add, or an array of classes
+ * @return {Ext.Element} this
+ */
+ radioClass : function(className){
+ Ext.each(this.dom.parentNode.childNodes, function(v) {
+ if(v.nodeType == 1) {
+ Ext.fly(v, '_internal').removeClass(className);
+ }
+ });
+ return this.addClass(className);
+ },
+
+ <div id="method-Ext.Element-removeClass"></div>/**
+ * Removes one or more CSS classes from the element.
+ * @param {String/Array} className The CSS class to remove, or an array of classes
+ * @return {Ext.Element} this
+ */
+ removeClass : function(className){
+ var me = this;
+ if (me.dom && me.dom.className) {
+ Ext.each(className, function(v) {
+ me.dom.className = me.dom.className.replace(
+ classReCache[v] = classReCache[v] || new RegExp('(?:^|\\s+)' + v + '(?:\\s+|$)', "g"),
+ " ");
+ });
+ }
+ return me;
+ },
+
+ <div id="method-Ext.Element-toggleClass"></div>/**
+ * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it).
+ * @param {String} className The CSS class to toggle
+ * @return {Ext.Element} this
+ */
+ toggleClass : function(className){
+ return this.hasClass(className) ? this.removeClass(className) : this.addClass(className);
+ },
+
+ <div id="method-Ext.Element-hasClass"></div>/**
+ * Checks if the specified CSS class exists on this element's DOM node.
+ * @param {String} className The CSS class to check for
+ * @return {Boolean} True if the class exists, else false
+ */
+ hasClass : function(className){
+ return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1;
+ },
+
+ <div id="method-Ext.Element-replaceClass"></div>/**
+ * Replaces a CSS class on the element with another. If the old name does not exist, the new name will simply be added.
+ * @param {String} oldClassName The CSS class to replace
+ * @param {String} newClassName The replacement CSS class
+ * @return {Ext.Element} this
+ */
+ replaceClass : function(oldClassName, newClassName){
+ return this.removeClass(oldClassName).addClass(newClassName);
+ },
+
+ isStyle : function(style, val) {
+ return this.getStyle(style) == val;
+ },
+
+ <div id="method-Ext.Element-getStyle"></div>/**
+ * Normalizes currentStyle and computedStyle.
+ * @param {String} property The style property whose value is returned.
+ * @return {String} The current value of the style property for this element.
+ */
+ getStyle : function(){
+ return view && view.getComputedStyle ?
+ function(prop){
+ var el = this.dom,
+ v,
+ cs,
+ out;
+ if(el == document) return null;
+ prop = chkCache(prop);
+ out = (v = el.style[prop]) ? v :
+ (cs = view.getComputedStyle(el, "")) ? cs[prop] : null;
+
+ // Webkit returns rgb values for transparent.
+ if(Ext.isWebKit && out == 'rgba(0, 0, 0, 0)'){
+ out = 'transparent';
+ }
+ return out;
+ } :
+ function(prop){
+ var el = this.dom,
+ m,
+ cs;
+
+ if(el == document) return null;
+ if (prop == 'opacity') {
+ if (el.style.filter.match) {
+ if(m = el.style.filter.match(opacityRe)){
+ var fv = parseFloat(m[1]);
+ if(!isNaN(fv)){
+ return fv ? fv / 100 : 0;
+ }
+ }
+ }
+ return 1;
+ }
+ prop = chkCache(prop);
+ return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null);
+ };
+ }(),
+
+ <div id="method-Ext.Element-getColor"></div>/**
+ * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values
+ * are convert to standard 6 digit hex color.
+ * @param {String} attr The css attribute
+ * @param {String} defaultValue The default value to use when a valid color isn't found
+ * @param {String} prefix (optional) defaults to #. Use an empty string when working with
+ * color anims.
+ */
+ getColor : function(attr, defaultValue, prefix){
+ var v = this.getStyle(attr),
+ color = Ext.isDefined(prefix) ? prefix : '#',
+ h;
+
+ if(!v || /transparent|inherit/.test(v)){
+ return defaultValue;
+ }
+ if(/^r/.test(v)){
+ Ext.each(v.slice(4, v.length -1).split(','), function(s){
+ h = parseInt(s, 10);
+ color += (h < 16 ? '0' : '') + h.toString(16);
+ });
+ }else{
+ v = v.replace('#', '');
+ color += v.length == 3 ? v.replace(/^(\w)(\w)(\w)$/, '$1$1$2$2$3$3') : v;
+ }
+ return(color.length > 5 ? color.toLowerCase() : defaultValue);
+ },
+
+ <div id="method-Ext.Element-setStyle"></div>/**
+ * Wrapper for setting style properties, also takes single object parameter of multiple styles.
+ * @param {String/Object} property The style property to be set, or an object of multiple styles.
+ * @param {String} value (optional) The value to apply to the given property, or null if an object was passed.
+ * @return {Ext.Element} this
+ */
+ setStyle : function(prop, value){
+ var tmp,
+ style,
+ camel;
+ if (!Ext.isObject(prop)) {
+ tmp = {};
+ tmp[prop] = value;
+ prop = tmp;
+ }
+ for (style in prop) {
+ value = prop[style];
+ style == 'opacity' ?
+ this.setOpacity(value) :
+ this.dom.style[chkCache(style)] = value;
+ }
+ return this;
+ },
+
+ <div id="method-Ext.Element-setOpacity"></div>/**
+ * Set the opacity of the element
+ * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc
+ * @param {Boolean/Object} animate (optional) a standard Element animation config object or <tt>true</tt> for
+ * the default animation (<tt>{duration: .35, easing: 'easeIn'}</tt>)
+ * @return {Ext.Element} this
+ */
+ setOpacity : function(opacity, animate){
+ var me = this,
+ s = me.dom.style;
+
+ if(!animate || !me.anim){
+ if(Ext.isIE){
+ var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '',
+ val = s.filter.replace(opacityRe, '').replace(trimRe, '');
+
+ s.zoom = 1;
+ s.filter = val + (val.length > 0 ? ' ' : '') + opac;
+ }else{
+ s.opacity = opacity;
+ }
+ }else{
+ me.anim({opacity: {to: opacity}}, me.preanim(arguments, 1), null, .35, 'easeIn');
+ }
+ return me;
+ },
+
+ <div id="method-Ext.Element-clearOpacity"></div>/**
+ * Clears any opacity settings from this element. Required in some cases for IE.
+ * @return {Ext.Element} this
+ */
+ clearOpacity : function(){
+ var style = this.dom.style;
+ if(Ext.isIE){
+ if(!Ext.isEmpty(style.filter)){
+ style.filter = style.filter.replace(opacityRe, '').replace(trimRe, '');
+ }
+ }else{
+ style.opacity = style['-moz-opacity'] = style['-khtml-opacity'] = '';
+ }
+ return this;
+ },
+
+ <div id="method-Ext.Element-getHeight"></div>/**
+ * Returns the offset height of the element
+ * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding
+ * @return {Number} The element's height
+ */
+ getHeight : function(contentHeight){
+ var me = this,
+ dom = me.dom,
+ hidden = Ext.isIE && me.isStyle('display', 'none'),
+ h = MATH.max(dom.offsetHeight, hidden ? 0 : dom.clientHeight) || 0;
+
+ h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb");
+ return h < 0 ? 0 : h;
+ },
+
+ <div id="method-Ext.Element-getWidth"></div>/**
+ * Returns the offset width of the element
+ * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding
+ * @return {Number} The element's width
+ */
+ getWidth : function(contentWidth){
+ var me = this,
+ dom = me.dom,
+ hidden = Ext.isIE && me.isStyle('display', 'none'),
+ w = MATH.max(dom.offsetWidth, hidden ? 0 : dom.clientWidth) || 0;
+ w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr");
+ return w < 0 ? 0 : w;
+ },
+
+ <div id="method-Ext.Element-setWidth"></div>/**
+ * Set the width of this Element.
+ * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+ * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+ * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+ * </ul></div>
+ * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+ * @return {Ext.Element} this
+ */
+ setWidth : function(width, animate){
+ var me = this;
+ width = me.adjustWidth(width);
+ !animate || !me.anim ?
+ me.dom.style.width = me.addUnits(width) :
+ me.anim({width : {to : width}}, me.preanim(arguments, 1));
+ return me;
+ },
+
+ <div id="method-Ext.Element-setHeight"></div>/**
+ * Set the height of this Element.
+ * <pre><code>
+// change the height to 200px and animate with default configuration
+Ext.fly('elementId').setHeight(200, true);
+
+// change the height to 150px and animate with a custom configuration
+Ext.fly('elId').setHeight(150, {
+ duration : .5, // animation will have a duration of .5 seconds
+ // will change the content to "finished"
+ callback: function(){ this.{@link #update}("finished"); }
+});
+ * </code></pre>
+ * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+ * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels.)</li>
+ * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+ * </ul></div>
+ * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+ * @return {Ext.Element} this
+ */
+ setHeight : function(height, animate){
+ var me = this;
+ height = me.adjustHeight(height);
+ !animate || !me.anim ?
+ me.dom.style.height = me.addUnits(height) :
+ me.anim({height : {to : height}}, me.preanim(arguments, 1));
+ return me;
+ },
+
+ <div id="method-Ext.Element-getBorderWidth"></div>/**
+ * Gets the width of the border(s) for the specified side(s)
+ * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+ * passing <tt>'lr'</tt> would get the border <b><u>l</u></b>eft width + the border <b><u>r</u></b>ight width.
+ * @return {Number} The width of the sides passed added together
+ */
+ getBorderWidth : function(side){
+ return this.addStyles(side, borders);
+ },
+
+ <div id="method-Ext.Element-getPadding"></div>/**
+ * Gets the width of the padding(s) for the specified side(s)
+ * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+ * passing <tt>'lr'</tt> would get the padding <b><u>l</u></b>eft + the padding <b><u>r</u></b>ight.
+ * @return {Number} The padding of the sides passed added together
+ */
+ getPadding : function(side){
+ return this.addStyles(side, paddings);
+ },
+
+ <div id="method-Ext.Element-clip"></div>/**
+ * Store the current overflow setting and clip overflow on the element - use <tt>{@link #unclip}</tt> to remove
+ * @return {Ext.Element} this
+ */
+ clip : function(){
+ var me = this,
+ dom = me.dom;
+
+ if(!data(dom, ISCLIPPED)){
+ data(dom, ISCLIPPED, true);
+ data(dom, ORIGINALCLIP, {
+ o: me.getStyle(OVERFLOW),
+ x: me.getStyle(OVERFLOWX),
+ y: me.getStyle(OVERFLOWY)
+ });
+ me.setStyle(OVERFLOW, HIDDEN);
+ me.setStyle(OVERFLOWX, HIDDEN);
+ me.setStyle(OVERFLOWY, HIDDEN);
+ }
+ return me;
+ },
+
+ <div id="method-Ext.Element-unclip"></div>/**
+ * Return clipping (overflow) to original clipping before <tt>{@link #clip}</tt> was called
+ * @return {Ext.Element} this
+ */
+ unclip : function(){
+ var me = this,
+ dom = me.dom;
+
+ if(data(dom, ISCLIPPED)){
+ data(dom, ISCLIPPED, false);
+ var o = data(dom, ORIGINALCLIP);
+ if(o.o){
+ me.setStyle(OVERFLOW, o.o);
+ }
+ if(o.x){
+ me.setStyle(OVERFLOWX, o.x);
+ }
+ if(o.y){
+ me.setStyle(OVERFLOWY, o.y);
+ }
+ }
+ return me;
+ },
+
+ // private
+ addStyles : function(sides, styles){
+ var val = 0;
+
+ Ext.each(sides.match(/\w/g), function(s) {
+ if (s = parseInt(this.getStyle(styles[s]), 10)) {
+ val += MATH.abs(s);
+ }
+ },
+ this);
+ return val;
+ },
+
+ margins : margins
+ }
+}()
+);
+</pre>
+</body>
</html>
\ No newline at end of file