docs/source/EventObject.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   5   <title>The source code</title>
   6   <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
   7   <script type="text/javascript" src="../prettify/prettify.js"></script>
   8   <style type="text/css">
   9     .highlight { display: block; background-color: #ddd; }
  10   </style>
  11   <script type="text/javascript">
  12     function highlight() {
  13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14     }
  15   </script>
  16 </head>
  17 <body onload="prettyPrint(); highlight();">
  18   <pre class="prettyprint lang-js"><span id='Ext-EventObject'>/**
  19 </span> * @class Ext.EventObject
  20
  21 Just as {@link Ext.core.Element} wraps around a native DOM node, Ext.EventObject
  22 wraps the browser's native event-object normalizing cross-browser differences,
  23 such as which mouse button is clicked, keys pressed, mechanisms to stop
  24 event-propagation along with a method to prevent default actions from taking place.
  25
  26 For example:
  27
  28     function handleClick(e, t){ // e is not a standard event object, it is a Ext.EventObject
  29         e.preventDefault();
  30         var target = e.getTarget(); // same as t (the target HTMLElement)
  31         ...
  32     }
  33
  34     var myDiv = {@link Ext#get Ext.get}(&quot;myDiv&quot;);  // get reference to an {@link Ext.core.Element}
  35     myDiv.on(         // 'on' is shorthand for addListener
  36         &quot;click&quot;,      // perform an action on click of myDiv
  37         handleClick   // reference to the action handler
  38     );
  39
  40     // other methods to do the same:
  41     Ext.EventManager.on(&quot;myDiv&quot;, 'click', handleClick);
  42     Ext.EventManager.addListener(&quot;myDiv&quot;, 'click', handleClick);
  43
  44  * @singleton
  45  * @markdown
  46  */
  47 Ext.define('Ext.EventObjectImpl', {
  48     uses: ['Ext.util.Point'],
  49
  50 <span id='Ext-EventObject-property-BACKSPACE'>    /** Key constant @type Number */
  51 </span>    BACKSPACE: 8,
  52 <span id='Ext-EventObject-property-TAB'>    /** Key constant @type Number */
  53 </span>    TAB: 9,
  54 <span id='Ext-EventObject-property-NUM_CENTER'>    /** Key constant @type Number */
  55 </span>    NUM_CENTER: 12,
  56 <span id='Ext-EventObject-property-ENTER'>    /** Key constant @type Number */
  57 </span>    ENTER: 13,
  58 <span id='Ext-EventObject-property-RETURN'>    /** Key constant @type Number */
  59 </span>    RETURN: 13,
  60 <span id='Ext-EventObject-property-SHIFT'>    /** Key constant @type Number */
  61 </span>    SHIFT: 16,
  62 <span id='Ext-EventObject-property-CTRL'>    /** Key constant @type Number */
  63 </span>    CTRL: 17,
  64 <span id='Ext-EventObject-property-ALT'>    /** Key constant @type Number */
  65 </span>    ALT: 18,
  66 <span id='Ext-EventObject-property-PAUSE'>    /** Key constant @type Number */
  67 </span>    PAUSE: 19,
  68 <span id='Ext-EventObject-property-CAPS_LOCK'>    /** Key constant @type Number */
  69 </span>    CAPS_LOCK: 20,
  70 <span id='Ext-EventObject-property-ESC'>    /** Key constant @type Number */
  71 </span>    ESC: 27,
  72 <span id='Ext-EventObject-property-SPACE'>    /** Key constant @type Number */
  73 </span>    SPACE: 32,
  74 <span id='Ext-EventObject-property-PAGE_UP'>    /** Key constant @type Number */
  75 </span>    PAGE_UP: 33,
  76 <span id='Ext-EventObject-property-PAGE_DOWN'>    /** Key constant @type Number */
  77 </span>    PAGE_DOWN: 34,
  78 <span id='Ext-EventObject-property-END'>    /** Key constant @type Number */
  79 </span>    END: 35,
  80 <span id='Ext-EventObject-property-HOME'>    /** Key constant @type Number */
  81 </span>    HOME: 36,
  82 <span id='Ext-EventObject-property-LEFT'>    /** Key constant @type Number */
  83 </span>    LEFT: 37,
  84 <span id='Ext-EventObject-property-UP'>    /** Key constant @type Number */
  85 </span>    UP: 38,
  86 <span id='Ext-EventObject-property-RIGHT'>    /** Key constant @type Number */
  87 </span>    RIGHT: 39,
  88 <span id='Ext-EventObject-property-DOWN'>    /** Key constant @type Number */
  89 </span>    DOWN: 40,
  90 <span id='Ext-EventObject-property-PRINT_SCREEN'>    /** Key constant @type Number */
  91 </span>    PRINT_SCREEN: 44,
  92 <span id='Ext-EventObject-property-INSERT'>    /** Key constant @type Number */
  93 </span>    INSERT: 45,
  94 <span id='Ext-EventObject-property-DELETE'>    /** Key constant @type Number */
  95 </span>    DELETE: 46,
  96 <span id='Ext-EventObject-property-ZERO'>    /** Key constant @type Number */
  97 </span>    ZERO: 48,
  98 <span id='Ext-EventObject-property-ONE'>    /** Key constant @type Number */
  99 </span>    ONE: 49,
 100 <span id='Ext-EventObject-property-TWO'>    /** Key constant @type Number */
 101 </span>    TWO: 50,
 102 <span id='Ext-EventObject-property-THREE'>    /** Key constant @type Number */
 103 </span>    THREE: 51,
 104 <span id='Ext-EventObject-property-FOUR'>    /** Key constant @type Number */
 105 </span>    FOUR: 52,
 106 <span id='Ext-EventObject-property-FIVE'>    /** Key constant @type Number */
 107 </span>    FIVE: 53,
 108 <span id='Ext-EventObject-property-SIX'>    /** Key constant @type Number */
 109 </span>    SIX: 54,
 110 <span id='Ext-EventObject-property-SEVEN'>    /** Key constant @type Number */
 111 </span>    SEVEN: 55,
 112 <span id='Ext-EventObject-property-EIGHT'>    /** Key constant @type Number */
 113 </span>    EIGHT: 56,
 114 <span id='Ext-EventObject-property-NINE'>    /** Key constant @type Number */
 115 </span>    NINE: 57,
 116 <span id='Ext-EventObject-property-A'>    /** Key constant @type Number */
 117 </span>    A: 65,
 118 <span id='Ext-EventObject-property-B'>    /** Key constant @type Number */
 119 </span>    B: 66,
 120 <span id='Ext-EventObject-property-C'>    /** Key constant @type Number */
 121 </span>    C: 67,
 122 <span id='Ext-EventObject-property-D'>    /** Key constant @type Number */
 123 </span>    D: 68,
 124 <span id='Ext-EventObject-property-E'>    /** Key constant @type Number */
 125 </span>    E: 69,
 126 <span id='Ext-EventObject-property-F'>    /** Key constant @type Number */
 127 </span>    F: 70,
 128 <span id='Ext-EventObject-property-G'>    /** Key constant @type Number */
 129 </span>    G: 71,
 130 <span id='Ext-EventObject-property-H'>    /** Key constant @type Number */
 131 </span>    H: 72,
 132 <span id='Ext-EventObject-property-I'>    /** Key constant @type Number */
 133 </span>    I: 73,
 134 <span id='Ext-EventObject-property-J'>    /** Key constant @type Number */
 135 </span>    J: 74,
 136 <span id='Ext-EventObject-property-K'>    /** Key constant @type Number */
 137 </span>    K: 75,
 138 <span id='Ext-EventObject-property-L'>    /** Key constant @type Number */
 139 </span>    L: 76,
 140 <span id='Ext-EventObject-property-M'>    /** Key constant @type Number */
 141 </span>    M: 77,
 142 <span id='Ext-EventObject-property-N'>    /** Key constant @type Number */
 143 </span>    N: 78,
 144 <span id='Ext-EventObject-property-O'>    /** Key constant @type Number */
 145 </span>    O: 79,
 146 <span id='Ext-EventObject-property-P'>    /** Key constant @type Number */
 147 </span>    P: 80,
 148 <span id='Ext-EventObject-property-Q'>    /** Key constant @type Number */
 149 </span>    Q: 81,
 150 <span id='Ext-EventObject-property-R'>    /** Key constant @type Number */
 151 </span>    R: 82,
 152 <span id='Ext-EventObject-property-S'>    /** Key constant @type Number */
 153 </span>    S: 83,
 154 <span id='Ext-EventObject-property-T'>    /** Key constant @type Number */
 155 </span>    T: 84,
 156 <span id='Ext-EventObject-property-U'>    /** Key constant @type Number */
 157 </span>    U: 85,
 158 <span id='Ext-EventObject-property-V'>    /** Key constant @type Number */
 159 </span>    V: 86,
 160 <span id='Ext-EventObject-property-W'>    /** Key constant @type Number */
 161 </span>    W: 87,
 162 <span id='Ext-EventObject-property-X'>    /** Key constant @type Number */
 163 </span>    X: 88,
 164 <span id='Ext-EventObject-property-Y'>    /** Key constant @type Number */
 165 </span>    Y: 89,
 166 <span id='Ext-EventObject-property-Z'>    /** Key constant @type Number */
 167 </span>    Z: 90,
 168 <span id='Ext-EventObject-property-CONTEXT_MENU'>    /** Key constant @type Number */
 169 </span>    CONTEXT_MENU: 93,
 170 <span id='Ext-EventObject-property-NUM_ZERO'>    /** Key constant @type Number */
 171 </span>    NUM_ZERO: 96,
 172 <span id='Ext-EventObject-property-NUM_ONE'>    /** Key constant @type Number */
 173 </span>    NUM_ONE: 97,
 174 <span id='Ext-EventObject-property-NUM_TWO'>    /** Key constant @type Number */
 175 </span>    NUM_TWO: 98,
 176 <span id='Ext-EventObject-property-NUM_THREE'>    /** Key constant @type Number */
 177 </span>    NUM_THREE: 99,
 178 <span id='Ext-EventObject-property-NUM_FOUR'>    /** Key constant @type Number */
 179 </span>    NUM_FOUR: 100,
 180 <span id='Ext-EventObject-property-NUM_FIVE'>    /** Key constant @type Number */
 181 </span>    NUM_FIVE: 101,
 182 <span id='Ext-EventObject-property-NUM_SIX'>    /** Key constant @type Number */
 183 </span>    NUM_SIX: 102,
 184 <span id='Ext-EventObject-property-NUM_SEVEN'>    /** Key constant @type Number */
 185 </span>    NUM_SEVEN: 103,
 186 <span id='Ext-EventObject-property-NUM_EIGHT'>    /** Key constant @type Number */
 187 </span>    NUM_EIGHT: 104,
 188 <span id='Ext-EventObject-property-NUM_NINE'>    /** Key constant @type Number */
 189 </span>    NUM_NINE: 105,
 190 <span id='Ext-EventObject-property-NUM_MULTIPLY'>    /** Key constant @type Number */
 191 </span>    NUM_MULTIPLY: 106,
 192 <span id='Ext-EventObject-property-NUM_PLUS'>    /** Key constant @type Number */
 193 </span>    NUM_PLUS: 107,
 194 <span id='Ext-EventObject-property-NUM_MINUS'>    /** Key constant @type Number */
 195 </span>    NUM_MINUS: 109,
 196 <span id='Ext-EventObject-property-NUM_PERIOD'>    /** Key constant @type Number */
 197 </span>    NUM_PERIOD: 110,
 198 <span id='Ext-EventObject-property-NUM_DIVISION'>    /** Key constant @type Number */
 199 </span>    NUM_DIVISION: 111,
 200 <span id='Ext-EventObject-property-F1'>    /** Key constant @type Number */
 201 </span>    F1: 112,
 202 <span id='Ext-EventObject-property-F2'>    /** Key constant @type Number */
 203 </span>    F2: 113,
 204 <span id='Ext-EventObject-property-F3'>    /** Key constant @type Number */
 205 </span>    F3: 114,
 206 <span id='Ext-EventObject-property-F4'>    /** Key constant @type Number */
 207 </span>    F4: 115,
 208 <span id='Ext-EventObject-property-F5'>    /** Key constant @type Number */
 209 </span>    F5: 116,
 210 <span id='Ext-EventObject-property-F6'>    /** Key constant @type Number */
 211 </span>    F6: 117,
 212 <span id='Ext-EventObject-property-F7'>    /** Key constant @type Number */
 213 </span>    F7: 118,
 214 <span id='Ext-EventObject-property-F8'>    /** Key constant @type Number */
 215 </span>    F8: 119,
 216 <span id='Ext-EventObject-property-F9'>    /** Key constant @type Number */
 217 </span>    F9: 120,
 218 <span id='Ext-EventObject-property-F10'>    /** Key constant @type Number */
 219 </span>    F10: 121,
 220 <span id='Ext-EventObject-property-F11'>    /** Key constant @type Number */
 221 </span>    F11: 122,
 222 <span id='Ext-EventObject-property-F12'>    /** Key constant @type Number */
 223 </span>    F12: 123,
 224
 225 <span id='Ext-EventObject-property-clickRe'>    /**
 226 </span>     * Simple click regex
 227      * @private
 228      */
 229     clickRe: /(dbl)?click/,
 230     // safari keypress events for special keys return bad keycodes
 231     safariKeys: {
 232         3: 13, // enter
 233         63234: 37, // left
 234         63235: 39, // right
 235         63232: 38, // up
 236         63233: 40, // down
 237         63276: 33, // page up
 238         63277: 34, // page down
 239         63272: 46, // delete
 240         63273: 36, // home
 241         63275: 35 // end
 242     },
 243     // normalize button clicks, don't see any way to feature detect this.
 244     btnMap: Ext.isIE ? {
 245         1: 0,
 246         4: 1,
 247         2: 2
 248     } : {
 249         0: 0,
 250         1: 1,
 251         2: 2
 252     },
 253
 254     constructor: function(event, freezeEvent){
 255         if (event) {
 256             this.setEvent(event.browserEvent || event, freezeEvent);
 257         }
 258     },
 259
 260     setEvent: function(event, freezeEvent){
 261         var me = this, button, options;
 262
 263         if (event == me || (event &amp;&amp; event.browserEvent)) { // already wrapped
 264             return event;
 265         }
 266         me.browserEvent = event;
 267         if (event) {
 268             // normalize buttons
 269             button = event.button ? me.btnMap[event.button] : (event.which ? event.which - 1 : -1);
 270             if (me.clickRe.test(event.type) &amp;&amp; button == -1) {
 271                 button = 0;
 272             }
 273             options = {
 274                 type: event.type,
 275                 button: button,
 276                 shiftKey: event.shiftKey,
 277                 // mac metaKey behaves like ctrlKey
 278                 ctrlKey: event.ctrlKey || event.metaKey || false,
 279                 altKey: event.altKey,
 280                 // in getKey these will be normalized for the mac
 281                 keyCode: event.keyCode,
 282                 charCode: event.charCode,
 283                 // cache the targets for the delayed and or buffered events
 284                 target: Ext.EventManager.getTarget(event),
 285                 relatedTarget: Ext.EventManager.getRelatedTarget(event),
 286                 currentTarget: event.currentTarget,
 287                 xy: (freezeEvent ? me.getXY() : null)
 288             };
 289         } else {
 290             options = {
 291                 button: -1,
 292                 shiftKey: false,
 293                 ctrlKey: false,
 294                 altKey: false,
 295                 keyCode: 0,
 296                 charCode: 0,
 297                 target: null,
 298                 xy: [0, 0]
 299             };
 300         }
 301         Ext.apply(me, options);
 302         return me;
 303     },
 304
 305 <span id='Ext-EventObject-method-stopEvent'>    /**
 306 </span>     * Stop the event (preventDefault and stopPropagation)
 307      */
 308     stopEvent: function(){
 309         this.stopPropagation();
 310         this.preventDefault();
 311     },
 312
 313 <span id='Ext-EventObject-method-preventDefault'>    /**
 314 </span>     * Prevents the browsers default handling of the event.
 315      */
 316     preventDefault: function(){
 317         if (this.browserEvent) {
 318             Ext.EventManager.preventDefault(this.browserEvent);
 319         }
 320     },
 321
 322 <span id='Ext-EventObject-method-stopPropagation'>    /**
 323 </span>     * Cancels bubbling of the event.
 324      */
 325     stopPropagation: function(){
 326         var browserEvent = this.browserEvent;
 327
 328         if (browserEvent) {
 329             if (browserEvent.type == 'mousedown') {
 330                 Ext.EventManager.stoppedMouseDownEvent.fire(this);
 331             }
 332             Ext.EventManager.stopPropagation(browserEvent);
 333         }
 334     },
 335
 336 <span id='Ext-EventObject-method-getCharCode'>    /**
 337 </span>     * Gets the character code for the event.
 338      * @return {Number}
 339      */
 340     getCharCode: function(){
 341         return this.charCode || this.keyCode;
 342     },
 343
 344 <span id='Ext-EventObject-method-getKey'>    /**
 345 </span>     * Returns a normalized keyCode for the event.
 346      * @return {Number} The key code
 347      */
 348     getKey: function(){
 349         return this.normalizeKey(this.keyCode || this.charCode);
 350     },
 351
 352 <span id='Ext-EventObject-method-normalizeKey'>    /**
 353 </span>     * Normalize key codes across browsers
 354      * @private
 355      * @param {Number} key The key code
 356      * @return {Number} The normalized code
 357      */
 358     normalizeKey: function(key){
 359         // can't feature detect this
 360         return Ext.isWebKit ? (this.safariKeys[key] || key) : key;
 361     },
 362
 363 <span id='Ext-EventObject-method-getPageX'>    /**
 364 </span>     * Gets the x coordinate of the event.
 365      * @return {Number}
 366      * @deprecated 4.0 Replaced by {@link #getX}
 367      */
 368     getPageX: function(){
 369         return this.getX();
 370     },
 371
 372 <span id='Ext-EventObject-method-getPageY'>    /**
 373 </span>     * Gets the y coordinate of the event.
 374      * @return {Number}
 375      * @deprecated 4.0 Replaced by {@link #getY}
 376      */
 377     getPageY: function(){
 378         return this.getY();
 379     },
 380
 381 <span id='Ext-EventObject-method-getX'>    /**
 382 </span>     * Gets the x coordinate of the event.
 383      * @return {Number}
 384      */
 385     getX: function() {
 386         return this.getXY()[0];
 387     },
 388
 389 <span id='Ext-EventObject-method-getY'>    /**
 390 </span>     * Gets the y coordinate of the event.
 391      * @return {Number}
 392      */
 393     getY: function() {
 394         return this.getXY()[1];
 395     },
 396
 397 <span id='Ext-EventObject-method-getXY'>    /**
 398 </span>     * Gets the page coordinates of the event.
 399      * @return {Array} The xy values like [x, y]
 400      */
 401     getXY: function() {
 402         if (!this.xy) {
 403             // same for XY
 404             this.xy = Ext.EventManager.getPageXY(this.browserEvent);
 405         }
 406         return this.xy;
 407     },
 408
 409 <span id='Ext-EventObject-method-getTarget'>    /**
 410 </span>     * Gets the target for the event.
 411      * @param {String} selector (optional) A simple selector to filter the target or look for an ancestor of the target
 412      * @param {Number/Mixed} maxDepth (optional) The max depth to search as a number or element (defaults to 10 || document.body)
 413      * @param {Boolean} returnEl (optional) True to return a Ext.core.Element object instead of DOM node
 414      * @return {HTMLelement}
 415      */
 416     getTarget : function(selector, maxDepth, returnEl){
 417         if (selector) {
 418             return Ext.fly(this.target).findParent(selector, maxDepth, returnEl);
 419         }
 420         return returnEl ? Ext.get(this.target) : this.target;
 421     },
 422
 423 <span id='Ext-EventObject-method-getRelatedTarget'>    /**
 424 </span>     * Gets the related target.
 425      * @param {String} selector (optional) A simple selector to filter the target or look for an ancestor of the target
 426      * @param {Number/Mixed} maxDepth (optional) The max depth to search as a number or element (defaults to 10 || document.body)
 427      * @param {Boolean} returnEl (optional) True to return a Ext.core.Element object instead of DOM node
 428      * @return {HTMLElement}
 429      */
 430     getRelatedTarget : function(selector, maxDepth, returnEl){
 431         if (selector) {
 432             return Ext.fly(this.relatedTarget).findParent(selector, maxDepth, returnEl);
 433         }
 434         return returnEl ? Ext.get(this.relatedTarget) : this.relatedTarget;
 435     },
 436
 437 <span id='Ext-EventObject-method-getWheelDelta'>    /**
 438 </span>     * Normalizes mouse wheel delta across browsers
 439      * @return {Number} The delta
 440      */
 441     getWheelDelta : function(){
 442         var event = this.browserEvent,
 443             delta = 0;
 444
 445         if (event.wheelDelta) { /* IE/Opera. */
 446             delta = event.wheelDelta / 120;
 447         } else if (event.detail){ /* Mozilla case. */
 448             delta = -event.detail / 3;
 449         }
 450         return delta;
 451     },
 452
 453 <span id='Ext-EventObject-method-within'>    /**
 454 </span>    * 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.
 455     * Example usage:&lt;pre&gt;&lt;code&gt;
 456 // Handle click on any child of an element
 457 Ext.getBody().on('click', function(e){
 458     if(e.within('some-el')){
 459         alert('Clicked on a child of some-el!');
 460     }
 461 });
 462
 463 // Handle click directly on an element, ignoring clicks on child nodes
 464 Ext.getBody().on('click', function(e,t){
 465     if((t.id == 'some-el') &amp;&amp; !e.within(t, true)){
 466         alert('Clicked directly on some-el!');
 467     }
 468 });
 469 &lt;/code&gt;&lt;/pre&gt;
 470      * @param {Mixed} el The id, DOM element or Ext.core.Element to check
 471      * @param {Boolean} related (optional) true to test if the related target is within el instead of the target
 472      * @param {Boolean} allowEl {optional} true to also check if the passed element is the target or related target
 473      * @return {Boolean}
 474      */
 475     within : function(el, related, allowEl){
 476         if(el){
 477             var t = related ? this.getRelatedTarget() : this.getTarget(),
 478                 result;
 479
 480             if (t) {
 481                 result = Ext.fly(el).contains(t);
 482                 if (!result &amp;&amp; allowEl) {
 483                     result = t == Ext.getDom(el);
 484                 }
 485                 return result;
 486             }
 487         }
 488         return false;
 489     },
 490
 491 <span id='Ext-EventObject-method-isNavKeyPress'>    /**
 492 </span>     * Checks if the key pressed was a &quot;navigation&quot; key
 493      * @return {Boolean} True if the press is a navigation keypress
 494      */
 495     isNavKeyPress : function(){
 496         var me = this,
 497             k = this.normalizeKey(me.keyCode);
 498
 499        return (k &gt;= 33 &amp;&amp; k &lt;= 40) ||  // Page Up/Down, End, Home, Left, Up, Right, Down
 500        k == me.RETURN ||
 501        k == me.TAB ||
 502        k == me.ESC;
 503     },
 504
 505 <span id='Ext-EventObject-method-isSpecialKey'>    /**
 506 </span>     * Checks if the key pressed was a &quot;special&quot; key
 507      * @return {Boolean} True if the press is a special keypress
 508      */
 509     isSpecialKey : function(){
 510         var k = this.normalizeKey(this.keyCode);
 511         return (this.type == 'keypress' &amp;&amp; this.ctrlKey) ||
 512         this.isNavKeyPress() ||
 513         (k == this.BACKSPACE) || // Backspace
 514         (k &gt;= 16 &amp;&amp; k &lt;= 20) || // Shift, Ctrl, Alt, Pause, Caps Lock
 515         (k &gt;= 44 &amp;&amp; k &lt;= 46);   // Print Screen, Insert, Delete
 516     },
 517
 518 <span id='Ext-EventObject-method-getPoint'>    /**
 519 </span>     * Returns a point object that consists of the object coordinates.
 520      * @return {Ext.util.Point} point
 521      */
 522     getPoint : function(){
 523         var xy = this.getXY();
 524         return Ext.create('Ext.util.Point', xy[0], xy[1]);
 525     },
 526
 527 <span id='Ext-EventObject-method-hasModifier'>   /**
 528 </span>    * Returns true if the control, meta, shift or alt key was pressed during this event.
 529     * @return {Boolean}
 530     */
 531     hasModifier : function(){
 532         return this.ctrlKey || this.altKey || this.shiftKey || this.metaKey;
 533     },
 534
 535 <span id='Ext-EventObject-method-injectEvent'>    /**
 536 </span>     * Injects a DOM event using the data in this object and (optionally) a new target.
 537      * This is a low-level technique and not likely to be used by application code. The
 538      * currently supported event types are:
 539      * &lt;p&gt;&lt;b&gt;HTMLEvents&lt;/b&gt;&lt;/p&gt;
 540      * &lt;ul&gt;
 541      * &lt;li&gt;load&lt;/li&gt;
 542      * &lt;li&gt;unload&lt;/li&gt;
 543      * &lt;li&gt;select&lt;/li&gt;
 544      * &lt;li&gt;change&lt;/li&gt;
 545      * &lt;li&gt;submit&lt;/li&gt;
 546      * &lt;li&gt;reset&lt;/li&gt;
 547      * &lt;li&gt;resize&lt;/li&gt;
 548      * &lt;li&gt;scroll&lt;/li&gt;
 549      * &lt;/ul&gt;
 550      * &lt;p&gt;&lt;b&gt;MouseEvents&lt;/b&gt;&lt;/p&gt;
 551      * &lt;ul&gt;
 552      * &lt;li&gt;click&lt;/li&gt;
 553      * &lt;li&gt;dblclick&lt;/li&gt;
 554      * &lt;li&gt;mousedown&lt;/li&gt;
 555      * &lt;li&gt;mouseup&lt;/li&gt;
 556      * &lt;li&gt;mouseover&lt;/li&gt;
 557      * &lt;li&gt;mousemove&lt;/li&gt;
 558      * &lt;li&gt;mouseout&lt;/li&gt;
 559      * &lt;/ul&gt;
 560      * &lt;p&gt;&lt;b&gt;UIEvents&lt;/b&gt;&lt;/p&gt;
 561      * &lt;ul&gt;
 562      * &lt;li&gt;focusin&lt;/li&gt;
 563      * &lt;li&gt;focusout&lt;/li&gt;
 564      * &lt;li&gt;activate&lt;/li&gt;
 565      * &lt;li&gt;focus&lt;/li&gt;
 566      * &lt;li&gt;blur&lt;/li&gt;
 567      * &lt;/ul&gt;
 568      * @param {Element/HTMLElement} target If specified, the target for the event. This
 569      * is likely to be used when relaying a DOM event. If not specified, {@link #getTarget}
 570      * is used to determine the target.
 571      */
 572     injectEvent: function () {
 573         var API,
 574             dispatchers = {}; // keyed by event type (e.g., 'mousedown')
 575
 576         // Good reference: http://developer.yahoo.com/yui/docs/UserAction.js.html
 577
 578         // IE9 has createEvent, but this code causes major problems with htmleditor (it
 579         // blocks all mouse events and maybe more). TODO
 580
 581         if (!Ext.isIE &amp;&amp; document.createEvent) { // if (DOM compliant)
 582             API = {
 583                 createHtmlEvent: function (doc, type, bubbles, cancelable) {
 584                     var event = doc.createEvent('HTMLEvents');
 585
 586                     event.initEvent(type, bubbles, cancelable);
 587                     return event;
 588                 },
 589
 590                 createMouseEvent: function (doc, type, bubbles, cancelable, detail,
 591                                             clientX, clientY, ctrlKey, altKey, shiftKey, metaKey,
 592                                             button, relatedTarget) {
 593                     var event = doc.createEvent('MouseEvents'),
 594                         view = doc.defaultView || window;
 595
 596                     if (event.initMouseEvent) {
 597                         event.initMouseEvent(type, bubbles, cancelable, view, detail,
 598                                     clientX, clientY, clientX, clientY, ctrlKey, altKey,
 599                                     shiftKey, metaKey, button, relatedTarget);
 600                     } else { // old Safari
 601                         event = doc.createEvent('UIEvents');
 602                         event.initEvent(type, bubbles, cancelable);
 603                         event.view = view;
 604                         event.detail = detail;
 605                         event.screenX = clientX;
 606                         event.screenY = clientY;
 607                         event.clientX = clientX;
 608                         event.clientY = clientY;
 609                         event.ctrlKey = ctrlKey;
 610                         event.altKey = altKey;
 611                         event.metaKey = metaKey;
 612                         event.shiftKey = shiftKey;
 613                         event.button = button;
 614                         event.relatedTarget = relatedTarget;
 615                     }
 616
 617                     return event;
 618                 },
 619
 620                 createUIEvent: function (doc, type, bubbles, cancelable, detail) {
 621                     var event = doc.createEvent('UIEvents'),
 622                         view = doc.defaultView || window;
 623
 624                     event.initUIEvent(type, bubbles, cancelable, view, detail);
 625                     return event;
 626                 },
 627
 628                 fireEvent: function (target, type, event) {
 629                     target.dispatchEvent(event);
 630                 },
 631
 632                 fixTarget: function (target) {
 633                     // Safari3 doesn't have window.dispatchEvent()
 634                     if (target == window &amp;&amp; !target.dispatchEvent) {
 635                         return document;
 636                     }
 637
 638                     return target;
 639                 }
 640             }
 641         } else if (document.createEventObject) { // else if (IE)
 642             var crazyIEButtons = { 0: 1, 1: 4, 2: 2 };
 643
 644             API = {
 645                 createHtmlEvent: function (doc, type, bubbles, cancelable) {
 646                     var event = doc.createEventObject();
 647                     event.bubbles = bubbles;
 648                     event.cancelable = cancelable;
 649                     return event;
 650                 },
 651
 652                 createMouseEvent: function (doc, type, bubbles, cancelable, detail,
 653                                             clientX, clientY, ctrlKey, altKey, shiftKey, metaKey,
 654                                             button, relatedTarget) {
 655                     var event = doc.createEventObject();
 656                     event.bubbles = bubbles;
 657                     event.cancelable = cancelable;
 658                     event.detail = detail;
 659                     event.screenX = clientX;
 660                     event.screenY = clientY;
 661                     event.clientX = clientX;
 662                     event.clientY = clientY;
 663                     event.ctrlKey = ctrlKey;
 664                     event.altKey = altKey;
 665                     event.shiftKey = shiftKey;
 666                     event.metaKey = metaKey;
 667                     event.button = crazyIEButtons[button] || button;
 668                     event.relatedTarget = relatedTarget; // cannot assign to/fromElement
 669                     return event;
 670                 },
 671
 672                 createUIEvent: function (doc, type, bubbles, cancelable, detail) {
 673                     var event = doc.createEventObject();
 674                     event.bubbles = bubbles;
 675                     event.cancelable = cancelable;
 676                     return event;
 677                 },
 678
 679                 fireEvent: function (target, type, event) {
 680                     target.fireEvent('on' + type, event);
 681                 },
 682
 683                 fixTarget: function (target) {
 684                     if (target == document) {
 685                         // IE6,IE7 thinks window==document and doesn't have window.fireEvent()
 686                         // IE6,IE7 cannot properly call document.fireEvent()
 687                         return document.documentElement;
 688                     }
 689
 690                     return target;
 691                 }
 692             };
 693         }
 694
 695         //----------------
 696         // HTMLEvents
 697
 698         Ext.Object.each({
 699                 load:   [false, false],
 700                 unload: [false, false],
 701                 select: [true, false],
 702                 change: [true, false],
 703                 submit: [true, true],
 704                 reset:  [true, false],
 705                 resize: [true, false],
 706                 scroll: [true, false]
 707             },
 708             function (name, value) {
 709                 var bubbles = value[0], cancelable = value[1];
 710                 dispatchers[name] = function (targetEl, srcEvent) {
 711                     var e = API.createHtmlEvent(name, bubbles, cancelable);
 712                     API.fireEvent(targetEl, name, e);
 713                 };
 714             });
 715
 716         //----------------
 717         // MouseEvents
 718
 719         function createMouseEventDispatcher (type, detail) {
 720             var cancelable = (type != 'mousemove');
 721             return function (targetEl, srcEvent) {
 722                 var xy = srcEvent.getXY(),
 723                     e = API.createMouseEvent(targetEl.ownerDocument, type, true, cancelable,
 724                                 detail, xy[0], xy[1], srcEvent.ctrlKey, srcEvent.altKey,
 725                                 srcEvent.shiftKey, srcEvent.metaKey, srcEvent.button,
 726                                 srcEvent.relatedTarget);
 727                 API.fireEvent(targetEl, type, e);
 728             };
 729         }
 730
 731         Ext.each(['click', 'dblclick', 'mousedown', 'mouseup', 'mouseover', 'mousemove', 'mouseout'],
 732             function (eventName) {
 733                 dispatchers[eventName] = createMouseEventDispatcher(eventName, 1);
 734             });
 735
 736         //----------------
 737         // UIEvents
 738
 739         Ext.Object.each({
 740                 focusin:  [true, false],
 741                 focusout: [true, false],
 742                 activate: [true, true],
 743                 focus:    [false, false],
 744                 blur:     [false, false]
 745             },
 746             function (name, value) {
 747                 var bubbles = value[0], cancelable = value[1];
 748                 dispatchers[name] = function (targetEl, srcEvent) {
 749                     var e = API.createUIEvent(targetEl.ownerDocument, name, bubbles, cancelable, 1);
 750                     API.fireEvent(targetEl, name, e);
 751                 };
 752             });
 753
 754         //---------
 755         if (!API) {
 756             // not even sure what ancient browsers fall into this category...
 757
 758             dispatchers = {}; // never mind all those we just built :P
 759
 760             API = {
 761                 fixTarget: function (t) {
 762                     return t;
 763                 }
 764             };
 765         }
 766
 767         function cannotInject (target, srcEvent) {
 768             //&lt;debug&gt;
 769             // TODO log something
 770             //&lt;/debug&gt;
 771         }
 772
 773         return function (target) {
 774             var me = this,
 775                 dispatcher = dispatchers[me.type] || cannotInject,
 776                 t = target ? (target.dom || target) : me.getTarget();
 777
 778             t = API.fixTarget(t);
 779             dispatcher(t, me);
 780         };
 781     }() // call to produce method
 782
 783 }, function() {
 784
 785 Ext.EventObject = new Ext.EventObjectImpl();
 786
 787 });
 788
 789 </pre>
 790 </body>
 791 </html>