1
// Copyright 2005 The Closure Library Authors. All Rights Reserved.
2
//
3
// Licensed under the Apache License, Version 2.0 (the "License");
4
// you may not use this file except in compliance with the License.
5
// You may obtain a copy of the License at
6
//
7
//      http://www.apache.org/licenses/LICENSE-2.0
8
//
9
// Unless required by applicable law or agreed to in writing, software
10
// distributed under the License is distributed on an "AS-IS" BASIS,
11
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
// See the License for the specific language governing permissions and
13
// limitations under the License.
14

15
/**
16
 * @fileoverview A patched, standardized event object for browser events.
17
 *
18
 * <pre>
19
 * The patched event object contains the following members:
20
 * - type           {string}    Event type, e.g. 'click'
21
 * - target         {Object}    The element that actually triggered the event
22
 * - currentTarget  {Object}    The element the listener is attached to
23
 * - relatedTarget  {Object}    For mouseover and mouseout, the previous object
24
 * - offsetX        {number}    X-coordinate relative to target
25
 * - offsetY        {number}    Y-coordinate relative to target
26
 * - clientX        {number}    X-coordinate relative to viewport
27
 * - clientY        {number}    Y-coordinate relative to viewport
28
 * - screenX        {number}    X-coordinate relative to the edge of the screen
29
 * - screenY        {number}    Y-coordinate relative to the edge of the screen
30
 * - button         {number}    Mouse button. Use isButton() to test.
31
 * - keyCode        {number}    Key-code
32
 * - ctrlKey        {boolean}   Was ctrl key depressed
33
 * - altKey         {boolean}   Was alt key depressed
34
 * - shiftKey       {boolean}   Was shift key depressed
35
 * - metaKey        {boolean}   Was meta key depressed
36
 * - defaultPrevented {boolean} Whether the default action has been prevented
37
 * - state          {Object}    History state object
38
 *
39
 * NOTE: The keyCode member contains the raw browser keyCode. For normalized
40
 * key and character code use {@link goog.events.KeyHandler}.
41
 * </pre>
42
 *
43
 * @author [email protected] (Erik Arvidsson)
44
 */
45

46
goog.provide('goog.events.BrowserEvent');
47
goog.provide('goog.events.BrowserEvent.MouseButton');
48

49
goog.require('goog.events.BrowserFeature');
50
goog.require('goog.events.Event');
51
goog.require('goog.events.EventType');
52
goog.require('goog.reflect');
53
goog.require('goog.userAgent');
54

55

56

57
/**
58
 * Accepts a browser event object and creates a patched, cross browser event
59
 * object.
60
 * The content of this object will not be initialized if no event object is
61
 * provided. If this is the case, init() needs to be invoked separately.
62
 * @param {Event=} opt_e Browser event object.
63
 * @param {EventTarget=} opt_currentTarget Current target for event.
64
 * @constructor
65
 * @extends {goog.events.Event}
66
 */
67
goog.events.BrowserEvent = function(opt_e, opt_currentTarget) {
68
  goog.events.BrowserEvent.base(this, 'constructor', opt_e ? opt_e.type : '');
69

70
  /**
71
   * Target that fired the event.
72
   * @override
73
   * @type {Node}
74
   */
75
  this.target = null;
76

77
  /**
78
   * Node that had the listener attached.
79
   * @override
80
   * @type {Node|undefined}
81
   */
82
  this.currentTarget = null;
83

84
  /**
85
   * For mouseover and mouseout events, the related object for the event.
86
   * @type {Node}
87
   */
88
  this.relatedTarget = null;
89

90
  /**
91
   * X-coordinate relative to target.
92
   * @type {number}
93
   */
94
  this.offsetX = 0;
95

96
  /**
97
   * Y-coordinate relative to target.
98
   * @type {number}
99
   */
100
  this.offsetY = 0;
101

102
  /**
103
   * X-coordinate relative to the window.
104
   * @type {number}
105
   */
106
  this.clientX = 0;
107

108
  /**
109
   * Y-coordinate relative to the window.
110
   * @type {number}
111
   */
112
  this.clientY = 0;
113

114
  /**
115
   * X-coordinate relative to the monitor.
116
   * @type {number}
117
   */
118
  this.screenX = 0;
119

120
  /**
121
   * Y-coordinate relative to the monitor.
122
   * @type {number}
123
   */
124
  this.screenY = 0;
125

126
  /**
127
   * Which mouse button was pressed.
128
   * @type {number}
129
   */
130
  this.button = 0;
131

132
  /**
133
   * Key of key press.
134
   * @type {string}
135
   */
136
  this.key = '';
137

138
  /**
139
   * Keycode of key press.
140
   * @type {number}
141
   */
142
  this.keyCode = 0;
143

144
  /**
145
   * Keycode of key press.
146
   * @type {number}
147
   */
148
  this.charCode = 0;
149

150
  /**
151
   * Whether control was pressed at time of event.
152
   * @type {boolean}
153
   */
154
  this.ctrlKey = false;
155

156
  /**
157
   * Whether alt was pressed at time of event.
158
   * @type {boolean}
159
   */
160
  this.altKey = false;
161

162
  /**
163
   * Whether shift was pressed at time of event.
164
   * @type {boolean}
165
   */
166
  this.shiftKey = false;
167

168
  /**
169
   * Whether the meta key was pressed at time of event.
170
   * @type {boolean}
171
   */
172
  this.metaKey = false;
173

174
  /**
175
   * History state object, only set for PopState events where it's a copy of the
176
   * state object provided to pushState or replaceState.
177
   * @type {Object}
178
   */
179
  this.state = null;
180

181
  /**
182
   * Whether the default platform modifier key was pressed at time of event.
183
   * (This is control for all platforms except Mac, where it's Meta.)
184
   * @type {boolean}
185
   */
186
  this.platformModifierKey = false;
187

188
  /**
189
   * The browser event object.
190
   * @private {Event}
191
   */
192
  this.event_ = null;
193

194
  if (opt_e) {
195
    this.init(opt_e, opt_currentTarget);
196
  }
197
};
198
goog.inherits(goog.events.BrowserEvent, goog.events.Event);
199

