X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6e39d509471fe9b4e2660e0d1631b350d0c66f40..f562e4c6e5fac7bcb445985b99acbea4d706e6f0:/docs/source/Element-more.html?ds=sidebyside diff --git a/docs/source/Element-more.html b/docs/source/Element-more.html index ee057194..34108069 100644 --- a/docs/source/Element-more.html +++ b/docs/source/Element-more.html @@ -1,198 +1,305 @@ - -
- -/** - * @class Ext.Element + + + + +The source code + + + + + + +/** + * @class Ext.Element */ -Ext.Element.addMethods({ - /** - * Stops the specified event(s) from bubbling and optionally prevents the default action - * @param {String/Array} eventName an event / array of events to stop from bubbling - * @param {Boolean} preventDefault (optional) true to prevent the default action too - * @return {Ext.Element} this - */ - swallowEvent : function(eventName, preventDefault){ - var me = this; - function fn(e){ - e.stopPropagation(); - if(preventDefault){ - e.preventDefault(); + +Ext.Element.addMethods((function(){ + var focusRe = /button|input|textarea|select|object/; + return { + /** + * Monitors this Element for the mouse leaving. Calls the function after the specified delay only if + * the mouse was not moved back into the Element within the delay. If the mouse <i>was</i> moved + * back in, the function is not called. + * @param {Number} delay The delay <b>in milliseconds</b> to wait for possible mouse re-entry before calling the handler function. + * @param {Function} handler The function to call if the mouse remains outside of this Element for the specified time. + * @param {Object} scope The scope (<code>this</code> reference) in which the handler function executes. Defaults to this Element. + * @return {Object} The listeners object which was added to this element so that monitoring can be stopped. Example usage:<pre><code> +// Hide the menu if the mouse moves out for 250ms or more +this.mouseLeaveMonitor = this.menuEl.monitorMouseLeave(250, this.hideMenu, this); + +... +// Remove mouseleave monitor on menu destroy +this.menuEl.un(this.mouseLeaveMonitor); + </code></pre> + */ + monitorMouseLeave: function(delay, handler, scope) { + var me = this, + timer, + listeners = { + mouseleave: function(e) { + timer = setTimeout(Ext.Function.bind(handler, scope||me, [e]), delay); + }, + mouseenter: function() { + clearTimeout(timer); + }, + freezeEvent: true + }; + + me.on(listeners); + return listeners; + }, + + /** + * Stops the specified event(s) from bubbling and optionally prevents the default action + * @param {String/String[]} eventName an event / array of events to stop from bubbling + * @param {Boolean} preventDefault (optional) true to prevent the default action too + * @return {Ext.Element} this + */ + swallowEvent : function(eventName, preventDefault) { + var me = this; + function fn(e) { + e.stopPropagation(); + if (preventDefault) { + e.preventDefault(); + } } - } - if(Ext.isArray(eventName)){ - Ext.each(eventName, function(e) { - me.on(e, fn); - }); - return me; - } - me.on(eventName, fn); - return me; - }, - - /** - * Create an event handler on this element such that when the event fires and is handled by this element, - * it will be relayed to another object (i.e., fired again as if it originated from that object instead). - * @param {String} eventName The type of event to relay - * @param {Object} object Any object that extends {@link Ext.util.Observable} that will provide the context - * for firing the relayed event - */ - relayEvent : function(eventName, observable){ - this.on(eventName, function(e){ - observable.fireEvent(eventName, e); - }); - }, - - /** - * Removes worthless text nodes - * @param {Boolean} forceReclean (optional) By default the element - * keeps track if it has been cleaned already so - * you can call this over and over. However, if you update the element and - * need to force a reclean, you can pass true. - */ - clean : function(forceReclean){ - var me = this, - dom = me.dom, - n = dom.firstChild, - ni = -1; - - if(Ext.Element.data(dom, 'isCleaned') && forceReclean !== true){ + + if (Ext.isArray(eventName)) { + Ext.each(eventName, function(e) { + me.on(e, fn); + }); + return me; + } + me.on(eventName, fn); return me; - } - - while(n){ - var nx = n.nextSibling; - if(n.nodeType == 3 && !/\S/.test(n.nodeValue)){ - dom.removeChild(n); - }else{ - n.nodeIndex = ++ni; + }, + + /** + * Create an event handler on this element such that when the event fires and is handled by this element, + * it will be relayed to another object (i.e., fired again as if it originated from that object instead). + * @param {String} eventName The type of event to relay + * @param {Object} object Any object that extends {@link Ext.util.Observable} that will provide the context + * for firing the relayed event + */ + relayEvent : function(eventName, observable) { + this.on(eventName, function(e) { + observable.fireEvent(eventName, e); + }); + }, + + /** + * Removes Empty, or whitespace filled text nodes. Combines adjacent text nodes. + * @param {Boolean} forceReclean (optional) By default the element + * keeps track if it has been cleaned already so + * you can call this over and over. However, if you update the element and + * need to force a reclean, you can pass true. + */ + clean : function(forceReclean) { + var me = this, + dom = me.dom, + n = dom.firstChild, + nx, + ni = -1; + + if (Ext.Element.data(dom, 'isCleaned') && forceReclean !== true) { + return me; } - n = nx; - } - Ext.Element.data(dom, 'isCleaned', true); - return me; - }, - - /** - * Direct access to the Updater {@link Ext.Updater#update} method. The method takes the same object - * parameter as {@link Ext.Updater#update} - * @return {Ext.Element} this - */ - load : function(){ - var um = this.getUpdater(); - um.update.apply(um, arguments); - return this; - }, - - /** - * Gets this element's {@link Ext.Updater Updater} - * @return {Ext.Updater} The Updater - */ - getUpdater : function(){ - return this.updateManager || (this.updateManager = new Ext.Updater(this)); - }, - - /** - * Update the innerHTML of this element, optionally searching for and processing scripts - * @param {String} html The new HTML - * @param {Boolean} loadScripts (optional) True to look for and process scripts (defaults to false) - * @param {Function} callback (optional) For async script loading you can be notified when the update completes - * @return {Ext.Element} this - */ - update : function(html, loadScripts, callback){ - if (!this.dom) { - return this; - } - html = html || ""; - if(loadScripts !== true){ - this.dom.innerHTML = html; - if(Ext.isFunction(callback)){ - callback(); + while (n) { + nx = n.nextSibling; + if (n.nodeType == 3) { + // Remove empty/whitespace text nodes + if (!(/\S/.test(n.nodeValue))) { + dom.removeChild(n); + // Combine adjacent text nodes + } else if (nx && nx.nodeType == 3) { + n.appendData(Ext.String.trim(nx.data)); + dom.removeChild(nx); + nx = n.nextSibling; + n.nodeIndex = ++ni; + } + } else { + // Recursively clean + Ext.fly(n).clean(); + n.nodeIndex = ++ni; + } + n = nx; } + + Ext.Element.data(dom, 'isCleaned', true); + return me; + }, + + /** + * Direct access to the Ext.ElementLoader {@link Ext.ElementLoader#load} method. The method takes the same object + * parameter as {@link Ext.ElementLoader#load} + * @return {Ext.Element} this + */ + load : function(options) { + this.getLoader().load(options); return this; - } - - var id = Ext.id(), - dom = this.dom; - - html += ''; - - Ext.lib.Event.onAvailable(id, function(){ - var DOC = document, - hd = DOC.getElementsByTagName("head")[0], - re = /(?: