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