200

201
/**
202
 * Normalized button constants for the mouse.
203
 * @enum {number}
204
 */
205
goog.events.BrowserEvent.MouseButton = {
206
  LEFT: 0,
207
  MIDDLE: 1,
208
  RIGHT: 2
209
};
210

211

212
/**
213
 * Static data for mapping mouse buttons.
214
 * @type {!Array<number>}
215
 */
216
goog.events.BrowserEvent.IEButtonMap = [
217
  1,  // LEFT
218
  4,  // MIDDLE
219
  2   // RIGHT
220
];
221

222

223
/**
224
 * Accepts a browser event object and creates a patched, cross browser event
225
 * object.
226
 * @param {Event} e Browser event object.
227
 * @param {EventTarget=} opt_currentTarget Current target for event.
228
 */
229
goog.events.BrowserEvent.prototype.init = function(e, opt_currentTarget) {
230
  var type = this.type = e.type;
231

232
  /**
233
   * On touch devices use the first "changed touch" as the relevant touch.
234
   * @type {Touch}
235
   */
236
  var relevantTouch = e.changedTouches ? e.changedTouches[0] : null;
237

238
  // TODO(nicksantos): Change this.target to type EventTarget.
239
  this.target = /** @type {Node} */ (e.target) || e.srcElement;
240

241
  // TODO(nicksantos): Change this.currentTarget to type EventTarget.
242
  this.currentTarget = /** @type {Node} */ (opt_currentTarget);
243

244
  var relatedTarget = /** @type {Node} */ (e.relatedTarget);
245
  if (relatedTarget) {
246
    // There's a bug in FireFox where sometimes, relatedTarget will be a
247
    // chrome element, and accessing any property of it will get a permission
248
    // denied exception. See:
249
    // https://bugzilla.mozilla.org/show_bug.cgi?id=497780
250
    if (goog.userAgent.GECKO) {
251
      if (!goog.reflect.canAccessProperty(relatedTarget, 'nodeName')) {
252
        relatedTarget = null;
253
      }
254
    }
255
    // TODO(arv): Use goog.events.EventType when it has been refactored into its
256
    // own file.
257
  } else if (type == goog.events.EventType.MOUSEOVER) {
258
    relatedTarget = e.fromElement;
259
  } else if (type == goog.events.EventType.MOUSEOUT) {
260
    relatedTarget = e.toElement;
261
  }
262

263
  this.relatedTarget = relatedTarget;
264

265
  if (!goog.isNull(relevantTouch)) {
266
    this.clientX = relevantTouch.clientX !== undefined ? relevantTouch.clientX :
267
                                                         relevantTouch.pageX;
268
    this.clientY = relevantTouch.clientY !== undefined ? relevantTouch.clientY :
269
                                                         relevantTouch.pageY;
270
    this.screenX = relevantTouch.screenX || 0;
271
    this.screenY = relevantTouch.screenY || 0;
272
  } else {
273
    // Webkit emits a lame warning whenever layerX/layerY is accessed.
274
    // http://code.google.com/p/chromium/issues/detail?id=101733
275
    this.offsetX = (goog.userAgent.WEBKIT || e.offsetX !== undefined) ?
276
        e.offsetX :
277
        e.layerX;
278
    this.offsetY = (goog.userAgent.WEBKIT || e.offsetY !== undefined) ?
279
        e.offsetY :
280
        e.layerY;
281
    this.clientX = e.clientX !== undefined ? e.clientX : e.pageX;
282
    this.clientY = e.clientY !== undefined ? e.clientY : e.pageY;
283
    this.screenX = e.screenX || 0;
284
    this.screenY = e.screenY || 0;
285
  }
286

287
  this.button = e.button;
288

289
  this.keyCode = e.keyCode || 0;
290
  this.key = e.key || '';
291
  this.charCode = e.charCode || (type == 'keypress' ? e.keyCode : 0);
292
  this.ctrlKey = e.ctrlKey;
293
  this.altKey = e.altKey;
294
  this.shiftKey = e.shiftKey;
295
  this.metaKey = e.metaKey;
296
  this.platformModifierKey = goog.userAgent.MAC ? e.metaKey : e.ctrlKey;
297
  this.state = e.state;
298
  this.event_ = e;
299
  if (e.defaultPrevented) {
300
    this.preventDefault();
301
  }
302
};
303

