Roo/form/ComboBoxArray.js
[roojs1] / Roo / EventManager.js
1 /*
2  * Based on:
3  * Ext JS Library 1.1.1
4  * Copyright(c) 2006-2007, Ext JS, LLC.
5  *
6  * Originally Released Under LGPL - original licence link has changed is not relivant.
7  *
8  * Fork - LGPL
9  * <script type="text/javascript">
10  */
11
12 /**
13  * @class Roo.EventManager
14  * Registers event handlers that want to receive a normalized EventObject instead of the standard browser event and provides 
15  * several useful events directly.
16  * See {@link Roo.EventObject} for more details on normalized event objects.
17  * @singleton
18  */
19 Roo.EventManager = function(){
20     var docReadyEvent, docReadyProcId, docReadyState = false;
21     var resizeEvent, resizeTask, textEvent, textSize;
22     var E = Roo.lib.Event;
23     var D = Roo.lib.Dom;
24
25     
26     
27
28     var fireDocReady = function(){
29         if(!docReadyState){
30             docReadyState = true;
31             Roo.isReady = true;
32             if(docReadyProcId){
33                 clearInterval(docReadyProcId);
34             }
35             if(Roo.isGecko || Roo.isOpera) {
36                 document.removeEventListener("DOMContentLoaded", fireDocReady, false);
37             }
38             if(Roo.isIE){
39                 var defer = document.getElementById("ie-deferred-loader");
40                 if(defer){
41                     defer.onreadystatechange = null;
42                     defer.parentNode.removeChild(defer);
43                 }
44             }
45             if(docReadyEvent){
46                 docReadyEvent.fire();
47                 docReadyEvent.clearListeners();
48             }
49         }
50     };
51     
52     var initDocReady = function(){
53         docReadyEvent = new Roo.util.Event();
54         if(Roo.isGecko || Roo.isOpera) {
55             document.addEventListener("DOMContentLoaded", fireDocReady, false);
56         }else if(Roo.isIE){
57             document.write("<s"+'cript id="ie-deferred-loader" defer="defer" src="/'+'/:"></s'+"cript>");
58             var defer = document.getElementById("ie-deferred-loader");
59             defer.onreadystatechange = function(){
60                 if(this.readyState == "complete"){
61                     fireDocReady();
62                 }
63             };
64         }else if(Roo.isSafari){ 
65             docReadyProcId = setInterval(function(){
66                 var rs = document.readyState;
67                 if(rs == "complete") {
68                     fireDocReady();     
69                  }
70             }, 10);
71         }
72         // no matter what, make sure it fires on load
73         E.on(window, "load", fireDocReady);
74     };
75
76     var createBuffered = function(h, o){
77         var task = new Roo.util.DelayedTask(h);
78         return function(e){
79             // create new event object impl so new events don't wipe out properties
80             e = new Roo.EventObjectImpl(e);
81             task.delay(o.buffer, h, null, [e]);
82         };
83     };
84
85     var createSingle = function(h, el, ename, fn){
86         return function(e){
87             Roo.EventManager.removeListener(el, ename, fn);
88             h(e);
89         };
90     };
91
92     var createDelayed = function(h, o){
93         return function(e){
94             // create new event object impl so new events don't wipe out properties
95             e = new Roo.EventObjectImpl(e);
96             setTimeout(function(){
97                 h(e);
98             }, o.delay || 10);
99         };
100     };
101     var transitionEndVal = false;
102     
103     var transitionEnd = function()
104     {
105         if (transitionEndVal) {
106             return transitionEndVal;
107         }
108         var el = document.createElement('div');
109
110         var transEndEventNames = {
111             WebkitTransition : 'webkitTransitionEnd',
112             MozTransition    : 'transitionend',
113             OTransition      : 'oTransitionEnd otransitionend',
114             transition       : 'transitionend'
115         };
116     
117         for (var name in transEndEventNames) {
118             if (el.style[name] !== undefined) {
119                 transitionEndVal = transEndEventNames[name];
120                 return  transitionEndVal ;
121             }
122         }
123     }
124     
125
126     var listen = function(element, ename, opt, fn, scope){
127         var o = (!opt || typeof opt == "boolean") ? {} : opt;
128         fn = fn || o.fn; scope = scope || o.scope;
129         var el = Roo.getDom(element);
130         
131         
132         if(!el){
133             throw "Error listening for \"" + ename + '\". Element "' + element + '" doesn\'t exist.';
134         }
135         
136         if (ename == 'transitionend') {
137             ename = transitionEnd();
138         }
139         var h = function(e){
140             e = Roo.EventObject.setEvent(e);
141             var t;
142             if(o.delegate){
143                 t = e.getTarget(o.delegate, el);
144                 if(!t){
145                     return;
146                 }
147             }else{
148                 t = e.target;
149             }
150             if(o.stopEvent === true){
151                 e.stopEvent();
152             }
153             if(o.preventDefault === true){
154                e.preventDefault();
155             }
156             if(o.stopPropagation === true){
157                 e.stopPropagation();
158             }
159
160             if(o.normalized === false){
161                 e = e.browserEvent;
162             }
163
164             fn.call(scope || el, e, t, o);
165         };
166         if(o.delay){
167             h = createDelayed(h, o);
168         }
169         if(o.single){
170             h = createSingle(h, el, ename, fn);
171         }
172         if(o.buffer){
173             h = createBuffered(h, o);
174         }
175         fn._handlers = fn._handlers || [];
176         
177         
178         fn._handlers.push([Roo.id(el), ename, h]);
179         
180         
181          
182         E.on(el, ename, h);
183         if(ename == "mousewheel" && el.addEventListener){ // workaround for jQuery
184             el.addEventListener("DOMMouseScroll", h, false);
185             E.on(window, 'unload', function(){
186                 el.removeEventListener("DOMMouseScroll", h, false);
187             });
188         }
189         if(ename == "mousedown" && el == document){ // fix stopped mousedowns on the document
190             Roo.EventManager.stoppedMouseDownEvent.addListener(h);
191         }
192         return h;
193     };
194
195     var stopListening = function(el, ename, fn){
196         var id = Roo.id(el), hds = fn._handlers, hd = fn;
197         if(hds){
198             for(var i = 0, len = hds.length; i < len; i++){
199                 var h = hds[i];
200                 if(h[0] == id && h[1] == ename){
201                     hd = h[2];
202                     hds.splice(i, 1);
203                     break;
204                 }
205             }
206         }
207         E.un(el, ename, hd);
208         el = Roo.getDom(el);
209         if(ename == "mousewheel" && el.addEventListener){
210             el.removeEventListener("DOMMouseScroll", hd, false);
211         }
212         if(ename == "mousedown" && el == document){ // fix stopped mousedowns on the document
213             Roo.EventManager.stoppedMouseDownEvent.removeListener(hd);
214         }
215     };
216
217     var propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;
218     
219     var pub = {
220         
221         
222         /** 
223          * Fix for doc tools
224          * @scope Roo.EventManager
225          */
226         
227         
228         /** 
229          * This is no longer needed and is deprecated. Places a simple wrapper around an event handler to override the browser event
230          * object with a Roo.EventObject
231          * @param {Function} fn        The method the event invokes
232          * @param {Object}   scope    An object that becomes the scope of the handler
233          * @param {boolean}  override If true, the obj passed in becomes
234          *                             the execution scope of the listener
235          * @return {Function} The wrapped function
236          * @deprecated
237          */
238         wrap : function(fn, scope, override){
239             return function(e){
240                 Roo.EventObject.setEvent(e);
241                 fn.call(override ? scope || window : window, Roo.EventObject, scope);
242             };
243         },
244         
245         /**
246      * Appends an event handler to an element (shorthand for addListener)
247      * @param {String/HTMLElement}   element        The html element or id to assign the
248      * @param {String}   eventName The type of event to listen for
249      * @param {Function} handler The method the event invokes
250      * @param {Object}   scope (optional) The scope in which to execute the handler
251      * function. The handler function's "this" context.
252      * @param {Object}   options (optional) An object containing handler configuration
253      * properties. This may contain any of the following properties:<ul>
254      * <li>scope {Object} The scope in which to execute the handler function. The handler function's "this" context.</li>
255      * <li>delegate {String} A simple selector to filter the target or look for a descendant of the target</li>
256      * <li>stopEvent {Boolean} True to stop the event. That is stop propagation, and prevent the default action.</li>
257      * <li>preventDefault {Boolean} True to prevent the default action</li>
258      * <li>stopPropagation {Boolean} True to prevent event propagation</li>
259      * <li>normalized {Boolean} False to pass a browser event to the handler function instead of an Roo.EventObject</li>
260      * <li>delay {Number} The number of milliseconds to delay the invocation of the handler after te event fires.</li>
261      * <li>single {Boolean} True to add a handler to handle just the next firing of the event, and then remove itself.</li>
262      * <li>buffer {Number} Causes the handler to be scheduled to run in an {@link Roo.util.DelayedTask} delayed
263      * by the specified number of milliseconds. If the event fires again within that time, the original
264      * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</li>
265      * </ul><br>
266      * <p>
267      * <b>Combining Options</b><br>
268      * Using the options argument, it is possible to combine different types of listeners:<br>
269      * <br>
270      * A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)<div style="margin: 5px 20px 20px;">
271      * Code:<pre><code>
272 el.on('click', this.onClick, this, {
273     single: true,
274     delay: 100,
275     stopEvent : true,
276     forumId: 4
277 });</code></pre>
278      * <p>
279      * <b>Attaching multiple handlers in 1 call</b><br>
280       * The method also allows for a single argument to be passed which is a config object containing properties
281      * which specify multiple handlers.
282      * <p>
283      * Code:<pre><code>
284 el.on({
285     'click' : {
286         fn: this.onClick
287         scope: this,
288         delay: 100
289     },
290     'mouseover' : {
291         fn: this.onMouseOver
292         scope: this
293     },
294     'mouseout' : {
295         fn: this.onMouseOut
296         scope: this
297     }
298 });</code></pre>
299      * <p>
300      * Or a shorthand syntax:<br>
301      * Code:<pre><code>
302 el.on({
303     'click' : this.onClick,
304     'mouseover' : this.onMouseOver,
305     'mouseout' : this.onMouseOut
306     scope: this
307 });</code></pre>
308      */
309         addListener : function(element, eventName, fn, scope, options){
310             if(typeof eventName == "object"){
311                 var o = eventName;
312                 for(var e in o){
313                     if(propRe.test(e)){
314                         continue;
315                     }
316                     if(typeof o[e] == "function"){
317                         // shared options
318                         listen(element, e, o, o[e], o.scope);
319                     }else{
320                         // individual options
321                         listen(element, e, o[e]);
322                     }
323                 }
324                 return;
325             }
326             return listen(element, eventName, options, fn, scope);
327         },
328         
329         /**
330          * Removes an event handler
331          *
332          * @param {String/HTMLElement}   element        The id or html element to remove the 
333          *                             event from
334          * @param {String}   eventName     The type of event
335          * @param {Function} fn
336          * @return {Boolean} True if a listener was actually removed
337          */
338         removeListener : function(element, eventName, fn){
339             return stopListening(element, eventName, fn);
340         },
341         
342         /**
343          * Fires when the document is ready (before onload and before images are loaded). Can be 
344          * accessed shorthanded Roo.onReady().
345          * @param {Function} fn        The method the event invokes
346          * @param {Object}   scope    An  object that becomes the scope of the handler
347          * @param {boolean}  options
348          */
349         onDocumentReady : function(fn, scope, options){
350             if(docReadyState){ // if it already fired
351                 docReadyEvent.addListener(fn, scope, options);
352                 docReadyEvent.fire();
353                 docReadyEvent.clearListeners();
354                 return;
355             }
356             if(!docReadyEvent){
357                 initDocReady();
358             }
359             docReadyEvent.addListener(fn, scope, options);
360         },
361         
362         /**
363          * Fires when the window is resized and provides resize event buffering (50 milliseconds), passes new viewport width and height to handlers.
364          * @param {Function} fn        The method the event invokes
365          * @param {Object}   scope    An object that becomes the scope of the handler
366          * @param {boolean}  options
367          */
368         onWindowResize : function(fn, scope, options){
369             if(!resizeEvent){
370                 resizeEvent = new Roo.util.Event();
371                 resizeTask = new Roo.util.DelayedTask(function(){
372                     resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
373                 });
374                 E.on(window, "resize", function(){
375                     if(Roo.isIE){
376                         resizeTask.delay(50);
377                     }else{
378                         resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
379                     }
380                 });
381             }
382             resizeEvent.addListener(fn, scope, options);
383         },
384
385         /**
386          * Fires when the user changes the active text size. Handler gets called with 2 params, the old size and the new size.
387          * @param {Function} fn        The method the event invokes
388          * @param {Object}   scope    An object that becomes the scope of the handler
389          * @param {boolean}  options
390          */
391         onTextResize : function(fn, scope, options){
392             if(!textEvent){
393                 textEvent = new Roo.util.Event();
394                 var textEl = new Roo.Element(document.createElement('div'));
395                 textEl.dom.className = 'x-text-resize';
396                 textEl.dom.innerHTML = 'X';
397                 textEl.appendTo(document.body);
398                 textSize = textEl.dom.offsetHeight;
399                 setInterval(function(){
400                     if(textEl.dom.offsetHeight != textSize){
401                         textEvent.fire(textSize, textSize = textEl.dom.offsetHeight);
402                     }
403                 }, this.textResizeInterval);
404             }
405             textEvent.addListener(fn, scope, options);
406         },
407
408         /**
409          * Removes the passed window resize listener.
410          * @param {Function} fn        The method the event invokes
411          * @param {Object}   scope    The scope of handler
412          */
413         removeResizeListener : function(fn, scope){
414             if(resizeEvent){
415                 resizeEvent.removeListener(fn, scope);
416             }
417         },
418
419         // private
420         fireResize : function(){
421             if(resizeEvent){
422                 resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
423             }   
424         },
425         /**
426          * Url used for onDocumentReady with using SSL (defaults to Roo.SSL_SECURE_URL)
427          */
428         ieDeferSrc : false,
429         /**
430          * The frequency, in milliseconds, to check for text resize events (defaults to 50)
431          */
432         textResizeInterval : 50
433     };
434     
435     /**
436      * Fix for doc tools
437      * @scopeAlias pub=Roo.EventManager
438      */
439     
440      /**
441      * Appends an event handler to an element (shorthand for addListener)
442      * @param {String/HTMLElement}   element        The html element or id to assign the
443      * @param {String}   eventName The type of event to listen for
444      * @param {Function} handler The method the event invokes
445      * @param {Object}   scope (optional) The scope in which to execute the handler
446      * function. The handler function's "this" context.
447      * @param {Object}   options (optional) An object containing handler configuration
448      * properties. This may contain any of the following properties:<ul>
449      * <li>scope {Object} The scope in which to execute the handler function. The handler function's "this" context.</li>
450      * <li>delegate {String} A simple selector to filter the target or look for a descendant of the target</li>
451      * <li>stopEvent {Boolean} True to stop the event. That is stop propagation, and prevent the default action.</li>
452      * <li>preventDefault {Boolean} True to prevent the default action</li>
453      * <li>stopPropagation {Boolean} True to prevent event propagation</li>
454      * <li>normalized {Boolean} False to pass a browser event to the handler function instead of an Roo.EventObject</li>
455      * <li>delay {Number} The number of milliseconds to delay the invocation of the handler after te event fires.</li>
456      * <li>single {Boolean} True to add a handler to handle just the next firing of the event, and then remove itself.</li>
457      * <li>buffer {Number} Causes the handler to be scheduled to run in an {@link Roo.util.DelayedTask} delayed
458      * by the specified number of milliseconds. If the event fires again within that time, the original
459      * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</li>
460      * </ul><br>
461      * <p>
462      * <b>Combining Options</b><br>
463      * Using the options argument, it is possible to combine different types of listeners:<br>
464      * <br>
465      * A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)<div style="margin: 5px 20px 20px;">
466      * Code:<pre><code>
467 el.on('click', this.onClick, this, {
468     single: true,
469     delay: 100,
470     stopEvent : true,
471     forumId: 4
472 });</code></pre>
473      * <p>
474      * <b>Attaching multiple handlers in 1 call</b><br>
475       * The method also allows for a single argument to be passed which is a config object containing properties
476      * which specify multiple handlers.
477      * <p>
478      * Code:<pre><code>
479 el.on({
480     'click' : {
481         fn: this.onClick
482         scope: this,
483         delay: 100
484     },
485     'mouseover' : {
486         fn: this.onMouseOver
487         scope: this
488     },
489     'mouseout' : {
490         fn: this.onMouseOut
491         scope: this
492     }
493 });</code></pre>
494      * <p>
495      * Or a shorthand syntax:<br>
496      * Code:<pre><code>
497 el.on({
498     'click' : this.onClick,
499     'mouseover' : this.onMouseOver,
500     'mouseout' : this.onMouseOut
501     scope: this
502 });</code></pre>
503      */
504     pub.on = pub.addListener;
505     pub.un = pub.removeListener;
506
507     pub.stoppedMouseDownEvent = new Roo.util.Event();
508     return pub;
509 }();
510 /**
511   * Fires when the document is ready (before onload and before images are loaded).  Shorthand of {@link Roo.EventManager#onDocumentReady}.
512   * @param {Function} fn        The method the event invokes
513   * @param {Object}   scope    An  object that becomes the scope of the handler
514   * @param {boolean}  override If true, the obj passed in becomes
515   *                             the execution scope of the listener
516   * @member Roo
517   * @method onReady
518  */
519 Roo.onReady = Roo.EventManager.onDocumentReady;
520
521 Roo.onReady(function(){
522     var bd = Roo.get(document.body);
523     if(!bd){ return; }
524
525     var cls = [
526             Roo.isIE ? "roo-ie"
527             : Roo.isGecko ? "roo-gecko"
528             : Roo.isOpera ? "roo-opera"
529             : Roo.isSafari ? "roo-safari" : ""];
530
531     if(Roo.isMac){
532         cls.push("roo-mac");
533     }
534     if(Roo.isLinux){
535         cls.push("roo-linux");
536     }
537     if(Roo.isBorderBox){
538         cls.push('roo-border-box');
539     }
540     if(Roo.isStrict){ // add to the parent to allow for selectors like ".ext-strict .ext-ie"
541         var p = bd.dom.parentNode;
542         if(p){
543             p.className += ' roo-strict';
544         }
545     }
546     bd.addClass(cls.join(' '));
547 });
548
549 /**
550  * @class Roo.EventObject
551  * EventObject exposes the Yahoo! UI Event functionality directly on the object
552  * passed to your event handler. It exists mostly for convenience. It also fixes the annoying null checks automatically to cleanup your code 
553  * Example:
554  * <pre><code>
555  function handleClick(e){ // e is not a standard event object, it is a Roo.EventObject
556     e.preventDefault();
557     var target = e.getTarget();
558     ...
559  }
560  var myDiv = Roo.get("myDiv");
561  myDiv.on("click", handleClick);
562  //or
563  Roo.EventManager.on("myDiv", 'click', handleClick);
564  Roo.EventManager.addListener("myDiv", 'click', handleClick);
565  </code></pre>
566  * @singleton
567  */
568 Roo.EventObject = function(){
569     
570     var E = Roo.lib.Event;
571     
572     // safari keypress events for special keys return bad keycodes
573     var safariKeys = {
574         63234 : 37, // left
575         63235 : 39, // right
576         63232 : 38, // up
577         63233 : 40, // down
578         63276 : 33, // page up
579         63277 : 34, // page down
580         63272 : 46, // delete
581         63273 : 36, // home
582         63275 : 35  // end
583     };
584
585     // normalize button clicks
586     var btnMap = Roo.isIE ? {1:0,4:1,2:2} :
587                 (Roo.isSafari ? {1:0,2:1,3:2} : {0:0,1:1,2:2});
588
589     Roo.EventObjectImpl = function(e){
590         if(e){
591             this.setEvent(e.browserEvent || e);
592         }
593     };
594     Roo.EventObjectImpl.prototype = {
595         /**
596          * Used to fix doc tools.
597          * @scope Roo.EventObject.prototype
598          */
599             
600
601         
602         
603         /** The normal browser event */
604         browserEvent : null,
605         /** The button pressed in a mouse event */
606         button : -1,
607         /** True if the shift key was down during the event */
608         shiftKey : false,
609         /** True if the control key was down during the event */
610         ctrlKey : false,
611         /** True if the alt key was down during the event */
612         altKey : false,
613
614         /** Key constant 
615         * @type Number */
616         BACKSPACE : 8,
617         /** Key constant 
618         * @type Number */
619         TAB : 9,
620         /** Key constant 
621         * @type Number */
622         RETURN : 13,
623         /** Key constant 
624         * @type Number */
625         ENTER : 13,
626         /** Key constant 
627         * @type Number */
628         SHIFT : 16,
629         /** Key constant 
630         * @type Number */
631         CONTROL : 17,
632         /** Key constant 
633         * @type Number */
634         ESC : 27,
635         /** Key constant 
636         * @type Number */
637         SPACE : 32,
638         /** Key constant 
639         * @type Number */
640         PAGEUP : 33,
641         /** Key constant 
642         * @type Number */
643         PAGEDOWN : 34,
644         /** Key constant 
645         * @type Number */
646         END : 35,
647         /** Key constant 
648         * @type Number */
649         HOME : 36,
650         /** Key constant 
651         * @type Number */
652         LEFT : 37,
653         /** Key constant 
654         * @type Number */
655         UP : 38,
656         /** Key constant 
657         * @type Number */
658         RIGHT : 39,
659         /** Key constant 
660         * @type Number */
661         DOWN : 40,
662         /** Key constant 
663         * @type Number */
664         DELETE : 46,
665         /** Key constant 
666         * @type Number */
667         F5 : 116,
668
669            /** @private */
670         setEvent : function(e){
671             if(e == this || (e && e.browserEvent)){ // already wrapped
672                 return e;
673             }
674             this.browserEvent = e;
675             if(e){
676                 // normalize buttons
677                 this.button = e.button ? btnMap[e.button] : (e.which ? e.which-1 : -1);
678                 if(e.type == 'click' && this.button == -1){
679                     this.button = 0;
680                 }
681                 this.type = e.type;
682                 this.shiftKey = e.shiftKey;
683                 // mac metaKey behaves like ctrlKey
684                 this.ctrlKey = e.ctrlKey || e.metaKey;
685                 this.altKey = e.altKey;
686                 // in getKey these will be normalized for the mac
687                 this.keyCode = e.keyCode;
688                 // keyup warnings on firefox.
689                 this.charCode = (e.type == 'keyup' || e.type == 'keydown') ? 0 : e.charCode;
690                 // cache the target for the delayed and or buffered events
691                 this.target = E.getTarget(e);
692                 // same for XY
693                 this.xy = E.getXY(e);
694             }else{
695                 this.button = -1;
696                 this.shiftKey = false;
697                 this.ctrlKey = false;
698                 this.altKey = false;
699                 this.keyCode = 0;
700                 this.charCode =0;
701                 this.target = null;
702                 this.xy = [0, 0];
703             }
704             return this;
705         },
706
707         /**
708          * Stop the event (preventDefault and stopPropagation)
709          */
710         stopEvent : function(){
711             if(this.browserEvent){
712                 if(this.browserEvent.type == 'mousedown'){
713                     Roo.EventManager.stoppedMouseDownEvent.fire(this);
714                 }
715                 E.stopEvent(this.browserEvent);
716             }
717         },
718
719         /**
720          * Prevents the browsers default handling of the event.
721          */
722         preventDefault : function(){
723             if(this.browserEvent){
724                 E.preventDefault(this.browserEvent);
725             }
726         },
727
728         /** @private */
729         isNavKeyPress : function(){
730             var k = this.keyCode;
731             k = Roo.isSafari ? (safariKeys[k] || k) : k;
732             return (k >= 33 && k <= 40) || k == this.RETURN || k == this.TAB || k == this.ESC;
733         },
734
735         isSpecialKey : function(){
736             var k = this.keyCode;
737             return (this.type == 'keypress' && this.ctrlKey) || k == 9 || k == 13  || k == 40 || k == 27 ||
738             (k == 16) || (k == 17) ||
739             (k >= 18 && k <= 20) ||
740             (k >= 33 && k <= 35) ||
741             (k >= 36 && k <= 39) ||
742             (k >= 44 && k <= 45);
743         },
744         /**
745          * Cancels bubbling of the event.
746          */
747         stopPropagation : function(){
748             if(this.browserEvent){
749                 if(this.type == 'mousedown'){
750                     Roo.EventManager.stoppedMouseDownEvent.fire(this);
751                 }
752                 E.stopPropagation(this.browserEvent);
753             }
754         },
755
756         /**
757          * Gets the key code for the event.
758          * @return {Number}
759          */
760         getCharCode : function(){
761             return this.charCode || this.keyCode;
762         },
763
764         /**
765          * Returns a normalized keyCode for the event.
766          * @return {Number} The key code
767          */
768         getKey : function(){
769             var k = this.keyCode || this.charCode;
770             return Roo.isSafari ? (safariKeys[k] || k) : k;
771         },
772
773         /**
774          * Gets the x coordinate of the event.
775          * @return {Number}
776          */
777         getPageX : function(){
778             return this.xy[0];
779         },
780
781         /**
782          * Gets the y coordinate of the event.
783          * @return {Number}
784          */
785         getPageY : function(){
786             return this.xy[1];
787         },
788
789         /**
790          * Gets the time of the event.
791          * @return {Number}
792          */
793         getTime : function(){
794             if(this.browserEvent){
795                 return E.getTime(this.browserEvent);
796             }
797             return null;
798         },
799
800         /**
801          * Gets the page coordinates of the event.
802          * @return {Array} The xy values like [x, y]
803          */
804         getXY : function(){
805             return this.xy;
806         },
807
808         /**
809          * Gets the target for the event.
810          * @param {String} selector (optional) A simple selector to filter the target or look for an ancestor of the target
811          * @param {Number/String/HTMLElement/Element} maxDepth (optional) The max depth to
812                 search as a number or element (defaults to 10 || document.body)
813          * @param {Boolean} returnEl (optional) True to return a Roo.Element object instead of DOM node
814          * @return {HTMLelement}
815          */
816         getTarget : function(selector, maxDepth, returnEl){
817             return selector ? Roo.fly(this.target).findParent(selector, maxDepth, returnEl) : this.target;
818         },
819         /**
820          * Gets the related target.
821          * @return {HTMLElement}
822          */
823         getRelatedTarget : function(){
824             if(this.browserEvent){
825                 return E.getRelatedTarget(this.browserEvent);
826             }
827             return null;
828         },
829
830         /**
831          * Normalizes mouse wheel delta across browsers
832          * @return {Number} The delta
833          */
834         getWheelDelta : function(){
835             var e = this.browserEvent;
836             var delta = 0;
837             if(e.wheelDelta){ /* IE/Opera. */
838                 delta = e.wheelDelta/120;
839             }else if(e.detail){ /* Mozilla case. */
840                 delta = -e.detail/3;
841             }
842             return delta;
843         },
844
845         /**
846          * Returns true if the control, meta, shift or alt key was pressed during this event.
847          * @return {Boolean}
848          */
849         hasModifier : function(){
850             return !!((this.ctrlKey || this.altKey) || this.shiftKey);
851         },
852
853         /**
854          * Returns true if the target of this event equals el or is a child of el
855          * @param {String/HTMLElement/Element} el
856          * @param {Boolean} related (optional) true to test if the related target is within el instead of the target
857          * @return {Boolean}
858          */
859         within : function(el, related){
860             var t = this[related ? "getRelatedTarget" : "getTarget"]();
861             return t && Roo.fly(el).contains(t);
862         },
863
864         getPoint : function(){
865             return new Roo.lib.Point(this.xy[0], this.xy[1]);
866         }
867     };
868
869     return new Roo.EventObjectImpl();
870 }();
871             
872