X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/src/core/src/dom/Element.static.js?ds=sidebyside diff --git a/src/core/src/dom/Element.static.js b/src/core/src/dom/Element.static.js new file mode 100644 index 00000000..1f18cfb1 --- /dev/null +++ b/src/core/src/dom/Element.static.js @@ -0,0 +1,206 @@ +/** + * @class Ext.core.Element + */ +Ext.applyIf(Ext.core.Element, { + unitRe: /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i, + camelRe: /(-[a-z])/gi, + opacityRe: /alpha\(opacity=(.*)\)/i, + cssRe: /([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi, + propertyCache: {}, + defaultUnit : "px", + 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'}, + + // Reference the prototype's version of the method. Signatures are identical. + addUnits : Ext.core.Element.prototype.addUnits, + + /** + * Parses a number or string representing margin sizes into an object. Supports CSS-style margin declarations + * (e.g. 10, "10", "10 10", "10 10 10" and "10 10 10 10" are all valid options and would return the same result) + * @static + * @param {Number|String} box The encoded margins + * @return {Object} An object with margin sizes for top, right, bottom and left + */ + parseBox : function(box) { + if (Ext.isObject(box)) { + return { + top: box.top || 0, + right: box.right || 0, + bottom: box.bottom || 0, + left: box.left || 0 + }; + } else { + if (typeof box != 'string') { + box = box.toString(); + } + var parts = box.split(' '), + ln = parts.length; + + if (ln == 1) { + parts[1] = parts[2] = parts[3] = parts[0]; + } + else if (ln == 2) { + parts[2] = parts[0]; + parts[3] = parts[1]; + } + else if (ln == 3) { + parts[3] = parts[1]; + } + + return { + top :parseFloat(parts[0]) || 0, + right :parseFloat(parts[1]) || 0, + bottom:parseFloat(parts[2]) || 0, + left :parseFloat(parts[3]) || 0 + }; + } + + }, + + /** + * Parses a number or string representing margin sizes into an object. Supports CSS-style margin declarations + * (e.g. 10, "10", "10 10", "10 10 10" and "10 10 10 10" are all valid options and would return the same result) + * @static + * @param {Number|String} box The encoded margins + * @param {String} units The type of units to add + * @return {String} An string with unitized (px if units is not specified) metrics for top, right, bottom and left + */ + unitizeBox : function(box, units) { + var A = this.addUnits, + B = this.parseBox(box); + + return A(B.top, units) + ' ' + + A(B.right, units) + ' ' + + A(B.bottom, units) + ' ' + + A(B.left, units); + + }, + + // private + camelReplaceFn : function(m, a) { + return a.charAt(1).toUpperCase(); + }, + + /** + * Normalizes CSS property keys from dash delimited to camel case JavaScript Syntax. + * For example: + *
+ * The sample code below would return an object with 2 properties, one + * for background-color and one for color.
+ *
+var css = 'background-color: red;color: blue; ';
+console.log(Ext.core.Element.parseStyles(css));
+ *
+ * @static
+ * @param {String} styles A CSS string
+ * @return {Object} styles
+ */
+ parseStyles: function(styles){
+ var out = {},
+ cssRe = this.cssRe,
+ matches;
+
+ if (styles) {
+ // Since we're using the g flag on the regex, we need to set the lastIndex.
+ // This automatically happens on some implementations, but not others, see:
+ // http://stackoverflow.com/questions/2645273/javascript-regular-expression-literal-persists-between-function-calls
+ // http://blog.stevenlevithan.com/archives/fixing-javascript-regexp
+ cssRe.lastIndex = 0;
+ while ((matches = cssRe.exec(styles))) {
+ out[matches[1]] = matches[2];
+ }
+ }
+ return out;
+ }
+});