123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <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>
- <style type="text/css">
- .highlight { display: block; background-color: #ddd; }
- </style>
- <script type="text/javascript">
- function highlight() {
- document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
- }
- </script>
- </head>
- <body onload="prettyPrint(); highlight();">
- <pre class="prettyprint lang-js"><span id='Ext-dom-AbstractElement'>/**
- </span> * @class Ext.dom.AbstractElement
- */
- Ext.dom.AbstractElement.addInheritableStatics({
- unitRe: /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,
- camelRe: /(-[a-z])/gi,
- cssRe: /([a-z0-9\-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,
- opacityRe: /alpha\(opacity=(.*)\)/i,
- 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'},
- <span id='Ext-dom-AbstractElement-static-method-addUnits'> /**
- </span> * Test if size has a unit, otherwise appends the passed unit string, or the default for this Element.
- * @param size {Object} The size to set
- * @param units {String} The units to append to a numeric size value
- * @private
- * @static
- */
- addUnits: function(size, units) {
- // Most common case first: Size is set to a number
- if (typeof size == 'number') {
- return size + (units || this.defaultUnit || 'px');
- }
- // Size set to a value which means "auto"
- if (size === "" || size == "auto" || size === undefined || size === null) {
- return size || '';
- }
- // Otherwise, warn if it's not a valid CSS measurement
- if (!this.unitRe.test(size)) {
- //<debug>
- if (Ext.isDefined(Ext.global.console)) {
- Ext.global.console.warn("Warning, size detected as NaN on Element.addUnits.");
- }
- //</debug>
- return size || '';
- }
- return size;
- },
- <span id='Ext-dom-AbstractElement-static-method-isAncestor'> /**
- </span> * @static
- * @private
- */
- isAncestor: function(p, c) {
- var ret = false;
- p = Ext.getDom(p);
- c = Ext.getDom(c);
- if (p && c) {
- if (p.contains) {
- return p.contains(c);
- } else if (p.compareDocumentPosition) {
- return !!(p.compareDocumentPosition(c) & 16);
- } else {
- while ((c = c.parentNode)) {
- ret = c == p || ret;
- }
- }
- }
- return ret;
- },
- <span id='Ext-dom-AbstractElement-static-method-parseBox'> /**
- </span> * 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 (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
- };
- },
- <span id='Ext-dom-AbstractElement-static-method-unitizeBox'> /**
- </span> * 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();
- },
- <span id='Ext-dom-AbstractElement-static-method-normalize'> /**
- </span> * Normalizes CSS property keys from dash delimited to camel case JavaScript Syntax.
- * For example:
- *
- * - border-width -> borderWidth
- * - padding-top -> paddingTop
- *
- * @static
- * @param {String} prop The property to normalize
- * @return {String} The normalized string
- */
- normalize: function(prop) {
- // TODO: Mobile optimization?
- if (prop == 'float') {
- prop = Ext.supports.Float ? 'cssFloat' : 'styleFloat';
- }
- return this.propertyCache[prop] || (this.propertyCache[prop] = prop.replace(this.camelRe, this.camelReplaceFn));
- },
- <span id='Ext-dom-AbstractElement-static-method-getDocumentHeight'> /**
- </span> * Retrieves the document height
- * @static
- * @return {Number} documentHeight
- */
- getDocumentHeight: function() {
- return Math.max(!Ext.isStrict ? document.body.scrollHeight : document.documentElement.scrollHeight, this.getViewportHeight());
- },
- <span id='Ext-dom-AbstractElement-static-method-getDocumentWidth'> /**
- </span> * Retrieves the document width
- * @static
- * @return {Number} documentWidth
- */
- getDocumentWidth: function() {
- return Math.max(!Ext.isStrict ? document.body.scrollWidth : document.documentElement.scrollWidth, this.getViewportWidth());
- },
- <span id='Ext-dom-AbstractElement-static-method-getViewportHeight'> /**
- </span> * Retrieves the viewport height of the window.
- * @static
- * @return {Number} viewportHeight
- */
- getViewportHeight: function(){
- return window.innerHeight;
- },
- <span id='Ext-dom-AbstractElement-static-method-getViewportWidth'> /**
- </span> * Retrieves the viewport width of the window.
- * @static
- * @return {Number} viewportWidth
- */
- getViewportWidth: function() {
- return window.innerWidth;
- },
- <span id='Ext-dom-AbstractElement-static-method-getViewSize'> /**
- </span> * Retrieves the viewport size of the window.
- * @static
- * @return {Object} object containing width and height properties
- */
- getViewSize: function() {
- return {
- width: window.innerWidth,
- height: window.innerHeight
- };
- },
- <span id='Ext-dom-AbstractElement-static-method-getOrientation'> /**
- </span> * Retrieves the current orientation of the window. This is calculated by
- * determing if the height is greater than the width.
- * @static
- * @return {String} Orientation of window: 'portrait' or 'landscape'
- */
- getOrientation: function() {
- if (Ext.supports.OrientationChange) {
- return (window.orientation == 0) ? 'portrait' : 'landscape';
- }
- return (window.innerHeight > window.innerWidth) ? 'portrait' : 'landscape';
- },
- <span id='Ext-dom-AbstractElement-static-method-fromPoint'> /**
- </span> * Returns the top Element that is located at the passed coordinates
- * @static
- * @param {Number} x The x coordinate
- * @param {Number} y The y coordinate
- * @return {String} The found Element
- */
- fromPoint: function(x, y) {
- return Ext.get(document.elementFromPoint(x, y));
- },
- <span id='Ext-dom-AbstractElement-static-method-parseStyles'> /**
- </span> * Converts a CSS string into an object with a property for each style.
- *
- * 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.dom.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;
- }
- });
- //TODO Need serious cleanups
- (function(){
- var doc = document,
- AbstractElement = Ext.dom.AbstractElement,
- activeElement = null,
- isCSS1 = doc.compatMode == "CSS1Compat",
- flyInstance,
- fly = function (el) {
- if (!flyInstance) {
- flyInstance = new AbstractElement.Fly();
- }
- flyInstance.attach(el);
- return flyInstance;
- };
- // If the browser does not support document.activeElement we need some assistance.
- // This covers old Safari 3.2 (4.0 added activeElement along with just about all
- // other browsers). We need this support to handle issues with old Safari.
- if (!('activeElement' in doc) && doc.addEventListener) {
- doc.addEventListener('focus',
- function (ev) {
- if (ev && ev.target) {
- activeElement = (ev.target == doc) ? null : ev.target;
- }
- }, true);
- }
- /*
- * Helper function to create the function that will restore the selection.
- */
- function makeSelectionRestoreFn (activeEl, start, end) {
- return function () {
- activeEl.selectionStart = start;
- activeEl.selectionEnd = end;
- };
- }
- AbstractElement.addInheritableStatics({
- <span id='Ext-dom-AbstractElement-method-getActiveElement'> /**
- </span> * Returns the active element in the DOM. If the browser supports activeElement
- * on the document, this is returned. If not, the focus is tracked and the active
- * element is maintained internally.
- * @return {HTMLElement} The active (focused) element in the document.
- */
- getActiveElement: function () {
- return doc.activeElement || activeElement;
- },
- <span id='Ext-dom-AbstractElement-method-getRightMarginFixCleaner'> /**
- </span> * Creates a function to call to clean up problems with the work-around for the
- * WebKit RightMargin bug. The work-around is to add "display: 'inline-block'" to
- * the element before calling getComputedStyle and then to restore its original
- * display value. The problem with this is that it corrupts the selection of an
- * INPUT or TEXTAREA element (as in the "I-beam" goes away but ths focus remains).
- * To cleanup after this, we need to capture the selection of any such element and
- * then restore it after we have restored the display style.
- *
- * @param {Ext.dom.Element} target The top-most element being adjusted.
- * @private
- */
- getRightMarginFixCleaner: function (target) {
- var supports = Ext.supports,
- hasInputBug = supports.DisplayChangeInputSelectionBug,
- hasTextAreaBug = supports.DisplayChangeTextAreaSelectionBug,
- activeEl,
- tag,
- start,
- end;
- if (hasInputBug || hasTextAreaBug) {
- activeEl = doc.activeElement || activeElement; // save a call
- tag = activeEl && activeEl.tagName;
- if ((hasTextAreaBug && tag == 'TEXTAREA') ||
- (hasInputBug && tag == 'INPUT' && activeEl.type == 'text')) {
- if (Ext.dom.Element.isAncestor(target, activeEl)) {
- start = activeEl.selectionStart;
- end = activeEl.selectionEnd;
- if (Ext.isNumber(start) && Ext.isNumber(end)) { // to be safe...
- // We don't create the raw closure here inline because that
- // will be costly even if we don't want to return it (nested
- // function decls and exprs are often instantiated on entry
- // regardless of whether execution ever reaches them):
- return makeSelectionRestoreFn(activeEl, start, end);
- }
- }
- }
- }
- return Ext.emptyFn; // avoid special cases, just return a nop
- },
- getViewWidth: function(full) {
- return full ? Ext.dom.Element.getDocumentWidth() : Ext.dom.Element.getViewportWidth();
- },
- getViewHeight: function(full) {
- return full ? Ext.dom.Element.getDocumentHeight() : Ext.dom.Element.getViewportHeight();
- },
- getDocumentHeight: function() {
- return Math.max(!isCSS1 ? doc.body.scrollHeight : doc.documentElement.scrollHeight, Ext.dom.Element.getViewportHeight());
- },
- getDocumentWidth: function() {
- return Math.max(!isCSS1 ? doc.body.scrollWidth : doc.documentElement.scrollWidth, Ext.dom.Element.getViewportWidth());
- },
- getViewportHeight: function(){
- return Ext.isIE ?
- (Ext.isStrict ? doc.documentElement.clientHeight : doc.body.clientHeight) :
- self.innerHeight;
- },
- getViewportWidth: function() {
- return (!Ext.isStrict && !Ext.isOpera) ? doc.body.clientWidth :
- Ext.isIE ? doc.documentElement.clientWidth : self.innerWidth;
- },
- getY: function(el) {
- return Ext.dom.Element.getXY(el)[1];
- },
- getX: function(el) {
- return Ext.dom.Element.getXY(el)[0];
- },
- getXY: function(el) {
- var bd = doc.body,
- docEl = doc.documentElement,
- leftBorder = 0,
- topBorder = 0,
- ret = [0,0],
- round = Math.round,
- box,
- scroll;
- el = Ext.getDom(el);
- if(el != doc && el != bd){
- // IE has the potential to throw when getBoundingClientRect called
- // on element not attached to dom
- if (Ext.isIE) {
- try {
- box = el.getBoundingClientRect();
- // In some versions of IE, the documentElement (HTML element) will have a 2px border that gets included, so subtract it off
- topBorder = docEl.clientTop || bd.clientTop;
- leftBorder = docEl.clientLeft || bd.clientLeft;
- } catch (ex) {
- box = { left: 0, top: 0 };
- }
- } else {
- box = el.getBoundingClientRect();
- }
- scroll = fly(document).getScroll();
- ret = [round(box.left + scroll.left - leftBorder), round(box.top + scroll.top - topBorder)];
- }
- return ret;
- },
- setXY: function(el, xy) {
- (el = Ext.fly(el, '_setXY')).position();
- var pts = el.translatePoints(xy),
- style = el.dom.style,
- pos;
- for (pos in pts) {
- if (!isNaN(pts[pos])) {
- style[pos] = pts[pos] + "px";
- }
- }
- },
- setX: function(el, x) {
- Ext.dom.Element.setXY(el, [x, false]);
- },
- setY: function(el, y) {
- Ext.dom.Element.setXY(el, [false, y]);
- },
- <span id='Ext-dom-AbstractElement-method-serializeForm'> /**
- </span> * Serializes a DOM form into a url encoded string
- * @param {Object} form The form
- * @return {String} The url encoded form
- */
- serializeForm: function(form) {
- var fElements = form.elements || (document.forms[form] || Ext.getDom(form)).elements,
- hasSubmit = false,
- encoder = encodeURIComponent,
- data = '',
- eLen = fElements.length,
- element, name, type, options, hasValue, e,
- o, oLen, opt;
- for (e = 0; e < eLen; e++) {
- element = fElements[e];
- name = element.name;
- type = element.type;
- options = element.options;
- if (!element.disabled && name) {
- if (/select-(one|multiple)/i.test(type)) {
- oLen = options.length;
- for (o = 0; o < oLen; o++) {
- opt = options[o];
- if (opt.selected) {
- hasValue = opt.hasAttribute ? opt.hasAttribute('value') : opt.getAttributeNode('value').specified;
- data += Ext.String.format("{0}={1}&", encoder(name), encoder(hasValue ? opt.value : opt.text));
- }
- }
- } else if (!(/file|undefined|reset|button/i.test(type))) {
- if (!(/radio|checkbox/i.test(type) && !element.checked) && !(type == 'submit' && hasSubmit)) {
- data += encoder(name) + '=' + encoder(element.value) + '&';
- hasSubmit = /submit/i.test(type);
- }
- }
- }
- }
- return data.substr(0, data.length - 1);
- }
- });
- }());
- </pre>
- </body>
- </html>
|