X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..b37ceabb82336ee82757cd32efe353cfab8ec267:/docs/source/EventManager.html diff --git a/docs/source/EventManager.html b/docs/source/EventManager.html index 058374ad..a4278495 100644 --- a/docs/source/EventManager.html +++ b/docs/source/EventManager.html @@ -1,94 +1,221 @@ - - - The source code - - - - -
/** + + + + 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.EventManager
  * Registers event handlers that want to receive a normalized EventObject instead of the standard browser event and provides
  * several useful events directly.
  * See {@link Ext.EventObject} for more details on normalized event objects.
  * @singleton
  */
+
 Ext.EventManager = function(){
-    var docReadyEvent, 
-    	docReadyProcId, 
-    	docReadyState = false,    	
-    	E = Ext.lib.Event,
-    	D = Ext.lib.Dom,
-    	DOC = document,
-    	WINDOW = window,
-    	IEDEFERED = "ie-deferred-loader",
-    	DOMCONTENTLOADED = "DOMContentLoaded",
-    	elHash = {},
-    	propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;
+    var docReadyEvent,
+        docReadyProcId,
+        docReadyState = false,
+        DETECT_NATIVE = Ext.isGecko || Ext.isWebKit || Ext.isSafari,
+        E = Ext.lib.Event,
+        D = Ext.lib.Dom,
+        DOC = document,
+        WINDOW = window,
+        DOMCONTENTLOADED = "DOMContentLoaded",
+        COMPLETE = 'complete',
+        propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+        /*
+         * This cache is used to hold special js objects, the document and window, that don't have an id. We need to keep
+         * a reference to them so we can look them up at a later point.
+         */
+        specialElCache = [];
+
+     function getId(el){
+        var id = false,
+            i = 0,
+            len = specialElCache.length,
+            id = false,
+            skip = false,
+            o;
+        if(el){
+            if(el.getElementById || el.navigator){
+                // look up the id
+                for(; i < len; ++i){
+                    o = specialElCache[i];
+                    if(o.el === el){
+                        id = o.id;
+                        break;
+                    }
+                }
+                if(!id){
+                    // for browsers that support it, ensure that give the el the same id
+                    id = Ext.id(el);
+                    specialElCache.push({
+                        id: id,
+                        el: el
+                    });
+                    skip = true;
+                }
+            }else{
+                id = Ext.id(el);
+            }
+            if(!Ext.elCache[id]){
+                Ext.Element.addToCache(new Ext.Element(el), id);
+                if(skip){
+                    Ext.elCache[id].skipGC = true;
+                }
+            }
+        }
+        return id;
+     };
 
     /// There is some jquery work around stuff here that isn't needed in Ext Core.
-    function addListener(el, ename, fn, wrap, scope){	    
-        var id = Ext.id(el),
-        	es = elHash[id] = elHash[id] || {};     	
-       
-        (es[ename] = es[ename] || []).push([fn, wrap, scope]);
-        E.on(el, ename, wrap);
+    function addListener(el, ename, fn, task, wrap, scope){
+        el = Ext.getDom(el);
+        var id = getId(el),
+            es = Ext.elCache[id].events,
+            wfn;
+
+        wfn = E.on(el, ename, wrap);
+        es[ename] = es[ename] || [];
+
+        /* 0 = Original Function,
+           1 = Event Manager Wrapped Function,
+           2 = Scope,
+           3 = Adapter Wrapped Function,
+           4 = Buffered Task
+        */
+        es[ename].push([fn, wrap, scope, wfn, task]);
 
         // this is a workaround for jQuery and should somehow be removed from Ext Core in the future
         // without breaking ExtJS.
-        if(ename == "mousewheel" && el.addEventListener){ // workaround for jQuery
-        	var args = ["DOMMouseScroll", wrap, false];
-        	el.addEventListener.apply(el, args);
-            E.on(window, 'unload', function(){
-	            el.removeEventListener.apply(el, args);                
+
+        // workaround for jQuery
+        if(el.addEventListener && ename == "mousewheel"){
+            var args = ["DOMMouseScroll", wrap, false];
+            el.addEventListener.apply(el, args);
+            Ext.EventManager.addListener(WINDOW, 'unload', function(){
+                el.removeEventListener.apply(el, args);
             });
         }
-        if(ename == "mousedown" && el == document){ // fix stopped mousedowns on the document
+
+        // fix stopped mousedowns on the document
+        if(el == DOC && ename == "mousedown"){
             Ext.EventManager.stoppedMouseDownEvent.addListener(wrap);
         }
     };
-    
-    function fireDocReady(){
-        if(!docReadyState){            
-            Ext.isReady = docReadyState = true;
+
+    function doScrollChk(){
+        /* Notes:
+             'doScroll' will NOT work in a IFRAME/FRAMESET.
+             The method succeeds but, a DOM query done immediately after -- FAILS.
+          */
+        if(window != top){
+            return false;
+        }
+
+        try{
+            DOC.documentElement.doScroll('left');
+        }catch(e){
+             return false;
+        }
+
+        fireDocReady();
+        return true;
+    }
+    
/** + * @return {Boolean} True if the document is in a 'complete' state (or was determined to + * be true by other means). If false, the state is evaluated again until canceled. + */ + function checkReadyState(e){ + + if(Ext.isIE && doScrollChk()){ + return true; + } + if(DOC.readyState == COMPLETE){ + fireDocReady(); + return true; + } + docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2)); + return false; + } + + var styles; + function checkStyleSheets(e){ + styles || (styles = Ext.query('style, link[rel=stylesheet]')); + if(styles.length == DOC.styleSheets.length){ + fireDocReady(); + return true; + } + docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2)); + return false; + } + + function OperaDOMContentLoaded(e){ + DOC.removeEventListener(DOMCONTENTLOADED, arguments.callee, false); + checkStyleSheets(); + } + + function fireDocReady(e){ + if(!docReadyState){ + docReadyState = true; //only attempt listener removal once + if(docReadyProcId){ - clearInterval(docReadyProcId); + clearTimeout(docReadyProcId); } - if(Ext.isGecko || Ext.isOpera) { + if(DETECT_NATIVE) { DOC.removeEventListener(DOMCONTENTLOADED, fireDocReady, false); } - if(Ext.isIE){ - var defer = DOC.getElementById(IEDEFERED); - if(defer){ - defer.onreadystatechange = null; - defer.parentNode.removeChild(defer); - } - } - if(docReadyEvent){ - docReadyEvent.fire(); - docReadyEvent.clearListeners(); + if(Ext.isIE && checkReadyState.bindIE){ //was this was actually set ?? + DOC.detachEvent('onreadystatechange', checkReadyState); } + E.un(WINDOW, "load", arguments.callee); + } + if(docReadyEvent && !Ext.isReady){ + Ext.isReady = true; + docReadyEvent.fire(); + docReadyEvent.listeners = []; } + }; function initDocReady(){ - var COMPLETE = "complete"; - - docReadyEvent = new Ext.util.Event(); - if (Ext.isGecko || Ext.isOpera) { + docReadyEvent || (docReadyEvent = new Ext.util.Event()); + if (DETECT_NATIVE) { DOC.addEventListener(DOMCONTENTLOADED, fireDocReady, false); - } else if (Ext.isIE){ - DOC.write(""); - DOC.getElementById(IEDEFERED).onreadystatechange = function(){ - if(this.readyState == COMPLETE){ - fireDocReady(); - } - }; - } else if (Ext.isWebKit){ - docReadyProcId = setInterval(function(){ - if(DOC.readyState == COMPLETE) { - fireDocReady(); - } - }, 10); + } + /* + * Handle additional (exceptional) detection strategies here + */ + if (Ext.isIE){ + //Use readystatechange as a backup AND primary detection mechanism for a FRAME/IFRAME + //See if page is already loaded + if(!checkReadyState()){ + checkReadyState.bindIE = true; + DOC.attachEvent('onreadystatechange', checkReadyState); + } + + }else if(Ext.isOpera ){ + /* Notes: + Opera needs special treatment needed here because CSS rules are NOT QUITE + available after DOMContentLoaded is raised. + */ + + //See if page is already loaded and all styleSheets are in place + (DOC.readyState == COMPLETE && checkStyleSheets()) || + DOC.addEventListener(DOMCONTENTLOADED, OperaDOMContentLoaded, false); + + }else if (Ext.isWebKit){ + //Fallback for older Webkits without DOMCONTENTLOADED support + checkReadyState(); } // no matter what, make sure it fires on load E.on(WINDOW, "load", fireDocReady); @@ -96,17 +223,16 @@ Ext.EventManager = function(){ function createTargeted(h, o){ return function(){ - var args = Ext.toArray(arguments); + var args = Ext.toArray(arguments); if(o.target == Ext.EventObject.setEvent(args[0]).target){ h.apply(this, args); } }; - }; - - function createBuffered(h, o){ - var task = new Ext.util.DelayedTask(h); + }; + + function createBuffered(h, o, task){ return function(e){ - // create new event object impl so new events don't wipe out properties + // create new event object impl so new events don't wipe out properties task.delay(o.buffer, h, null, [new Ext.EventObjectImpl(e)]); }; }; @@ -118,29 +244,30 @@ Ext.EventManager = function(){ }; }; - function createDelayed(h, o){ + function createDelayed(h, o, fn){ return function(e){ - // create new event object impl so new events don't wipe out properties - e = new Ext.EventObjectImpl(e); - setTimeout(function(){ - h(e); - }, o.delay || 10); + var task = new Ext.util.DelayedTask(h); + if(!fn.tasks) { + fn.tasks = []; + } + fn.tasks.push(task); + task.delay(o.delay || 10, h, null, [new Ext.EventObjectImpl(e)]); }; }; function listen(element, ename, opt, fn, scope){ - var o = !Ext.isObject(opt) ? {} : opt, - el = Ext.getDom(element); - - fn = fn || o.fn; + var o = (!opt || typeof opt == "boolean") ? {} : opt, + el = Ext.getDom(element), task; + + fn = fn || o.fn; scope = scope || o.scope; - + if(!el){ throw "Error listening for \"" + ename + '\". Element "' + element + '" doesn\'t exist.'; } function h(e){ // prevent errors while unload occurring - if(!Ext){// !window[xname]){ ==> can't we do this? + if(!Ext){// !window[xname]){ ==> can't we do this? return; } e = Ext.EventObject.setEvent(e); @@ -151,7 +278,7 @@ Ext.EventManager = function(){ } } else { t = e.target; - } + } if (o.stopEvent) { e.stopEvent(); } @@ -164,156 +291,284 @@ Ext.EventManager = function(){ if (o.normalized) { e = e.browserEvent; } - + fn.call(scope || el, e, t, o); }; if(o.target){ h = createTargeted(h, o); } if(o.delay){ - h = createDelayed(h, o); + h = createDelayed(h, o, fn); } if(o.single){ h = createSingle(h, el, ename, fn, scope); } if(o.buffer){ - h = createBuffered(h, o); + task = new Ext.util.DelayedTask(h); + h = createBuffered(h, o, task); } - addListener(el, ename, fn, h, scope); + addListener(el, ename, fn, task, h, scope); return h; }; var pub = { -
/** - * Appends an event handler to an element. The shorthand version {@link #on} is equivalent. Typically you will - * use {@link Ext.Element#addListener} directly on an Element in favor of calling this version. - * @param {String/HTMLElement} el The html element or id to assign the event handler to - * @param {String} eventName The type of event to listen for - * @param {Function} handler The handler function the event invokes This function is passed - * the following parameters:
    - *
  • evt : EventObject
    The {@link Ext.EventObject EventObject} describing the event.
  • - *
  • t : Element
    The {@link Ext.Element Element} which was the target of the event. - * Note that this may be filtered by using the delegate option.
  • - *
  • o : Object
    The options object from the addListener call.
  • - *
- * @param {Object} scope (optional) The scope (this reference) in which the handler function is executed. Defaults to the Element. - * @param {Object} options (optional) An object containing handler configuration properties. - * This may contain any of the following properties:
    - *
  • scope : Object
    The scope (this reference) in which the handler function is executed. Defaults to the Element.
  • - *
  • delegate : String
    A simple selector to filter the target or look for a descendant of the target
  • - *
  • stopEvent : Boolean
    True to stop the event. That is stop propagation, and prevent the default action.
  • - *
  • preventDefault : Boolean
    True to prevent the default action
  • - *
  • stopPropagation : Boolean
    True to prevent event propagation
  • - *
  • normalized : Boolean
    False to pass a browser event to the handler function instead of an Ext.EventObject
  • - *
  • delay : Number
    The number of milliseconds to delay the invocation of the handler after te event fires.
  • - *
  • single : Boolean
    True to add a handler to handle just the next firing of the event, and then remove itself.
  • - *
  • buffer : Number
    Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed - * by the specified number of milliseconds. If the event fires again within that time, the original - * handler is not invoked, but the new handler is scheduled in its place.
  • - *
  • target : Element
    Only call the handler if the event was fired on the target Element, not if the event was bubbled up from a child node.
  • - *

- *

See {@link Ext.Element#addListener} for examples of how to use these options.

- */ - addListener : function(element, eventName, fn, scope, options){ - if(Ext.isObject(eventName)){ - var o = eventName, e, val; +
/** + * Appends an event handler to an element. The shorthand version {@link #on} is equivalent. Typically you will + * use {@link Ext.Element#addListener} directly on an Element in favor of calling this version. + * @param {String/HTMLElement} el The html element or id to assign the event handler to. + * @param {String} eventName The name of the event to listen for. + * @param {Function} handler The handler function the event invokes. This function is passed + * the following parameters:
    + *
  • evt : EventObject
    The {@link Ext.EventObject EventObject} describing the event.
  • + *
  • t : Element
    The {@link Ext.Element Element} which was the target of the event. + * Note that this may be filtered by using the delegate option.
  • + *
  • o : Object
    The options object from the addListener call.
  • + *
+ * @param {Object} scope (optional) The scope (this reference) in which the handler function is executed. Defaults to the Element. + * @param {Object} options (optional) An object containing handler configuration properties. + * This may contain any of the following properties:
    + *
  • scope : Object
    The scope (this reference) in which the handler function is executed. Defaults to the Element.
  • + *
  • delegate : String
    A simple selector to filter the target or look for a descendant of the target
  • + *
  • stopEvent : Boolean
    True to stop the event. That is stop propagation, and prevent the default action.
  • + *
  • preventDefault : Boolean
    True to prevent the default action
  • + *
  • stopPropagation : Boolean
    True to prevent event propagation
  • + *
  • normalized : Boolean
    False to pass a browser event to the handler function instead of an Ext.EventObject
  • + *
  • delay : Number
    The number of milliseconds to delay the invocation of the handler after te event fires.
  • + *
  • single : Boolean
    True to add a handler to handle just the next firing of the event, and then remove itself.
  • + *
  • buffer : Number
    Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed + * by the specified number of milliseconds. If the event fires again within that time, the original + * handler is not invoked, but the new handler is scheduled in its place.
  • + *
  • target : Element
    Only call the handler if the event was fired on the target Element, not if the event was bubbled up from a child node.
  • + *

+ *

See {@link Ext.Element#addListener} for examples of how to use these options.

+ */ + addListener : function(element, eventName, fn, scope, options){ + if(typeof eventName == 'object'){ + var o = eventName, e, val; for(e in o){ - val = o[e]; - if(!propRe.test(e)){ - if(Ext.isFunction(val)){ - // shared options - listen(element, e, o, val, o.scope); - }else{ - // individual options - listen(element, e, val); - } + val = o[e]; + if(!propRe.test(e)){ + if(Ext.isFunction(val)){ + // shared options + listen(element, e, o, val, o.scope); + }else{ + // individual options + listen(element, e, val); + } } } } else { - listen(element, eventName, options, fn, scope); - } + listen(element, eventName, options, fn, scope); + } }, - +
/** * Removes an event handler from an element. The shorthand version {@link #un} is equivalent. Typically * you will use {@link Ext.Element#removeListener} directly on an Element in favor of calling this version. - * @param {String/HTMLElement} el The id or html element from which to remove the event - * @param {String} eventName The type of event - * @param {Function} fn The handler function to remove + * @param {String/HTMLElement} el The id or html element from which to remove the listener. + * @param {String} eventName The name of the event. + * @param {Function} fn The handler function to remove. This must be a reference to the function passed into the {@link #addListener} call. + * @param {Object} scope If a scope (this reference) was specified when the listener was added, + * then this must refer to the same object. */ - removeListener : function(element, eventName, fn, scope){ - var el = Ext.getDom(element), - id = Ext.id(el), - wrap; - - Ext.each((elHash[id] || {})[eventName], function (v,i,a) { - if (Ext.isArray(v) && v[0] == fn && (!scope || v[2] == scope)) { - E.un(el, eventName, wrap = v[1]); - a.splice(i,1); - return false; - } - }); - - // jQuery workaround that should be removed from Ext Core - if(eventName == "mousewheel" && el.addEventListener && wrap){ - el.removeEventListener("DOMMouseScroll", wrap, false); - } - - if(eventName == "mousedown" && el == DOC && wrap){ // fix stopped mousedowns on the document - Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap); - } + removeListener : function(el, eventName, fn, scope){ + el = Ext.getDom(el); + var id = getId(el), + f = el && (Ext.elCache[id].events)[eventName] || [], + wrap, i, l, k, len, fnc; + + for (i = 0, len = f.length; i < len; i++) { + + /* 0 = Original Function, + 1 = Event Manager Wrapped Function, + 2 = Scope, + 3 = Adapter Wrapped Function, + 4 = Buffered Task + */ + if (Ext.isArray(fnc = f[i]) && fnc[0] == fn && (!scope || fnc[2] == scope)) { + if(fnc[4]) { + fnc[4].cancel(); + } + k = fn.tasks && fn.tasks.length; + if(k) { + while(k--) { + fn.tasks[k].cancel(); + } + delete fn.tasks; + } + wrap = fnc[1]; + E.un(el, eventName, E.extAdapter ? fnc[3] : wrap); + + // jQuery workaround that should be removed from Ext Core + if(wrap && el.addEventListener && eventName == "mousewheel"){ + el.removeEventListener("DOMMouseScroll", wrap, false); + } + + // fix stopped mousedowns on the document + if(wrap && el == DOC && eventName == "mousedown"){ + Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap); + } + + f.splice(i, 1); + if (f.length === 0) { + delete Ext.elCache[id].events[eventName]; + } + for (k in Ext.elCache[id].events) { + return false; + } + Ext.elCache[id].events = {}; + return false; + } + } }, - +
/** * Removes all event handers from an element. Typically you will use {@link Ext.Element#removeAllListeners} * directly on an Element in favor of calling this version. - * @param {String/HTMLElement} el The id or html element from which to remove the event + * @param {String/HTMLElement} el The id or html element from which to remove all event handlers. */ removeAll : function(el){ - var id = Ext.id(el = Ext.getDom(el)), - es = elHash[id], - ename; - - for(ename in es){ - if(es.hasOwnProperty(ename)){ - Ext.each(es[ename], function(v) { - E.un(el, ename, v.wrap); - }); - } - } - elHash[id] = null; + el = Ext.getDom(el); + var id = getId(el), + ec = Ext.elCache[id] || {}, + es = ec.events || {}, + f, i, len, ename, fn, k, wrap; + + for(ename in es){ + if(es.hasOwnProperty(ename)){ + f = es[ename]; + /* 0 = Original Function, + 1 = Event Manager Wrapped Function, + 2 = Scope, + 3 = Adapter Wrapped Function, + 4 = Buffered Task + */ + for (i = 0, len = f.length; i < len; i++) { + fn = f[i]; + if(fn[4]) { + fn[4].cancel(); + } + if(fn[0].tasks && (k = fn[0].tasks.length)) { + while(k--) { + fn[0].tasks[k].cancel(); + } + delete fn.tasks; + } + wrap = fn[1]; + E.un(el, ename, E.extAdapter ? fn[3] : wrap); + + // jQuery workaround that should be removed from Ext Core + if(el.addEventListener && wrap && ename == "mousewheel"){ + el.removeEventListener("DOMMouseScroll", wrap, false); + } + + // fix stopped mousedowns on the document + if(wrap && el == DOC && ename == "mousedown"){ + Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap); + } + } + } + } + if (Ext.elCache[id]) { + Ext.elCache[id].events = {}; + } + }, + + getListeners : function(el, eventName) { + el = Ext.getDom(el); + var id = getId(el), + ec = Ext.elCache[id] || {}, + es = ec.events || {}, + results = []; + if (es && es[eventName]) { + return es[eventName]; + } else { + return null; + } + }, + + purgeElement : function(el, recurse, eventName) { + el = Ext.getDom(el); + var id = getId(el), + ec = Ext.elCache[id] || {}, + es = ec.events || {}, + i, f, len; + if (eventName) { + if (es && es.hasOwnProperty(eventName)) { + f = es[eventName]; + for (i = 0, len = f.length; i < len; i++) { + Ext.EventManager.removeListener(el, eventName, f[i][0]); + } + } + } else { + Ext.EventManager.removeAll(el); + } + if (recurse && el && el.childNodes) { + for (i = 0, len = el.childNodes.length; i < len; i++) { + Ext.EventManager.purgeElement(el.childNodes[i], recurse, eventName); + } + } }, + _unload : function() { + var el; + for (el in Ext.elCache) { + Ext.EventManager.removeAll(el); + } + delete Ext.elCache; + delete Ext.Element._flyweights; + + // Abort any outstanding Ajax requests + var c, + conn, + tid, + ajax = Ext.lib.Ajax; + (typeof ajax.conn == 'object') ? conn = ajax.conn : conn = {}; + for (tid in conn) { + c = conn[tid]; + if (c) { + ajax.abort({conn: c, tId: tid}); + } + } + },
/** - * Fires when the document is ready (before onload and before images are loaded). Can be + * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Can be * accessed shorthanded as Ext.onReady(). - * @param {Function} fn The method the event invokes - * @param {Object} scope (optional) An object that becomes the scope of the handler - * @param {boolean} options (optional) An object containing standard {@link #addListener} options + * @param {Function} fn The method the event invokes. + * @param {Object} scope (optional) The scope (this reference) in which the handler function executes. Defaults to the browser window. + * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options + * {single: true} be used so that the handler is removed on first invocation. */ onDocumentReady : function(fn, scope, options){ - if(docReadyState){ // if it already fired + if(Ext.isReady){ // if it already fired or document.body is present + docReadyEvent || (docReadyEvent = new Ext.util.Event()); docReadyEvent.addListener(fn, scope, options); docReadyEvent.fire(); - docReadyEvent.clearListeners(); - } else { - if(!docReadyEvent) initDocReady(); + docReadyEvent.listeners = []; + }else{ + if(!docReadyEvent){ + initDocReady(); + } options = options || {}; - options.delay = options.delay || 1; - docReadyEvent.addListener(fn, scope, options); + options.delay = options.delay || 1; + docReadyEvent.addListener(fn, scope, options); } }, - - elHash : elHash + +
/** + * Forces a document ready state transition for the framework. Used when Ext is loaded + * into a DOM structure AFTER initial page load (Google API or other dynamic load scenario. + * Any pending 'onDocumentReady' handlers will be fired (if not already handled). + */ + fireDocReady : fireDocReady };
/** * Appends an event handler to an element. Shorthand for {@link #addListener}. * @param {String/HTMLElement} el The html element or id to assign the event handler to - * @param {String} eventName The type of event to listen for - * @param {Function} handler The handler function the event invokes - * @param {Object} scope (optional) The scope in which to execute the handler - * function (the handler function's "this" context) + * @param {String} eventName The name of the event to listen for. + * @param {Function} handler The handler function the event invokes. + * @param {Object} scope (optional) (this reference) in which the handler function executes. Defaults to the Element. * @param {Object} options (optional) An object containing standard {@link #addListener} options * @member Ext.EventManager * @method on @@ -321,10 +576,11 @@ Ext.EventManager = function(){ pub.on = pub.addListener;
/** * Removes an event handler from an element. Shorthand for {@link #removeListener}. - * @param {String/HTMLElement} el The id or html element from which to remove the event - * @param {String} eventName The type of event - * @param {Function} fn The handler function to remove - * @return {Boolean} True if a listener was actually removed, else false + * @param {String/HTMLElement} el The id or html element from which to remove the listener. + * @param {String} eventName The name of the event. + * @param {Function} fn The handler function to remove. This must be a reference to the function passed into the {@link #on} call. + * @param {Object} scope If a scope (this reference) was specified when the listener was added, + * then this must refer to the same object. * @member Ext.EventManager * @method un */ @@ -334,10 +590,11 @@ Ext.EventManager = function(){ return pub; }();
/** - * Fires when the document is ready (before onload and before images are loaded). Shorthand of {@link Ext.EventManager#onDocumentReady}. - * @param {Function} fn The method the event invokes - * @param {Object} scope An object that becomes the scope of the handler - * @param {boolean} options (optional) An object containing standard {@link #addListener} options + * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Shorthand of {@link Ext.EventManager#onDocumentReady}. + * @param {Function} fn The method the event invokes. + * @param {Object} scope (optional) The scope (this reference) in which the handler function executes. Defaults to the browser window. + * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options + * {single: true} be used so that the handler is removed on first invocation. * @member Ext * @method onReady */ @@ -346,7 +603,7 @@ Ext.onReady = Ext.EventManager.onDocumentReady; //Initialize doc classes (function(){ - + var initExtCss = function(){ // find the body element var bd = document.body || document.getElementsByTagName('body')[0]; @@ -388,7 +645,7 @@ Ext.onReady = Ext.EventManager.onDocumentReady;
/** * @class Ext.EventObject - * Just as {@link Ext.Element} wraps around a native DOM node, Ext.EventObject + * Just as {@link Ext.Element} wraps around a native DOM node, Ext.EventObject * wraps the browser's native event-object normalizing cross-browser differences, * such as which mouse button is clicked, keys pressed, mechanisms to stop * event-propagation along with a method to prevent default actions from taking place. @@ -403,7 +660,7 @@ var myDiv = {@link Ext#get Ext.get}("myDiv"); // get reference to an {@link Ext myDiv.on( // 'on' is shorthand for addListener "click", // perform an action on click of myDiv handleClick // reference to the action handler -); +); // other methods to do the same: Ext.EventManager.on("myDiv", 'click', handleClick); Ext.EventManager.addListener("myDiv", 'click', handleClick); @@ -412,21 +669,22 @@ Ext.EventManager.addListener("myDiv", 'click', handleClick); */ Ext.EventObject = function(){ var E = Ext.lib.Event, - // safari keypress events for special keys return bad keycodes - safariKeys = { - 3 : 13, // enter - 63234 : 37, // left - 63235 : 39, // right - 63232 : 38, // up - 63233 : 40, // down - 63276 : 33, // page up - 63277 : 34, // page down - 63272 : 46, // delete - 63273 : 36, // home - 63275 : 35 // end - }, - // normalize button clicks - btnMap = Ext.isIE ? {1:0,4:1,2:2} : + clickRe = /(dbl)?click/, + // safari keypress events for special keys return bad keycodes + safariKeys = { + 3 : 13, // enter + 63234 : 37, // left + 63235 : 39, // right + 63232 : 38, // up + 63233 : 40, // down + 63276 : 33, // page up + 63277 : 34, // page down + 63272 : 46, // delete + 63273 : 36, // home + 63275 : 35 // end + }, + // normalize button clicks + btnMap = Ext.isIE ? {1:0,4:1,2:2} : (Ext.isWebKit ? {1:0,2:1,3:2} : {0:0,1:1,2:2}); Ext.EventObjectImpl = function(e){ @@ -438,7 +696,7 @@ Ext.EventObject = function(){ Ext.EventObjectImpl.prototype = { /** @private */ setEvent : function(e){ - var me = this; + var me = this; if(e == me || (e && e.browserEvent)){ // already wrapped return e; } @@ -446,7 +704,7 @@ Ext.EventObject = function(){ if(e){ // normalize buttons me.button = e.button ? btnMap[e.button] : (e.which ? e.which - 1 : -1); - if(e.type == 'click' && me.button == -1){ + if(clickRe.test(e.type) && me.button == -1){ me.button = 0; } me.type = e.type; @@ -478,7 +736,7 @@ Ext.EventObject = function(){ * Stop the event (preventDefault and stopPropagation) */ stopEvent : function(){ - var me = this; + var me = this; if(me.browserEvent){ if(me.browserEvent.type == 'mousedown'){ Ext.EventManager.stoppedMouseDownEvent.fire(me); @@ -494,13 +752,13 @@ Ext.EventObject = function(){ if(this.browserEvent){ E.preventDefault(this.browserEvent); } - }, + },
/** * Cancels bubbling of the event. */ stopPropagation : function(){ - var me = this; + var me = this; if(me.browserEvent){ if(me.browserEvent.type == 'mousedown'){ Ext.EventManager.stoppedMouseDownEvent.fire(me); @@ -524,11 +782,11 @@ Ext.EventObject = function(){ getKey : function(){ return this.normalizeKey(this.keyCode || this.charCode) }, - - // private - normalizeKey: function(k){ - return Ext.isSafari ? (safariKeys[k] || k) : k; - }, + + // private + normalizeKey: function(k){ + return Ext.isSafari ? (safariKeys[k] || k) : k; + },
/** * Gets the x coordinate of the event. @@ -588,39 +846,40 @@ Ext.EventObject = function(){ } return delta; }, - -
/** - * Returns true if the target of this event is a child of el. Unless the allowEl parameter is set, it will return false if if the target is el. - * Example usage:

-		// Handle click on any child of an element
-		Ext.getBody().on('click', function(e){
-			if(e.within('some-el')){
-				alert('Clicked on a child of some-el!');
-			}
-		});
-		
-		// Handle click directly on an element, ignoring clicks on child nodes
-		Ext.getBody().on('click', function(e,t){
-			if((t.id == 'some-el') && !e.within(t, true)){
-				alert('Clicked directly on some-el!');
-			}
-		});
-		
- * @param {Mixed} el The id, DOM element or Ext.Element to check - * @param {Boolean} related (optional) true to test if the related target is within el instead of the target - * @param {Boolean} allowEl {optional} true to also check if the passed element is the target or related target - * @return {Boolean} - */ - within : function(el, related, allowEl){ + +
/** + * Returns true if the target of this event is a child of el. Unless the allowEl parameter is set, it will return false if if the target is el. + * Example usage:

+        // Handle click on any child of an element
+        Ext.getBody().on('click', function(e){
+            if(e.within('some-el')){
+                alert('Clicked on a child of some-el!');
+            }
+        });
+
+        // Handle click directly on an element, ignoring clicks on child nodes
+        Ext.getBody().on('click', function(e,t){
+            if((t.id == 'some-el') && !e.within(t, true)){
+                alert('Clicked directly on some-el!');
+            }
+        });
+        
+ * @param {Mixed} el The id, DOM element or Ext.Element to check + * @param {Boolean} related (optional) true to test if the related target is within el instead of the target + * @param {Boolean} allowEl {optional} true to also check if the passed element is the target or related target + * @return {Boolean} + */ + within : function(el, related, allowEl){ if(el){ - var t = this[related ? "getRelatedTarget" : "getTarget"](); - return t && ((allowEl ? (t == Ext.getDom(el)) : false) || Ext.fly(el).contains(t)); + var t = this[related ? "getRelatedTarget" : "getTarget"](); + return t && ((allowEl ? (t == Ext.getDom(el)) : false) || Ext.fly(el).contains(t)); } return false; - } - }; + } + }; return new Ext.EventObjectImpl(); -}();
- +}(); +
+ \ No newline at end of file