304

305
/**
306
 * Tests to see which button was pressed during the event. This is really only
307
 * useful in IE and Gecko browsers. And in IE, it's only useful for
308
 * mousedown/mouseup events, because click only fires for the left mouse button.
309
 *
310
 * Safari 2 only reports the left button being clicked, and uses the value '1'
311
 * instead of 0. Opera only reports a mousedown event for the middle button, and
312
 * no mouse events for the right button. Opera has default behavior for left and
313
 * middle click that can only be overridden via a configuration setting.
314
 *
315
 * There's a nice table of this mess at http://www.unixpapa.com/js/mouse.html.
316
 *
317
 * @param {goog.events.BrowserEvent.MouseButton} button The button
318
 *     to test for.
319
 * @return {boolean} True if button was pressed.
320
 */
321
goog.events.BrowserEvent.prototype.isButton = function(button) {
322
  if (!goog.events.BrowserFeature.HAS_W3C_BUTTON) {
323
    if (this.type == 'click') {
324
      return button == goog.events.BrowserEvent.MouseButton.LEFT;
325
    } else {
326
      return !!(
327
          this.event_.button & goog.events.BrowserEvent.IEButtonMap[button]);
328
    }
329
  } else {
330
    return this.event_.button == button;
331
  }
332
};
333

334

335
/**
336
 * Whether this has an "action"-producing mouse button.
337
 *
338
 * By definition, this includes left-click on windows/linux, and left-click
339
 * without the ctrl key on Macs.
340
 *
341
 * @return {boolean} The result.
342
 */
343
goog.events.BrowserEvent.prototype.isMouseActionButton = function() {
344
  // Webkit does not ctrl+click to be a right-click, so we
345
  // normalize it to behave like Gecko and Opera.
346
  return this.isButton(goog.events.BrowserEvent.MouseButton.LEFT) &&
347
      !(goog.userAgent.WEBKIT && goog.userAgent.MAC && this.ctrlKey);
348
};
349

350

351
/**
352
 * @override
353
 */
354
goog.events.BrowserEvent.prototype.stopPropagation = function() {
355
  goog.events.BrowserEvent.superClass_.stopPropagation.call(this);
356
  if (this.event_.stopPropagation) {
357
    this.event_.stopPropagation();
358
  } else {
359
    this.event_.cancelBubble = true;
360
  }
361
};
362

363

364
/**
365
 * @override
366
 */
367
goog.events.BrowserEvent.prototype.preventDefault = function() {
368
  goog.events.BrowserEvent.superClass_.preventDefault.call(this);
369
  var be = this.event_;
370
  if (!be.preventDefault) {
371
    be.returnValue = false;
372
    if (goog.events.BrowserFeature.SET_KEY_CODE_TO_PREVENT_DEFAULT) {
373

374
      try {
375
        // Most keys can be prevented using returnValue. Some special keys
376
        // require setting the keyCode to -1 as well:
377
        //
378
        // In IE7:
379
        // F3, F5, F10, F11, Ctrl+P, Crtl+O, Ctrl+F (these are taken from IE6)
380
        //
381
        // In IE8:
382
        // Ctrl+P, Crtl+O, Ctrl+F (F1-F12 cannot be stopped through the event)
383
        //
384
        // We therefore do this for all function keys as well as when Ctrl key
385
        // is pressed.
386
        var VK_F1 = 112;
387
        var VK_F12 = 123;
388
        if (be.ctrlKey || be.keyCode >= VK_F1 && be.keyCode <= VK_F12) {
389
          be.keyCode = -1;
390
        }
391
      } catch (ex) {
392
        // IE throws an 'access denied' exception when trying to change
393
        // keyCode in some situations (e.g. srcElement is input[type=file],
394
        // or srcElement is an anchor tag rewritten by parent's innerHTML).
395
        // Do nothing in this case.
396
      }
397
    }
398
  } else {
399
    be.preventDefault();
400
  }
401
};
402

403

404
/**
405
 * @return {Event} The underlying browser event object.
406
 */
407
goog.events.BrowserEvent.prototype.getBrowserEvent = function() {
408
  return this.event_;
409
};
410

411